October 2006 Archives

As each year goes by the amount of browser/platform combinations continues to grow and grow. One of the main challenges we face as developers is trying to build sites that look great in all of the new browsers but don't look like a catastrophe in the older ones. What's the cutoff point though? Which browsers do you support and which do you not care about?

I don't really think there's a definitive answer to that question. I'd say that it largely depends on the site you're building and it's demographic. Code Scene, for example, is targeted primarily at web developers so I don't care if it doesn't work in Netscape 6. If you're a developer and your browser of choice is Netscape 6, then you have more problems than Code Scene can solve. On the other hand, if my target audience involved public schools and libraries which may have outdated machines I'd want to make sure that the site was accessible in older browsers.

"Accessible" should be the key word here. You'll go broke and/or crazy trying to get your site to look pixel-perfect in every browser. You should concentrate on making it perfect in the ones that count and making sure that at least the content is accessible (although not 100% pretty) in the others. You can do this with a wide variety of tricks such as using @import to include your CSS files. Modern browsers will render them. Netscape 4 will ignore it completely and render an accessible non-styled text version of the site.

Again, while the answer to the "What browsers should I test in?" question is different for each client, there is no question that some browsers are more important than others so this is my opinion on which should be prioritized when building a new site.

I've based this on browser data from TheCounter, W3Counter, Browser News, Market Share, and the analytics reports of a few sites I've built. If you're re-building an existing site, the analytics reports are a great way of seeing what browsers people are using.

Without further adieu, here are my recommendations for which browsers to prioritize.

Priority 1 - Your site MUST work flawlessly in these browsers since they account for the majority of Internet traffic.
Internet Explorer 6
Internet Explorer 7
Mozilla Firefox 2.0
Mozilla Firefox 1.x

Priority 2 – These browsers are somewhat older and/or less popular but your site should look good and work properly in them. (If you expect large amounts of traffic from Mac or Linux users then you may want to move Safari and Konquerer to Priority 1)
Internet Explorer 5.5
Netscape 7+
Safari 1.2+
Camino 1+
Opera 9+
Mozilla 1.x
Konquerer 3.4+

Priority 3 – These browsers are outdated and not widely used at all. Steps should be taken to make sure the site is accessible and/or downgrades to a text-only version in these browsers.
Netscape 6
Mac Internet Explorer 5.2
OmniWeb
Netscape 4.x
Internet Explorer 4.x
Lynx

Again, these are just general recommendations. Always keep your audience in mind when making the final decision. If you have agree/disagree, leave a comment below.

What does your website look like in Safari 1.3? How about the Firefox 2.0b1 beta? The Konqueror browser on a Linux box? You really have no idea do you?

Most developers test their pages on the one or two browsers they have installed on their machine but rarely in any others and usually never in any older legacy browsers. This isn't necessarily a sign of laziness. It's just really time consuming and expensive to setup a dozen test machines with different browser configurations. That's where BrowserCam comes in.

BrowserCam is an online service which has all of these platform/browser combinations setup for you. With a BrowCam account you can test how your sites render on the widest range of possible clients and make sure everything is perfect before launch. See BrowserCam's complete list of browsers.

There are two main features available through BrowserCam.

• A Capture server where you provide a URL and a list of options and BrowserCam will give you screenshots of each platform/browser configuration you've chosen.
• A Remote Access service where you can actually log into these machines (through VNC) and use the browsers from your desktop.

To demo, I've used my account to take screenshots of how Code Scene looks in a wide range of browsers.

Linux Konqueror 3.4.0-5
Mac Camino 1.0
Mac IE 5.2
Mac Safari 1.2
Mac Safari 1.3
Mac Safari 2.0
PC AOL 9.0
PC IE 4
PC IE5
PC IE5.5
PC IE6
PC IE7RC1
PC Firefox 1.5
PC Firefox 2.0b1
PC Mozilla 1.6
PC Mozilla 1.7
PC Netscape 4.78
PC Netscape 6.2
PC Netscape 7.2
PC Opera 8.5
PC Opera 9

As you can see, Code Scene looks great in most of the newer browsers while failing miserably in some of the older ones. So what browsers should you really care about? Stay tuned for my next post on that.

For now... if you're a developer and need to QA how your site looks in different browsers, BrowserCam is the cheapest and easiest way to make that happen.