The New More Flexible Approach of HTML5 - Paving the Cowpaths

Contact Us or call 1-877-932-8228
The New More Flexible Approach of HTML5 - Paving the Cowpaths

The New More Flexible Approach of HTML5 - Paving the Cowpaths

HTML5 takes a much more flexible approach than XHTML did. HTML5 is designed with the idea that authors have been writing HTML in many different ways over the years and there are zillions of web pages out there that don't adhere to the strict XHTML standards. Rather than render those page useless, let's just relax the standard a bit (well, a whole lot). They call this "paving the cowpaths."

As an example of this flexibility, all of the following are permitted in HTML5:

  1. <link type="text/css" href="style.css"/>
  2. <LINK TYPE="text/css" HREF="style.css"/>
  3. <link type=text/css href=style.css>
  4. <LINK TYPE=text/css HREF=style.css>
  5. <LiNk TyPe=text/css hReF="style.css">

As the above shows:

  1. HTML5 is case-insensitive.
  2. HTML5 allows for unclosed tags, but you can use the XML-style shortcut close tag if you want.
  3. HTML5 does not require quotes around attribute values (unless the values have spaces in them).

This new flexibility could lead to a bit of chaos on your development team. Different HTML authors will take different approaches. Our recommendation is that you choose one approach and stick to it. In this course, for example, we use the following guidelines:

  1. Write tags and attributes in all lowercase letters (even event handlers like onclick).
  2. Do not use shortcut close tags for void/empty elements.
  3. Put all attribute values in quotes. (Why? Because attribute values that have spaces in them have to be in quotes. And I do not like the idea of having some attributes in quotes and some not.)
  4. Minimize attributes when you can.

Again, it doesn't matter so much which guidelines you choose, but it'll make your life easier if you specify some. If you're a big XML fan, you're more than welcome to stick with XML syntax described above and create XHTML5 pages.

Next