Browser Compatibility

When designing a great website one major thing that someone has to take into consideration is that not everyone uses the same web browser.  There are 2 major browsers, Internet Explorer and Firefox and 3 other widely used ones as well (Chrome, Safari and Opera), and many others beyond those. They are required to meet a basic set of standards, to a degree, but beyond that is where the unpredictability starts!  When a designer makes a website cross-browser testing throughout the creation process is a MUST.  If you are not creating your website yourself make sure that your designer is checking this.

Let’s give an example of how drastically different a website can look just in two different browsers; I will use Internet Explorer and Firefox for my example.  The website I will be using is: www.websitetips.com.  The part that makes me laugh about this is the first time I found the website is when I was doing homework for a web design class I took at BCIT and was researching different positioning techniques with CSS (Cascading Style Sheets) – the main way designers currently layout website content right now.  Here are two screen shots for you:

Internet Explorer:

Internet Explorer Screen Shot 

Firefox:

Firefox Screen Shot 

This website was obviously designed for Firefox (generally a designer’s choice browser) and not tested in Internet Explorer.  Let me point out the main things that I notice: 

  • In Internet Explorer in the heading area of the website the background image does not continue across the screen
  • There are 3 columns of content in Firefox, but only 2 in Internet Explorer – the 3rd column of content is added to the first (left) column in Internet Explorer
  • In Firefox there’s a small section of links on the top right section of the site that does not even exist in Internet Explorer
  • You do not see it in my screen shots, but on the very bottom of the page in the footer section of the site the content overlaps the background image badly in Internet Explorer

 This is just one example of MANY that exist on the internet.  Another aspect of this that I did not touch on above is also taking into consideration that people do not always upgrade their browsers – some people could easily be 3, 4 or even more versions back.  This may be them not wanting to change but it also may be for a company that cannot upgrade due to needing support for special software, for example.  So not only do you need to test cross-browser but in previous browsers too.  A great tool I have found for this is Adobe’s Browser Lab.  You can test multiple browsers and multiple versions. 

Browser Compatibility is one of many testing tasks that a good designer should do for you – and one thing that we at ARK Squared Productions always do for our clients!

Tags: , , , , , , , , ,

This entry was posted by Anna Kouwenberg on Monday, April 11th, 2011 at 7:00 am and is filed under Marketing, Web Design. You can follow any responses to this entry through the RSS 2.0 feed. Both comments and pings are currently closed.