Safari’s New Interface: A Shiny Mess

Though the Web browser has grown in importance and changed drastically in function since the first version of Netscape Navigator ruled a fledgling Web, its interface has not changed that drastically.
Though tabbed browsing introduced an important new element, most browsers sport forward and back buttons along with stop/reload buttons, an address bar and, more recently, a search box. Most browsers today look enough like Netscape Navigator 0.91 that few would be lost if they traveled back in time.
But lately there has been an attempt to shake that up some. First came Google Chrome, introducing the idea of tabs on top, and now comes the new beta of Safari 4, which adds even more new interface changes.
Though I’m always a fan of innovation, there’s a lot about these interface changes that bug me and not just the new “bug report” button. I’m admittedly no interface designer, but there are a lot of things that I would definitely do differently…
Just to be Clear
I want to make it clear that I really do like most of what I see in Safari 4. It’s a solid browser over all, especially for Mac users. I like how fast JavaScript moves on it, I like the new “Top Sites” feature and the way it is presented, I like the use of coverflow and I like the overall stability and speed. For doing the things that a browser does, it’s great.
The problems I have are isolated with the interface and some of the changes they’ve made since version 3 and even apart from the latest Webkit nightlies. They seem to have taken a serious departure from the standards of browser interface design and, though I have to admire their daring, it seems they’ve made a few missteps.
Specifically, there are two problems that have me unnerved.
Tabs on Top… Way on Top
When Google Chrome introduced the idea of moving the tab bar to top of the browser, it was a controversial move. I, personally, don’t like tabs on top because it is an ineffeciency for me. Look at this example.
As you can see, if I want to get my cursor from where it is locate to click on a tab, I have to go over not just where the tab bar should have been (the red box) but over the bookmark toolbar and address toolbar. This not only doubles the mouse distance for this very short move, but puts my most common mouse action farther away from where my mouse usually is. Most uses, for me, of the address and/or search boxes are through a command+t to open a new tab and then using the tab key to access the needed box.
However, I can’t begrudge Safari that as Chrome did indeed start it and it does have the benefit of giving one more room in the browser pane. Where Safari went wrong was having the tab bar also double as the title bar of the Window in both Windows and OSX. This is taking a weak idea and making it downright stupid.
The title bar is a crucial part of the Window. It’s how you interact with that particular window on your desktop, including minimizing, shading, closing and moving it. Now it also has to play the role of tab bar? This means you have to be able to open, close and reorder tabs tool. That puts no fewer than 7 major functions in one very narrow strip of screen real estate.
To make this work, Safari added a new convention. In Firefox or Safari 3, if you wanted to drag a tab, you just clicked anywhere on the tab and dragged it, easy. With Safari 4, click and dragging a tab blindly grabs the whole window. Instead, you have to grab the three diagonal lines on the right hand side of the tab to move it around. It’s another convention to learn and adapt to.
Is it minor? Perhaps. It isn’t the worst thing I’ve seen (anyone tried using the latest version of Microsoft Office?), but I don’t see any reason to crowd the title bar with tab functions when it hardly saves any screen real estate at all and seems to open the door to a lot of mistakes.
The Reload Button
Real fast. On the screenshot above, find the reload button. Trick question. It isn’t in that screenshot.

The reload button is actually IN the address bar, the same way the RSS icon usually is.
it was bad enough when IE7 moved the reload button to the other side of the address bar, now Safari has to find a whole new place that no one will think to look for it. I grant that it is not a button that is commonly used and I agree with combining it with the “stop” button, if you need one you definitely don’t need the other, but it is it so rarely used that we need to play hide and seek with it?
The reload button is an important part of the browser for many people. I use it refresh statistics of keep on top of Twitter if I’m not in my Tweetdeck or to keep my email fresh if Gmail is acting funny. I don’t use it often but when I need it I don’t want to go hunting for it.
This is another classic case of change just for change’s sake. The nagivation bar has never been particularly crowded or cluttered and moving the reload button to the end of the address bar just necessitates that the address bar be longer and adds more buttons to the end of it, not actually cleaning anything up. Worse still, any gain is lost with the addition of the bug report button at the far right.
Because, you know, there’s a button I’m going to use a dozen times a day. At least I can remove it with “Customize Toolbar”.
Things that Still Suck
With that in mind, there are still a few issues I have with Safari that have been around since version 3 and beyond that I was hoping they’d fix with version 4 but, so far, no luck.
- One Window Mode: Why is it that I am constantly closing windows when I supposedly have pop ups blocked? Gmail links open in new windows as do any links have that designation. The problem is that, with Firefox, new window secretly means new tab, as it should be. With tab browsing there is NO REASON to have two windows.
- Tab Overflow: Tab overflow still sucks. You now get a “…” and you can click on that to get the full tab list but you have to close enough tabs to fit in your window before you can rearrange latter tabs. Firefox overflow management isn’t perfect, but a lot better.
- Favicons: Seriously? No favicons in tabs? You have to be kidding me. It is almost impossible to tell, at a glance, what is in which tab and, when you combine that with the ways tabs get compressed it is a real mess. You don’t even have to sacrifice screen real estate, just make them double as the close buttons on hover.
These are just a few of the UI decisions with Safari that I have a beef with that haven’t been fixed. Though the new version 4 is an improvement in almost every way, it takes the existing UI problems and magnifies them all many times over.
Say Something Nice
Real fast, since my mother would not be happy that I haven’t said anything nice about the new UI, I do have a few words of praise.
Here are a few new things that I actually do appreciate:
-
li>Tab Highlighting: One of the problems with Safari 3 was that it was almost impossible to see what tab you’re in. All of them looked about the same. With 4 that problem is gone. The tab you’re in has a noticeably different tint to it and the tab itself is wider. A pretty slick way of handling the problem.
- Top Site Interface: This is a bit of cheat since it is only new because the feature is new, but managing the top site feature is very slick. I ended up making mine all pushpins since my browsing history is too thin to be of much help to it (I switch browsers too often). You can ban sites from appearing, drag and drop entries and doing so automatically makes them “stickies”. Very intuitive.
- The “Wonder Bar”: The new address bar functionality is simply superb. If you type in a domain it defaults to taking you to the root, not to some random URL on it. However, if you want said random URL, you can always arrow down. It also is smart enough to pull from both your history and your favorites. Though not quite as smart as Google Chrome’s one bar, it is pretty slick and is a huge leap forward.
Though it seems that most of the interface decisions put this new version of Safari back a ways in usability, there are at least some people on the team who aren’t asleep.
Bottom Line
Me, I like Safari. It’s not a perfect browser and the extension junkies are going to always harp on how you can turn Firefox into everything from a Web development client to a blender. I have nothing against Firefox, but it seems to me that Safari, especially 4, just moves that little bit faster, looks a little cleaner and is a little more gentle on my system. There are a few Firefox extensions I love, but, for most things, Safari gets the job done fine and a bit faster.
However, even as I use Safari 4 to type this, I feel like I’m tolerating the interface. Where once it was one of the draws to the browser, now it is a drawback. If it weren’t for the souped up page loading and JavaScript, I probably would just ignore it and go back to Firefox.
For right now though, I plan on using it. I may switch back in a few days but so far I am pretty happy. I just wish they could get these UI bugs fixed. It might make it a little more bearable to use.
Final Note: Share some of these gripes? Fix them using the commands in this video. (Note: The Reload button is NOT in my Customize Toolbar for some reason. I’ve checked repeatedly).


