HTML & Browser Compatibility

Posted By   Nathan Russell   on   November-18-2008 09:38:10                                                                Article 5

Browser Compatibility has been plaguing web programmers for decades. I personally can't tell you how many times I've come across a browser rendering HTML different than expected. But is the browser to blame? This article should help debunk the misconceptions regarding HTML and Browser Compatibility and give you a clear understanding on how to overcome these pitfalls.

First let's identify the major browsers:

Firefox	Google Chrome	Internet Explorer	Opera	Safari

Most of you have at least heard of 1 or 2 of these browsers, since the most commonly used are Firefox and Internet Explorer. However, each of these browsers may render your HTML different then the next.

Why you ask?

Well that's because each interprets the HTML code a little different. The W3C (World Wide Web Consortium) develops the specs that govern how each and its attributes work. The problem therein lies room for interpretation.

For Example:
The <q> tag is supposed to be used for an inline block of text that represents quotes. Prior to Internet Explorer (IE) 8, this tag was never implemented. While other browsers implemented this tag, prior to IE 8 you would have to detect the browser and write code around this so that in IE your quotes used the <blockquote> tag.

Other issues are prevalent when you use certain attributes. For instance, the inline style attrib. can display different results for pixel positions and even your text formatting.

For Example:
This code <div style"text-align: center;">; works great in Firefox, Opera, Safari, and the like, but IE may not center your text how you expect. To get around this you'll need to add redundant code in a CSS file.

Now the above example is more of a stylesheet example, but this is a good example nonetheless.

Why Is There A Large Interpretation Of The HTML Specs?

Well that's because the W3C wrote the HTML 4 specs using language that allowed for interpretation, such as the words "Should" and "Should not" instead of "Must" and "Must Not". To correct this problem, they are in the process of developing the new specs for HTML 5.

So Should I Use The HTML 5 Standards?

While HTML 5 is more strict and correct in how the browser "Must" interpret the HTML schema, not all browsers to date are compliant with this standard. So make sure that if you choose to use HTML 5 that your browser does support it. Also, you may want to do a check on the browser and display an alternate HTML 4 page just in case.

With that said, if you run into an issue where your HTML code doesn't display properly, then you can safely blame the HTML 4 spec rather than the browser.

But How Do I Overcome These Pitfalls?

To overcome these shortcomings and or pitfalls, you should always test your code in multiple browsers. Even if you don't like to use the other browser, your visitors might. Also, you should have a good understanding as to just what the HTML 4 specs really say. If you do run into a problem, reference the spec and see what it says regarding that particular <tag>, here's the link to the HTML 4.01 spec http://www.w3.org/TR/REC-html40/.

Above all, don't give up. You can always find the answer to your problems either in a book or surely someone has written a tutorial or discussion thread on it on the web.