Do you know what your site looks like?

by Martin Reed on 23 May 2007 in Articles

Sounds like a ridiculous question, right? Well no, it isn’t. What your site looks like to you is not necessarily how it looks to others. I am not talking purely about web accessibility here – I will leave that for another article.

In this post I want to talk about how different browsers, operating systems and screen resolutions can result in your beautiful site looking a complete mess to others. I will also offer advice on how you can help combat this.

Use clean, standards based code

One way you can help reduce the number of discrepancies between browsers and operating systems is to use clean, standards-based code.

Unfortunately browsers are not still fully standards compliant, but coding in this way is good practice and helps minimise errors amongst the latest generation of browsers which are now widely used.

You can check your coding at the W3 Validator. The more ambitious you get with your coding, the more potential discrepancies that may creep up amongst different browsers.

Test in a variety of browsers and resolutions

When you are coding your site, you should be constantly testing it to ensure it looks right. Don’t just rely on a single browser. I would recommending installing and testing your site in at least FireFox, Internet Explorer and Opera.

As well as testing in various browsers, try changing your screen resolution to see what effect this has on your site. I would recommend testing in at least the following three resolutions: 1280×1024, 1024×768 and 800×600.

Test your site using online services

There are a number of online services available that will view your site in a variety of browsers, operating systems and resolutions and take screenshots for you to view.

I will not recommend any premium service here as I refuse to recommend services that I have not tried myself. I will however recommend a free service that I have tried:

At, you simply submit your site and wait (I recommend choosing the maximum wait time of 4 hours to ensure the maximum number of screenshots).

Eventually you will start to see screenshots of your site based on the browsers and configurations you selected.

View your site in different browsers

View screenshots of your site using different system configurations

As the screenshots start to come in (it takes a while), you can then zoom right in on each shot to see your site just as that visitor would – very useful for identifying any cross-platform issues that you need to address.

System configurations are as individual as people

It is important to remember that just because you site looks fine to you, it does not necessarily look fine for everyone. Keep your code standards compliant, test on multiple browsers and make your site feedback friendly so your users can easily report any issues.

Do you know exactly what your site looks like on other computers? Have you had your site up thinking everything was fine, only to find a huge problem when the site was accessed from a different setup? Let me know your experiences and views by leaving a comment below.

Share this community building advice


Similar Posts

Previous post:

Next post:


Dave May 23, 2007 at 4:42 pm

Don’t forget to also check different versions of browsers. If you’re checking IE for example, make sure to check IE6 as well as IE7. I’ve seen some quirks between the two (a couple that I still need to fix on a couple of my sites!).

Martin Reed May 23, 2007 at 7:27 pm

Thanks for that Dave – I am kicking myself for not making that clear in my article! Checking your site on different browser versions is also extremely useful.

{ 1 trackback }