Home page
Music, Melodeons, web design, computers and other stuff
Why do websites look different in different browsers?
A simple answer? Hubris, folly, human frailty, mistakes, greed and then sometimes because they're supposed to.
For a more comprehensive answer we need to get back to the start of the World Wide Web in 1990 at CERN, with it's inventor Tim Berners-Lee.
One of the fundamental breakthroughs that Berners-Lee made when designing the original World Wide Web was the marrying together of the Internet with hypertext. What is hypertext? It's the thing you see every time you look at a web page with text and links.
Hypertext did away with the hierarchical nature of the pre-existing Internet when used with another of Berners-Lee's ideas, the Uniform Resource Locator (URL). With URL's everything on the Web has it's own address and can be linked directly. On the World Wide Web, everything could link to to everything.
The hypertext language devised was called HTML. It was simple, clean and rendered text only. To this day, the Web still is essentially a text medium. This was fine whilst the Web was being used by a small essentially academic community. Things changed when in 1993 CERN allowed the Web to go public for free.
The Web grew exponentially, designers and software companies appeared, and everything started to get very, very complicated.
Designers wanted multiple fonts, pictures, colours and complex designs where they could position things perfectly. They started to use markup tags in ways that they were never intended and used "clever" tricks to position elements on the screen, often trying to emulate the design certainties that they had in the print world.
Software companies wanted people to use their software. One of the classic ways to capture market share used by proprietary software companies is what is called lock-in. Give the customer something but implement it in a way that is incompatible with other companies programmes. This is the reason for such things as multiple word processor formats.
We sometimes think of Netscape (stemming from the Mosaic browser) as being at the very start of the Web, but in many ways they were late-comers. The fundamental basis of the Web had already been laid down by Berners-Lee and the World Wide Web Consortium that he founded in 1994. Netscape had to go along with this to a great extent, however, their instincts told them to try to subvert the conventions, try to steal a march on their competitors and grab all-important market share.
Microsoft eventually woke up to the web and wanted the browser market for themselves. Netscape responded and tried to defend their dominant position. One of the casualties of this "browser war" was HTML and cross-browser compatibility. Both sides played fast and loose with the markup, inventing their own tags and rendering pages in the way that suited themselves rather than respecting the previous universality of the Web.
Things eventually got so bad that some people and organisations started to put "best viewed with Netscape" or "best viewed with Internet Explorer" notices on their websites. When Internet Explorer eventually won that first round of the "browser wars" many people simply coded their pages to look good in Internet Explorer.
This was the state of the Web certainly by 2001 when Internet Explorer 6 appeared.
Surely that was a good thing though? Surely we got back to the universality of the Web through the effective monopoly of Internet Explorer?
Well, no. Nothing stays constant and on the Web things can move pretty fast when they get going. The code behind the the websites that were rendering OK in Internet Explorer eventually came to be recognised by more and more people as a disaster. HTML had started out as a clean and simple markup, yet it had been turned by web designers and software companies into an unholy mess.
Things started to change. Netscape, like an zombie that Microsoft thought it had killed, came back from the dead in the form of Mozilla; which was rewritten and eventually became Firefox. Firefox was being developed by people from the Free Software world where standards and interoperability rules. Microsoft after it's victory over Netscape had sat on Internet Explorer and not updated it for years. Firefox was new, modern and gunning for Internet Explorer.
At the same time there was a growing movement of people who were concerned about keeping the Web open and accessible. They had always been there, but now were getting more of a voice with their concerns over issues like cross browser compatibility and access for the blind and partially sighted. This turned into a growing number of web designers who were consciously designing for accessability by using Cascading Style Sheets (CSS), clear document structures and semantic markup. These accessible websites were also perfect for the growing number of devices like mobile phones and PDAs.
It became clear that unless Microsoft moved then Internet Explorer would simply become superceded. When they started to redevelop Internet Explorer they had two problems. One was the software itself (they had disbanded their Internet Explorer development team years before) and the other was all those websites that would only work in Internet Explorer. Microsoft to it's credit has moved decisively towards the accessible web and cross-browser compatibility in Internet Explorer 7 and the upcoming Internet Explorer 8. The background to that move, though, has been huge pressure from developers and users and the fact that they were now playing catch-up with Firefox and a Web that was moving towards accessability.
However, we still live with the legacy of all this history. Things are getting better with more sites using accessible design techniques, but each of the major browsers still has what is called "quirks mode" to try to cope with all those designers and websites that still use outdated markup and design techniques, or to guess how to render pages that have simply been badly coded.
So, what's the answer to the question "Why do websites look different in different browsers?". Surprisingly, in the end, it's actually an answer alluded to right at the top of this article, "because they're supposed to".
HTML was never meant to be a pixel perfect way of rendering a document and this was the fundamental mistake make by designers and browser makers in the 1990's and early 2000's. Different computers, programmes (including screen readers which use speech to render a webpage), screen sizes and devices should and will display a web page differently according to their setup and users intentions.
Of course there is still the broad commonality of the major web browsers and average computer set-ups with which people commonly browse the web. With modern markup techniques designers can get fairly similar results in the latest versions of graphical browsing software such as Internet Explorer, Firefox, Opera, Safari, Konqueror, or other browsers that use the Webkit, Internet Explorer or Gecko rendering engines.
With modern accessible design, users can now change the colours, layout and fonts of a page completely for their own purposes. For some it seems to be a revolutionary development, but actually it's getting back to the roots of the web, this is the way it was always meant to be.
Andrew Wigglesworth
Coventry
England
11th November 2008
