Webkit & Chrome UI Problem and Solution

Chrome's Tabs

I’m starting to like Chrome. I used it as my default browser for Windows for about a week before its various subtle bugs drove me back to Firefox (I got over my annoyance with Firefox…). Under Windows, Chrome is aesthetically challenged, but on the Mac it’s lovely. My one quibble is with the way tabs are positioned.

Chrome does put its tabs above the URL which—conceptually—belongs to the web page you’re looking at. But the tab also contains your bookmarks, which are global context.

Webkit's TabsWebkit/Safari has, without doubt, the most bizarre tab arrangement in the history of computing. It looks quite nice, but it makes no sense at all. It doesn’t work badly, and I guess if you’re going to give up on making sense conceptually, why not go for aesthetics?

I think there’s a very simple solution. Put the freaking tabs on the side of the window—like iTunes or Finder. There’s one browser that does this—Omniweb.

I actually bought a copy of Omniweb back when it was pretty much the best alternative to Internet Explorer 5.1—shortly afterwards Camino came out, followed by Firefox, followed by Safari. Omniweb is now free and webkit-based.

Omniweb's Drawer

The only problem with Omniweb is that the “tabs” are placed in a drawer, which is ugly, has the disadvantage of not visually associating the tabs with the browser view as Finder does, and—worst of all—being a freaking drawer. Even so, Omniweb probably has the best thought-out UI of any current browser. (And not just because it is the only browser to deal with “tabbed” browser windows in a sensible way.)

Aside: drawers should simply not be used for UI elements you expect to use all the time. I’d go so far as to say that Mac OS X would be better off without drawers in the first place. I can’t think of an application which uses a drawer that wouldn’t be better served by simply integrating the same stuff into the parent window. (Pathfinder’s pathological use of drawers is the main reason I can’t bear using it.)

Finder's sidebarHere’s Finder. This is how to do browser tabs. (It’s a shame Finder doesn’t actually dynamically insert open windows in its side menu—it would fix about 75% of what’s wrong with it.)

Tabs are, in general, a stupid idea. They waste vertical real estate (which is more valuable than horizontal, especially on today’s widescreens), and they do so inefficiently (since titles are wide the squat) so you frequently can’t see all your tabs. They’re really only useful in cases where they let you pick from between a small number of options (e.g. selecting views and palettes in Photoshop or Unity)—cases where a side panel would be massive overkill. This is why a lot of more complex programs have stopped using tabbed dialogs for their preferences.

Here endeth the lesson.

The Video Tag

Firefox 3.5 is out, and, among a slew of major improvements, it now supports the HTML 5 <audio> and <video> tags. I don’t post many video clips to Daring Fireball, but henceforth, when I do, it’ll be with the <video> tag. IE users can suck it.

John Gruber, Daringfireball

I couldn’t agree more. It would be especially nice if the <video> tag were to support FLV, (a) eliminating the need for idiotically customized FLV players, and (b) Flash.

Upgrade your web browser to Firefox 3.5 or Safari 4 or better to watch this video.

Do you see a video above? If not, the video tag on your browser isn’t fully supported (at least for QuickTime).

There’s just one problem: Gecko (i.e. Firefox’s HTML engine) only currently supports .ogg containers, which is about as useful as, er, something that isn’t useful. It doesn’t even support H264 or MP4v.

Google Chrome

Google has officially announced it will be releasing its own browser, named Chrome. The web comic explaining their thinking is well worth a look, but the key points are:

Each browser tab is a separate process. This means that one web page hanging or script stalling only affects that page. Your browser doesn’t crash or hang — individual tabs crash or hang and can be killed. It’s so obvious it’s brilliant. I imagine Firefox, Camino, and Safari will all follow suit as soon as they can.

Google has been working on a new JavaScript engine, named V8, that’s roughly twice as fast as the latest versions of Firefox or Safari nightly build. Remember that these engines were in turn a lot faster than Internet Explorer or anything else we had a year ago. We’re looking at something like a 10x improvement in overall JavaScript performance over the last two years.

It’s based on Webkit.

It’s entirely open source.

Safari 3.1.1

Safari Web Inspector

My friend Andrew pointed out in my post on FireFox 3.0b5 that it was too late to get him to try it, since he’d just given up on FireFox, switched to Safari, and wasn’t looking back. I’ve just made the switch too, after finding FireFox 3.0b5 both just as unstable as 2.0.0.14 and subject to some annoying rendering bugs and random thunks. I can’t just abandon FireFox — the web developer and FireBug extensions are just too damn useful — but it’s not going to be my daily browser for the foreseeable future.

For a long time, Safari has had the distinction of being producing the best looking web pages, and running JavaScript really fast (whether it’s the fastest is a matter of debate, but it sure feels quick). It has a better feature set than Internet Explorer (canvas support, anyone?), and supports a bunch of CSS extensions, such as shadows under text, that no-one else does.

And, frankly, it has the cleanest and most attractive user interface.

Most importantly for me, Safari’s Develop menu (which used to be its Debug menu) offers something of an alternative to the Web Developer plugin for FireFox. Although Drosera (the Safari JavaScript debugger) has been around for some time, it’s not yet part of the Safari release, and getting it is something of a chore. You need to download the Nightly Build (source code) and then “attach” Drosera to either Safari or WebKit (the open source version of Safari). Even if I could be bothered, Safari still lacks a few of the Web Developer plugin’s best features, such as the ability to see the generated HTML you’re looking at.

But, as a basic, daily browser — I’m afraid Safari has FireFox beat for now.

Safari for Windows, Mac, and probably iPhone found to have tons of security holes

As noted here and many other places, Safari turns out to be full of security flaws at least some of which are in the production (2.0.4) version as well as the 3.0 “beta” (it doesn’t show beta in its About box).

Safari on Windows is proving pretty buggy for me, it doesn’t save preference changes among other things. (Ironically, it crashes when I try to view a MacWorld Blog page complaining about the uninspiring announcements at WWDC.) Personally, I think it’s nice to see security flaws in Safari exposed because, hopefully, Apple will be forced to fix them. The nastiest exploit I’ve seen tricks Safari into running arbitrary command lines under Windows (via cmd.exe).