HTML5 Doctype Example

HTML5 Doctype Example

Photo Rick Hurst
HTML5 Expert
Kindingo Inc.
Member since Apr 16, 2012
Stream Posts: 4
Posted on Jul 25, 2012 (3 years ago)
Seen 1496 times.
Tagged As:

HTML5 doctype is as follows:

<!DOCTYPE html>

not

<!DOCTYPE html5>

If you get this wrong, can you guess what happens?

It defaults to the dreaded quirks mode.

If a browser doesn’t recognize the document’s doctype it decides to use the lowest common denominator for rendering instead and your beautiful website will probably not work as intended.

You can have all your markup pristine, however if your doctype is wrong it is all for nought.

One sure-fire way to avoid the doctype ‘typo’ issue is to run your code through the w3c validator at http://validator.w3.org/.

Don’t forget to use the <html> tag before your start with all that <head></head> and <body></body> stuff.

Closing the </html> tag at the end also goes without saying.

I also advise developers to set the charset via a meta tag too, just incase the server people don’t do their job correctly. This would overwrite any mistake they make in sending the encoding type.

It doesn’t hurt to add the charset as a rule of thumb.

<meta charset="UTF-8" />

So in summary I always start with this and then fill in the blanks from there.

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
  </head>
  <body></body>
</html>

Comments

You have to login to post a comment.
Posted on Aug 17, 2012 (3 years ago)
Photo Vishnu Vg
Software Engineer,
Experion Technologies
Member since Aug 16, 2012
excellent one
Posted on Jul 26, 2012 (3 years ago)
Photo Mfawa Alfred Onen
System Administrator
Bingham University
Member since Jul 24, 2012
Nice tips, Thanks!