Do Websites need to look the same in every browser?

There has been a lot of talk recently about whether websites should look the same in every browser. We’re going to discuss a few of the differences you might see between browsers in this post and the pro’s and con’s of graded browser support. We’ll also cover why implementing graded browser support will help save money during development time.

All about browsers

To start with, so we’re all on a level playing field I thought we ought to describe what a browser is, so for those that don’t know:

A web browser is a software application for retrieving, presenting, and traversing information resources on the World Wide Web.

http://en.wikipedia.org/wiki/Web_browser

So what exactly is graded browser support?

By their very nature different browsers will render pages and sites differently. This is be because the specifications have been interpretted differently and because of visual aspects such as form fields that have different border colours or shapes. Graded browser support is the process of providing a level of support for browsers in relation to the features they can can or cannot display. This in no way should affect the ability for a user to access the content though, it is primarily for visual appearance.

At KMP we’ve begun implementing graded browser support on almost all of our recent projects. The reasons for this are wide and varied but include: helping our clients save money by cutting down on our development time and allowing us to learn and use up and coming technologies such as HTML 5 and CSS3. Companies like Yahoo have been doing this for a while and have implemented graded browser support tables.

Let’s look at an example

If you are viewing this site in a browser like Firefox or Safari you will see the main content areas have rounded corners and have some transparency, however if you’re viewing the site in Internet Explorer the content areas have square corners and a solid fill colour, this is what we mean by graded browser support. It has also been called Progressive Enhancement or Graceful Degredation.

Why should websites look different in different browsers?

A primary reason for websites looking different between browsers is that by doing so we can cut down development time, which helps both us and our customers save money. For example, if I needed to create the exact same layout of this site for Internet Explorer 6 I would have to either use Javascript or write a lot more HTML. Jeremy Keith wrote a good article about this last year on 24ways.

Another reason for browsers not having to look the same is that our users are primarily interested in the content of our sites not how it looks. This is especially true with the content distribution taking place with RSS feed, meaning that a user may not even visit your site to read your content, it could be viewed in Google Reader, Bloglines or any other RSS aggregator.

Conclusion

To wrap up, it’s our belief at KMP that sites should be usable and acccessibile across all browsers and devices but they don’t have to look identical. You don’t have to just take our word for it though, even the government’s own guidelines say the same thing.

You should check that the content, functionality and display all work as intended. However, there may be minor differences in the way that the website is displayed. The intent is not that it should be pixel perfect across browsers, but that a user of a particular browser does not notice anything appears wrong.

http://www.coi.gov.uk/guidance.php?page=212

We’d love to know your thoughts on whether browsers should look the same in every browser, so why not get the discussion going by leaving a comment below.