Browser Wars: Pixel-Friendly Browsers on the Mac

Awhile ago, Kyle Dreger responded to a Lifehacker article comparing Windows browsers based on pixel-usage by making his own version with Mac browsers. What struck me about his list was how few browsers he used: only four, and all of them were cross-platform. I figured I should throw in some more browsers, like Shiira, Camino, etc; some that only run on the Mac. I used the same application for measurement that he did, PixelStick.

Testing so many browsers presents a problem: Not all browsers use the same UI conventions. For example, Opera doesn’t have a bookmarks bar; its bookmarks are contained in a sidebar. To remedy this, I’ve broken the tests into two sections, showing different parts of the browser chrome. Section one will be with the bookmarks bar hidden, so only the tab bar and toolbar are showing, so I’m able to include Opera. Section two will be with the bookmarks bar shown, so Opera will be excluded from it. I’ll also include a third section that shows the data overall. I omitted testing status bars because Chrome doesn’t really have one, and I’d argue that most people don’t use them.

Tab Bar and Toolbar

I’ll go ahead and say that there are two winners here: Chrome 5 and the Safari 4 beta. But why is Chrome also a winner when the Safari 4 beta so clearly trumps it? My reasoning is that Chrome is a current browser, and that I had to go through a strange rigmarole process to even get the Safari 4 beta running, and it still crashed every time I opened a new tab, so it’s not really usable.

The loser here, by a large margin, is iCab. This was using the default configuration, so I messed with it a little, used small icons and hid the text beneath them. It still came in last, right behind Shiira with 91 pixels, only beating itself. iCab developers, if you’re reading this, please make iCab less space-hungry.

What’s interesting about the comparison between Firefox is that tabs-on-top actually uses slightly more pixels than tabs-on-bottom. Also, using small icons will save you eight pixels.

Here’s a screenshot comparing the top six browsers in this section:

With Bookmarks Bar

Unsurprisingly, the winner here is the Safari 4 beta. However, I was surprised to find that the second winner was Safari 5. Yes, Safari 5 narrowly beats out Chrome by just one pixel. iCab is last in place, by a large margin, again.

I also figured out that, on average, you can save about 20 pixels without the bookmarks bar.

Here’s another screenshot showing the top five browsers in this section:

Overall

I’ve made two graphs that show the data overall: the first by number of pixels in ascending order, the second by browser. I’ve also included a couple of bonuses: I measured Internet Explorer 5 for Mac and Netscape 9. IE doesn’t have a tab bar, so I just measured it with the bookmarks bar. It makes a good watermark for big browsers. And yes, iCab still comes in last, even behind IE. Netscape was surprisingly small, with the minimum being 83 pixels, just behind Sunrise.

Is pixel-friendliness important in a browser? Does it affect which browser you use? Sound off in the comments.