How to Test Your Website on Multiple Browsers on Multiple Operating Systems to Test Compatibility

November 1, 2009DavidWeb Development0

As a web developer, one of the most common tasks I have in developing a website is making sure that the sites I design look the same in all major browsers. As it is in my opinion, impossible to test a site on every browser for every operating system, at this point in time I currently test all of my websites on IE6, IE7, IE8, Firefox and Opera.

Addendum: If you are running Windows Vista (and therefore IE7 or IE8), and want a way to test IE6 sites on your own machine, see this post about how to test IE6 websites in Vista using Microsoft Virtual PC 2007.

One of the most important parts of this testing is selecting which additional browsers to test sites on, and this determination really depends upon the requirements of the client. As much as I’d prefer to eliminate IE6 from the mix, many corporate environments still run on IE6, and asking them to upgrade hundreds or thousands of machines because I don’t want to code for IE6 is simply not acceptable.

There are times, of course, where a certain web application won’t run in a certain browser, but again — that fact just underscores the importance communicating expectations with your client ahead of time.

It’s easy to test on IE7 and Firefox, and also easy to test on IE6 if you have an XP machine that still has IE6. Because it’s extraordinarily difficult to run IE6 and IE7 at the same time on the same machine, I don’t advise trying to run them both on one computer. A terrific option to ease your development process is to run IE7 and Firefox, and then run IE6 in a Virtual PC Windows XP setup. Having all three browsers on one machine is very helpful, as it obviates the need for you to upload the files to a local network and then move from machine to machine to test.

Other than the browsers mentioned above, I don’t believe it’s practical to setup a Mac and a linux box just to test the litany of additional browsers that are out there . Because I want to see what the sites look at in practically every browser I can possibly test in, I use a website called Browsershots to help out. Browsershots is a site that will take screenshots of a URL that you enter; once the screenshots are created you can view them and get an idea of how a site looks. lets you choose the platform and browser combinations that you want to test your site on, and includes options for screen resolution, javascript and flash, too.

Note that if you have a robots.txt file that is set to DISALLOW, you will need to temporarily remove this directive (or swap in a robots.txt file that isn’t restrictive). Because I publish preview/test sites for my clients on a development domain, this domain always has a disallow directive, as I don’t want this test site being indexed by Google or other search engines.  Naturally I first finish developing locally on the above browsers before I upload the site to do additional testing on Browsershots. And don’t forget to restore your original robots.txt file once you are done testing!

So generally speaking, if your site looks good in IE6, IE7, IE8 and Firefox, you can feel pretty comfortable that your site looks good.   But you want to take that extra step (that I naturally like to do), will let you take a peek at screenshots of your site without having to setup a ton of develpment environments.

Tagged ,

Related Posts

| More

SpiderOak Online Backup, Storage, Access, Sync, and Sharing

We are currently offering a free copy of our 16-page eBook, "How to Organize your Digital Photography Collection" to everyone who signs up for our free newsletter. This eBook will review how to organize your digital photos, discuss metadata, and give you an overview of software than can help you with your digital photography workflow. Sign up in the signup area, located in the right-side column of every page on this site, and read your copy now!