Day 13: Safari 5 First Impressions June 13, 2010

Today I’ve spent most of the day wandering around in the south of Amsterdam and when I got home there was an exciting update waiting on my Mac Pro—Safari 5. What’s new and improved?

This is post 13/30 for #30daysofcreativity.

Apparently, Safari 5 is now released and I’m very anxious to see what has changed and if it can compare with Chrome. So I quickly installed it and now it’s time to check it out for the first time. Let’s do it.

Everyday Browsing

The first thing I notice is that it launches quicker than the previous version. Now it’s actually very fast and loads quicker than Chrome which I normally use. The interface on the other hand hasn’t changed much.

The first web page I type into the address bar is Google.com and it loads extremely fast—reminds me of Chrome. The auto-complete drop-down seems slightly different with its rounded corners. I quite like it.

I browse around for a while on SitePoint.com. The pages load very quickly but I wouldn’t expect anything else since it’s running WebKit, like Chrome. Maybe it’s just me but the scrolling seems a little bit smoother than Chrome.

The deal-breaker for me is the search functionality in the address field. While in Chrome it’s extremely easy to search by just typing in whatever search term and hit enter, in Safari you need to either use the search field or press the down-key on your keyboard to select “Search for […]”.

To me, it doesn’t seem like a big update at first. Most of the application seems the same so I’m heading over to the Apple website to find out what’s new. Apparently, there’s quite a few things I haven’t noticed yet.

One of the new features is Safari Reader which automatically detects when you’re browsing an article, and lets you view it in a “clutter-free view” by clicking a small icon in the address field.

But when I’m trying this out on one of Sweden’s biggest newspaper sites, there’s no button to click. It works well on NY Times but the auto-detection of articles seems somewhat flawed. I’m trying another one of Sweden’s best and largest but it doesn’t detect a single article I browse.

What I can say though is that when it actually does work, the Safari Reader provides a very nice reading-environment without any distractions. It reminds me of the application in writing this blog post in, Scrivener, which has a very similar interface for writing.

Aside from better performance with improved caching and more, another new feature is that is has a lot greater HTML5 support. This is great and will certainly be useful in the future as more and more people turn to HTML5 when developing websites. We all saw the Google Pacman game which was a nice example of what can be achieved with this new standard.

I will probably start using it for some projects soon since you can get it working in other browsers by adding the missing DOM elements. Of course, that means it won’t work that well with Javascript disabled but for some projects it’ll be an interesting experiment.

There’s now a Safari Developer Program and soon a Safari Extensions Gallery. I’ve used extensions a lot for a long time in Chrome and now it has finally come to Safari. This is more of a necessity than a nice new feature in my opinion, since Chrome and Firefox has done it for ages.

Safari 5

Development

There’s apparently an improved Web Inspector which I of course have to try out right away. For us developers it’s extremely useful and almost vital to have this feature but can it compete with Firefox’s Firebug plugin?

The first question I’m asking is: where is it? Before upgrading, I could access it by right-clicking and I can’t remember where I activated it ages ago. I’m checking all the menus but can’t find it anywhere. I’m checking all the preferences without result. Searching through the Safari website I find that to activate it, I must “choose Show Web Inspector from the Develop menu”.

I have no developer menu so I search the help to find out that I need to activate it in the preferences. Good thing is the help is very responsive and immediately gives me the answer—thumbs up. There, at the bottom of the Advanced tab, is a setting to show the menu—I missed it the first time I looked for it. Great, so now we can try it out.

It actually surprises me as it has a pretty nice “Timeline” feature where you can see a timeline of all the loading, scripting and rendering that is done as the page loads. This can be useful at some point during a project but I recall having a similar feature in Firefox’s ySlow plugin, plus I have Firebug and Web Developer Toolbar.

I have to say though, this Web Inspector is a nice improvement. The “Elements” tab where, like in Firebug, you can try out different CSS rules and change the HTML and content, works very well. I haven’t even considered using Safari as my development browser before but since it’s definitely a lot faster than Firefox I might just make the switch.

There are loads of other new features and to name just a few, there’s enhanced keyboard navigation, voiceover screen reader, CSS3 web fonts, full-screen and closed captions for HTML5 video, hardware acceleration and a “smart address field” that besides the URL also looks at the page title of the website you’re searching for.

Safari 5

Conclusion

While on the surface Safari 5 may look like the previous versions, it indeed has many great improvements under the hood. Will I make the switch from Chrome? Not right now but I’ll consider it.

I will however try it out for a while as my development browser. It’s a lot faster than Firefox which sometimes feels like an necessary bottleneck in the development process. With this version of Safari, the Web Inspector may very well be good enough to replace Firebug.

All in all a great job by Apple but Google Chrome still feels “right” and the speed and simplicity of its search functionality is simply superior.