Safari 4 Beta: UI Disaster

A few days ago, Apple surprised everyone by releasing the first beta of Safari 4, the company’s latest version of their WebKit browser. While I generally love Safari on the Mac (my browser of choice on that side of the fence), I’ve never felt as comfortable with it on the Windows side of things. In any case, this latest beta has made a very bold move in the interface department, and I’m sad to say that it’s not for the better. Let me explain where it went wrong for Apple.

When Google pushed out Chrome, it had the tabs in a different place than most other browsers. Wait, let me correct that – it had the browser controls in a different place. Instead of the browser controls being located atop the tabs, they were placed inside the tab. The result was that each web page had its own set of controls. The difference between “moving the tabs” and “moving the browser controls” may seem arbitrary, but as it turns out, it seems to explain perfecty well why Safari 4 is such a UI disaster.

You see, everybody on the web focussed on the tabs in Chrome being part of the titlebar, while in fact, they are not. When you run a Chrome window in a non-maximised state, the tabs are actually underneath the titlebar; only when you maximise a Chrome window do they appear to be part of the titlebar. I specifically say “appear”, because the tabs are actually an overlay.

In Chrome, the browser controls have become part of the web page, which from a web application perspective makes perfect sense: the browser buttons and address bar, in essence, are part of the web application. In other words, each tab in Chrome is an “application”, one stacked atop another. In any case, there is a clear distinction between the titlebar and tabs, not only functionally, but also visually. The titlebar and window frame in Chrome are Aero Glass, while the tabs are content-coloured. This makes the distinction between the two perfectly crystal clear.

This is where it goes wrong for Safari 4. There, the tabs are the titlebar, leading to a rather schizophrenic UI widget: it has to act as a titlebar and a tab bar, and consequently, does neither of the two very well. Since you have to be able to drag the window via this new tabtitlebar widget, Apple had to create a special and small handle for moving tabs, while making the tabs themselves the place to drag the window. This design decision is something I expect from a 6 year old who writes his fist tabbed text editor – not from a company that prides itself on UI design.

Apple’s tabtitlebar also has other oddities. The “3D” effect on the tabtitlebar is too overdone, giving me the strange sensation that my monitor is a 10km abyss. Taking the right-hand window controls section into account (which is lower down in the abyss than the active tab), as well as the fact that even if you have ten million tabs, the deepest tab still has the same effect as the one just below the active one, and Apple’s tabtitlebar gives me the feeling I’m looking at an M.C. Escher sketch.

That’s not all, though. Because Apple wanted the tabs to make up the titlebar, they had to ditch this well-established concept of spatial memory, making tabs change size continuously, since even if you have one tab, it needs to be wide enough to cover the entire titlebar. This makes the resize handle and tab title move around like crazy. I thought that after the GNOME panel taskbar button width disaster we had learned that this is a Very Bad Idea ™.

To me, it seems like Apple had heard that “Chrome has tabs on top”, but instead of just being honest and admitting that Google got it right, they set a goal for themselves to make as many arbitrary and useless changes as possible so they could still claim they were innovating. All these changes resulted in this botched and confusing tabtitlebar abomination that not only looks horribly out of place on both Mac OS X and Windows, but is also a functional disaster.

I hope Apple’s Safari engineers recover from this monumental design frak-up quickly, because if this stays the way it is, I won’t be using Safari on my Mac anymore. Which is a shame, since Safari 4 comes packed with lots of other interesting and useful features. I also like the effort to make Safari more native on Windows, but it’s two steps forward, ten steps back.

84 Comments

  1. 2009-02-28 11:56 am
    • 2009-02-28 12:10 pm
      • 2009-02-28 3:23 pm
        • 2009-03-02 2:34 am
    • 2009-02-28 3:42 pm
      • 2009-03-01 2:07 am
        • 2009-03-01 9:46 pm
          • 2009-03-02 4:10 pm
  2. 2009-02-28 12:18 pm
    • 2009-02-28 3:52 pm
    • 2009-03-01 5:39 am
      • 2009-03-01 7:24 am
        • 2009-03-01 8:46 am
          • 2009-03-01 9:41 am
          • 2009-03-01 2:07 pm
  3. 2009-02-28 12:22 pm
    • 2009-02-28 12:31 pm
      • 2009-02-28 3:04 pm
        • 2009-02-28 10:35 pm
  4. 2009-02-28 12:25 pm
    • 2009-02-28 4:02 pm
    • 2009-03-02 4:44 am
      • 2009-03-02 5:56 am
        • 2009-03-02 5:30 pm
  5. 2009-02-28 1:17 pm
  6. 2009-02-28 1:44 pm
  7. 2009-02-28 3:04 pm
  8. 2009-02-28 3:16 pm
  9. 2009-02-28 3:16 pm
    • 2009-02-28 3:34 pm
      • 2009-03-01 12:53 am
      • 2009-03-01 5:13 am
      • 2009-03-01 11:03 pm
      • 2009-03-05 6:34 pm
    • 2009-02-28 3:56 pm
      • 2009-02-28 4:13 pm
        • 2009-02-28 4:47 pm
        • 2009-02-28 7:57 pm
      • 2009-03-05 6:50 pm
    • 2009-02-28 6:51 pm
    • 2009-02-28 7:17 pm
    • 2009-03-02 2:20 am
    • 2009-03-05 6:32 pm
  10. 2009-02-28 3:41 pm
    • 2009-03-01 6:12 am
  11. 2009-02-28 4:27 pm
    • 2009-02-28 4:48 pm
  12. 2009-02-28 5:02 pm
    • 2009-02-28 9:40 pm
      • 2009-03-05 12:40 pm
    • 2009-02-28 11:07 pm
  13. 2009-02-28 5:56 pm
    • 2009-02-28 6:33 pm
  14. 2009-02-28 6:24 pm
  15. 2009-02-28 6:30 pm
  16. 2009-02-28 6:58 pm
  17. 2009-02-28 7:25 pm
    • 2009-03-01 2:30 am
  18. 2009-02-28 8:11 pm
    • 2009-02-28 11:40 pm
  19. 2009-02-28 8:36 pm
  20. 2009-02-28 8:43 pm
  21. 2009-02-28 9:44 pm
  22. 2009-02-28 10:39 pm
  23. 2009-02-28 11:08 pm
  24. 2009-02-28 11:28 pm
  25. 2009-02-28 11:39 pm
    • 2009-03-01 1:42 am
      • 2009-03-01 2:18 am
        • 2009-03-05 2:26 pm
  26. 2009-02-28 11:39 pm
  27. 2009-03-01 12:47 am
  28. 2009-03-01 3:51 am
  29. 2009-03-01 7:27 am
  30. 2009-03-01 5:55 pm
  31. 2009-03-01 6:02 pm
    • 2009-03-05 2:14 pm
  32. 2009-03-01 6:29 pm
  33. 2009-03-01 6:37 pm
    • 2009-03-01 6:38 pm
  34. 2009-03-03 11:14 pm
  35. 2009-03-05 6:43 pm