tags:

views:

722

answers:

5

Being fairly inexperienced with certain aspects of web development (I've always concentrated more on the back-end than the front), can anyone give me their thoughts on whether I should worry about the DOCTYPE declaration made at the beginning of web pages?

Is the most common HTML 4.01 and should I build my web apps to conform to this standard?

EDIT: As per answer below, have kept question as it also contains useful answers.

+3  A: 

John Resig (jQuery) has a say in that matter. Additionally, a DocType helps make MSIE6 use the right box model, and it also eases the pain of validating your site (this is a good thing for development; think of it as debugging).

Konrad Rudolph
+5  A: 

Please see the following SO Post: What Are the Different DocTypes in HTML and What Do They Mean?.

Noah Goodrich
Thanks for the re-direct. My initial search didn't come up with anything. That's what's good and bad about SO - get answers so quickly you tend not to spend too long searching for existing ones! Have amended original post.
Duncan
+2  A: 

You should definitely include a DOCTYPE as the first statement within your pages because it will switch Web browsers into standards mode. This means that they will at least attempt to render your page using W3C and IETF standards rather than by following the backwards-compatible model known as quirks mode.

Based on my own observations, there's more use of XHTML 1.0 Transitional now rather than HTML 4.01. XHTML 1.0 Transitional is a sort of halfway-house that gives you some of the benefits of XHTML without being too onerous.

John Topley
A: 

Disregarding all good practices, the biggest reason people use a DOCTYPE such as XHTML 1.0 Transitional is to switch the CSS box model in IE to be the same as the rest of the browsers. This circumvents much frustration with CSS layout. It is explained here in more detail: http://css.maxdesign.com.au/listamatic/about-boxmodel.htm

Seamus
+1  A: 

DTDs are used for validation and entity definition. They roughly specify the syntax requirements for a certain markup language and version.

Validation might be done against a DTD by using a validator. Or, it might be done by the user agent during parsing (as is the case for some validating HTML/XML parsers). Entities defined in the DTD might be made available if the user agent supports that.

A DOCTYPE declaration is the markup language's way (in HTML and XML at least) to reference an inline/external DTD in the document.

Now, as far as browsers' HTML(text/html) parsers are concerned, the DOCTYPE declaration just controls the rendering mode (DOCTYPE switching). The mode will be Standards, Almost Standards or Quirks depending on the version of HTML referenced and whether or not a DTD URI is specified. The actual dtd is not used.

For example, an XHTML 1.0 Transitional doctype with a DTD URI might only put the browser in Almost Standards mode, where an XHTML 1.0 Strict doctype with the DTD URI should put the browser in Standards mode. Further, HTML5's doctype <!DOCTYPE html> will put all browsers in Standards mode and put IE8+ in Super Standards mode (so it behaves a little more like modern browsers when rendering). Generally though, the doctype has little effect on Javascript and DOM support (there are exceptions though, especially with IE8).

For browsers, since you almost always want full standards mode, all you really need is <!DOCTYPE html>. Anything more isn't going to help the browser. However, that doctype is for HTML5. If you want to conform to an HTML 4.01 DTD or an XHTML 1.0 DTD, you must use HTML 4.01 strict or XHTML 1.0 strict with the proper DTD URIs to get full standards mode.

If you want to conform to HTML5, you can test your syntax at http://validator.nu/. It doesn't validate against a DTD and is more advanced than DTD validation. It also reflects HTML 5 better than a DTD could and since HTML5 better reflects what browsers really support, it's syntax checking is more browser-world compatible.

If you want to conform to the HTML 4.01 or XHTML 1.0 DTDs, use the W3C validator. Just note that those DTDs don't reflect what browsers support and only roughly reflect the specs they're for. These DTDs are just more for catching rough syntax errors and for non-browser user agents that make full use of them. They also don't know anything about how browsers behave differently between text/html and application/xhtml+xml.

To read about browser Doctype Switching:

http://www.mozilla.org/docs/web-developer/quirks/doctypes.html

http://www.opera.com/docs/specs/doctype/

http://hsivonen.iki.fi/doctype/

Shadow2531