Checking your website across multiple browsers and operating systems can be time consuming, but it happens to be one of the most important website compatibility testing you will need to do. This guide will cover the basics on how to get testing done easily and provide you with some resources to get started. This is the second post in my website compatibility testing series, be sure to check out improving your screen resolution compatibility.
Find out what browser and operating system your visitors use
Check your web statistics to discover which browser your visitors are using the most. This is very important because each website will have different types of visitors and you will need to discover what browser they are using the most. Mostly webmasters and bloggers prefer FireFox and this is the most common browser type for BlueJar.com which can be seen in our stats:
Now that you know what browser type they use, you need to find out what operating system they are using. For BlueJar.com the most popular operating system is Windows, I thought for sure Linux would be my second, but I was quite surprised when Macintosh users were my second.:
In Google Analytics, go to Visitors > Browser Capabilities > Browsers or Operating Systems. There is also the option Browsers and OS, which can be a quick overview for both browsers and operating system types.
Why to check on different operating systems
What you see on your browser with your operating system may not be the same for your visitor who are using the same browser but a different operating system. My biggest feedback on design layout issues have been from Macintosh and Linux users. This is probably because I don’t use these operating systems and can’t test them locally.
Checking on different browsers and operating systems
I recommend installing the most popular browsers (no more than 3) your visitors are using to to test locally for the beginning stages of building your website. The general rule is that if it is working on a few web standard compliant browsers than it will probably be working in the rest of them with very little problems. This statement completely excludes IE6 as it does not comply with very many standards.
As you reach the end of your development, test your website on different operating systems and other browsers you don’t have installed. The following services will allow you to take screenshots of your website to show you what your website will look like on those different OS’s and browsers:
-
BrowserShots is a free service that offers testing across 3 different operating systems and 8 browsers. Over the last year they have really improved on their website and brought in a lot of new features. Highly recommended and its free!
-
Browsercam which offers a service that will take screenshots on over 7 operating systems and multiple versions of each browser type. They have also recently just released a service to check out smaller devices such as the Blackberry. It is a very comprehensive service, however it is a bit costly. At the end of the series I will let you know how to get Browsercam access for less than $50 a year!
Maximize Your Websites Browser Compatibility Series
- Improve Your Websites Screen Resolution Compatibility
- How to Check Your Website on Multiple Browsers and Operating Systems
- 13 Forgotten Browser Compatibility Issues
- Super Cheap BrowserCam.com Access: Only $40/year
If you liked this post, subscribe to my full RSS feed. Learn more about rss feeds with my quick guide. You can subscribe through e-mail too.
Nice post , i use Browsershots frquently to check whether my site looks good in all browsers . But it can be very frustating when you see your sidebar etc getting misplaced in diffrent browsers
It is very frustrating. I have found keeping things simple works best for me. Less messing around. :c)
wow, thanks for this. I had never heard of BrowserShots but I’ll probably use it a lot now. It’s always tough to try and find various computers with different browsers/versions on them to test my sites.
Thanks for the info.
On my own sites IE is still #1 by far, with Firefox in 2nd an the rest barely exist.
The other thing I find interesting is looking at browser resolutions. One guy has come on my site with a 3200 x 1024 screen!
And I shouldn’t be surprised at the mac stats, looking at your MBL widget I know at least a couple of Mac users
I had no idea about browsershots. Thanks for the info!
89% fire fox?!?! holy lol mine was probably 60% firefox and 40% IE last time I checked. Good post
Glad BrowserShots.org can help you guys out. It is free too, so it is great.
@Rhys: I do have a post about screen resolution testing earlier this week. There is a cool plugin for firefox that is very helpful if you don’t want to take SS for testing it.
@shaun: You know what I never did realize that is an insane landslide of FireFox users! Guess I can keep posting about firefox plugins with little complaints. :c)
I used browsershots to test my new theme in different browsers before I started using it. It’s a very helpful free utility.
While different users prefer different browsers, so hard to accomodate!
I’ve used BrowserShots for this. But the thing that I don’t like about it is that they have a long queue there waiting for screenshots. Rest, the service is a very useful one.
True Shankar, the queue thing can be hard sometimes and sometimes I get a little sidetracked about the whole thing. I’ve been using Browercam.com and its completed usually within 10 min or less.
It’s funny because my blog always displayed badly on internet explorer before. The rightmost sidebar would be below the middle sidebar. Then when I did my redesign, I accidentally fixed it. Now it displays properly in ie too haha.
I know what thats like BrownBaron. Sometimes it is just a hassle to deal with the whole thing. Glad it is working for you now! New design looks great.
i was reading this article and thought to let you know about a tool
http://www.essentiabct.com (completely automated browser compatibility testing tool) check it!
I am sure many of the bloggers are using analytics to keep up the records of visitors/stats. It is helpful for us to tackle the issues such as browser compatibility, screen resolutions, color depth. I was shocked to see some of the visitors are still on 800*600 resolution. And I thought I must take the full advantage of CSS and provide them some freedom to continue using it.
Thanks for sharing, Sarah!
Thanks for the information
browsershots is VERY slow…
Thanks for the tip about browsershots. I find that the ratio of people using FF or IE depends on what kind of market your blog is serving, what people are visiting it. And as far as screen resolution, remember that many people in various countries are still using older computers or might be at an internet cafe. You are right that keeping it simple is a good idea.