Cross Browser Compatibility

There are many ways to view your website. If you are using a PC for example, you could be using one of the versions of Internet Explorer, Firefox or Google Chrome (these are the three most popular).

Users of an Apple Mac might be using Safari or Opera.

So, straight away we have five browsers to cater for.  In addition, there are many variations of screen resolution, mobile technology, screen readers, etc...

As you can see, creating a website has to cater for many browsers and screen resolutions.  Unfortunately, many designers tend to design for one browser (usually Internet Explorer) and one screen resolution (usually their own!)

Cross Browser Compatibility is the art of ensuring that your website displays in all of these browsers in a similar way. It's not easy though considering that IE6, IE7 & IE8 all display pages in very different ways!

So what is the main problem?

There are still many, many designers and agencies that insist on producing websites using 'table' layouts.  This is when a website is designed and laid out using a table.

So, for example, a typical website would look similar to the following:-

Header
Menu Item 1 Content Here
Menu Item 2
Menu Item 3
 
 

This is NOT the way to produce a website!  Sure, it's quick and easy to produce, but the implications will have a very large impact on the quality of your website.

What we should be doing is using style sheets instead.  Style sheets have many advantages.

Perhaps one of the biggest advantages to using style sheets from an accessibility point-of-view is the ability to serve different style sheets to different mediums and devices.

Because information on a screen reader or personal data assistant appears differently than on a computer’s web browser, it is important to include alternative style sheets that include basic formatting rules for a particular device. Not only will this expand the accessibility of your website to all sorts of web-enabled devices, but it is just good practice in general.

In addition, as new devices emerge, adding another style sheet doesn't mean re-designing your website.  It is just a matter of creating another text file.

Of course, if you wanted to change the look of your website, but keep the content you have, simply changing the style sheet will change the entire look of your site!

Browser Stats

Browser Statistics From April 2009

  1. IE7 - 23.2%
  2. IE6 - 15.4%
  3. IE8 - 3.5%
  4. Firefox - 47.1%
  5. Chrome - 4.9%
  6. Safari - 3.0%
  7. Opera - 2.2%