<< Latest Post

Thursday, March 08, 2012

HTML, CSS & DOCTYPE

Sometimes while building an application, your code will look perfectly fine & correct, yet the application will not run as you expect. This is especially true, when you use style sheet for your web page. Your style sheet will look perfect with all the right styles for different browsers & elements, yet your web page will not look the way you wanted it. For e.g.: to center the body of your web page you might be setting your margins & text-align styles in your style sheet, yet the page would not be centered in your browser. We might spend hours modifying our style sheet to fix the problem, Guess what! It might not be the issue with your style sheet code! It could be your DOCTYPE

When a browser renders your web page, it looks for the DOCTYPE at the beginning of your HTML code, if it is missing, it will assume that you are using OLD HTML tags in your code and will start rendering the page using the old HTML Standards. So, including the right DOCTYPES in your web page will make the browser to use the right HTML standard to parse your web page.

Which DOCTYPE?

Lists of DOCTYPE’s are listed in the W3C site - http://www.w3.org/QA/2002/04/Web-Quality (Middle of the Page).

HTML 2.0 & 3.2 are pretty much old, so use it if you want your web page to work in older versions of IE like version 3, 4 etc. Otherwise, start at HTML 4.01. There are 3 variants of the DTD available -
  • Strict - Will not accept any old deprecated tags or framesets
  • Transitional - Will accept deprecated tags but no framesets
  • Frameset - Will accept everything including framesets.
If you are an old VB developer, this is like turning your Option Strict & Option Explicit on or off.

There is also XHTML standard, which I believe is similar to HTML standard but adds more XML rules to HTML standards like tags have to be closed, case sensitive etc.

0 Comments:

Post a Comment

Subscribe to Post Comments [Atom]