by Mike McKeown

Web designers have been hearing about HTML5 for a little while now. But what is different? Audio and video support, structural elements and dropped tags (to name a few) brings HTML into the 21st Century… finally.

Here are some (but not all) examples of what is new in HTML5:

  1. <audio> – For inserting audio on the web page. Has options such as autoplay and loop.
  2. <video> – For inserting videos on web pages. Has autoplay and loop, and an option to include some alt text, such as the video transcript for the visually impaired.  The <video> tag could be very useful for smart phones like the iPhone which don’t support flash.
  3. New structural elements – Should make structuring and organizing your design easier and more efficient. Examples include:
    • <header> – For you page header (not to be confused with the <head> tag).
    • <footer> -  For the footer, such as copyright text.
    • <article> -  A blog post would be a great example on how this tag is used.
    • <navigation> – For your navigation links.
  4. New inline elements – Used to indicate times or numbers
  5. New input form types – Examples include:
    • datetime
    • date
    • month
    • range
    • url
  6. Depreciated Tags dropped - Tags which were depriciated in HTML 4.01 have been dropped from HTML5. Examples include:
    • applet
    • big
    • center
    • font
    • frame and frameset (thankfully)
    • strike
    • u
  7. Simpler doctype which is now: <!doctype html>

This article is just a starting point of the new features you will see in HTML5. the changes will be better for both web sites and applications, and in my opinion is much more intuitive and webmaster friendly. Many browsers such as Firefox, Chrome and others support some aspects of HTML5 already, and surprisingly IE9 will be HTML5 compatible, which is amazing considering the fact that IE has a long held reputation of being the enemy of modern web design.

Related Posts:

  1. Top 5 Intro to HTML5 Videos