Zoom-Zoom: comparison of browser page zooming

Ever since the dawn of men, humans have asked the question, what is the best internet browser? To tell you the truth, I don’t know and I don’t care. I’ll use whichever one can offer me the best experience and features that I want, not based on someone else’s opinion. One feature in particular has been on my shopping list for quite a long time, and that is the “page zoom” feature.

“Page zoom” is a feature on just about any modern browser. The idea is simple, magnify the content of a web page to enhance visibility in situations where you can’t sit 1-inch infront of the screen. Simple in theory, complex in practice. I took a few screenshots comparing how each of the three most-preferred Windows browsers (Firefox, Internet Explorer 7, Opera) handled “page zoom”.

1zoom150.jpg
1zoom400.jpg
These first set of tests were taken from the homepage of my blog.

2zoom150.jpg
2zoom400.jpg
The second set of tests were taken from the Australian newspaper’s website, The Age.

Firefox 2.0 (Applies to 1.5 as well)

Firefox has probably the worst “zoom” feature out of the three browsers. It is nothing more than just “large text”, which is quite a shame really. The problem is when Firefox doesn’t scale the CSS styling and images when zooming causes text to easily overgrow the size of the constrained layout. There is a “PageZoom” extension which adds this missing functionality, as well as a request at BugZilla to implement this function in the future.

Internet Explorer 7

Internet Explorer 7 has implemented a “not-so-polished” zooming feature. I say this because whilst it does actually support true scaling of font, CSS styling and images, it exhibits some bugs that can destroy the layout. For example, in the first set of tests @ 150%, the second navigational tab text is misaligned, and also the competition promotion text missing a spacing between the sentences. In the second set of tests @ 150%, the website’s faux background does not scale in proportions, leaving some of the content on a gray background. But on the plus side, IE7 supports zooming centre-aligned pages. That is, it will automatically refocus the alignment of the page to the centre of your screen no matter how far you zoom. Which is definitely a handy feature on most news websites. Whereas without refocus, you would zoom in 200% and see nothing but the background.

Interesting to note also, Internet Explorer 7 actually scales the Flash content as well. So you can have all your “Press here to make a fart noise” banners in extra-large too!

Opera 9

Opera has the most polished zooming feature out of all three browsers. It comes to me a surprise because Opera has been stereotyped as the browser with the unconventional CSS rendering engine. It scales fonts, CSS and images perfectly, leaving everything proportionally aligned. It also supports zooming centre-aligned pages, however, has a different approach to how IE7 handles it. Instead of maintaining the focus in the centre of the page, it refocuses to the left most margin of the layout. This is quite a smart feature, which makes sense because most content is left-aligned. The only gripe I have against Opera’s zooming feature is the shortcut keys. Failing to follow the standard used by both Firefox and Internet Explorer, the keys are the plus and minus signs on your keypad instead of CTRL + Plus.

And the winner is…

Overall, Opera 9 has undoubtedly the best page zooming feature out of all three browsers. It scales everything like it should and even focuses on where you should start reading. Followed tightly behind with a few rendering bugs is Internet Explorer 7. And sadly the last of the pack is Firefox, looking unlikely to support page-zooming officially in the near future.

8 insightful thoughts

  1. Actually, I kind of like the way firefox does it, mainly because I’m not interested in the images when I visit a website. Everybody’s trying to win the “I’ve got the smallest font” competition these days, and it’s nice to just Ctrl++ and increase just the text. And isn’t that the point? Yeah I know, accessibility and all that.

  2. Not only do I zoom because the font is small, but I could literally be sitting 3 feet away from the monitor. I want to see all the content on the website (text+image), so page zooming would benefit me.

  3. Let’s call things what they are. Firefox doesn’t have zooming at all, it’s just increase/decrease font size. IE7 actually allows you to zoom in however.

  4. Your results solidify my thinking that for a decent browsing experience via Windows Media Center that Opera is a must. The scaling makes it easier to browse from your couch and see the text without straining / squinting to capture the small text.

  5. i use opera’s zoom function a lot, since it’s the only way to watch youtube and dailymotion videos in true fullscreen (without having to see borders or the player menu).

    after trying all firefox extensions to accomplish the same with that favourite browser of mine, i had to realize that it’s just not possible to force firefox to scale flash video. so opera is the first choice for me for that purpose (who wants to use ie anyways?). for the rest i usually stick to firefox

    as for the “failing standards”:

    “Failing to follow the standard used by both Firefox and Internet Explorer, the keys are the plus and minus signs on your keypad instead of CTRL + Plus.”

    may i remind you that opera supported zooming pages for nearly 6 years now and that firefox and ie just implemented that feature recently? why should a browser with a big user base change it’s shortcuts it had for eons just because it’s opponents decided to use different ones? makes no sense…if at all, then opera’s shortcut for zooming should be considered being standard

  6. Opera 9:

    “Instead of maintaining the focus in the centre of the page, it refocuses to the left most margin of the layout.”

    That’s great for English, but what about languages that go from right to left, or top to bottom? Or right-aligned layout?

    And mooh, if you use that argument, then why should IE change its CSS layout just because others had the benefit of developing their engines after mature standards had emerged? Should IE’s layout not be considered standard?

Comments are closed.