Saturday, December 11, 2010

What is HTML5

HTML was developed by the W3C until 2004, when members of the HTML working group grew disturbed with the direction the W3C was going with HTML. They felt that the W3C was not paying enough attention to the real-world development needs of the language and focusing too much on XML and XHTML. So they formed a new group called WHATWG (Web Hypertext Application Technology Working Group) devoted to evolving the Web. They started by working on a new specification of HTML – HTML 5.

HTML 5 is a new version of HTML 4.01 and XHTML 1.0 focusing on the needs of Web application developers as well as evolving HTML and addressing issues found in the current specifications.
We’re sure by now you’ve heard the term “HTML5″ thrown around by the likes of Apple and Google. This is the next evolution of HTML, or Hyper Text Markup Language, which forms the backbone of almost every site on the Internet. HTML4, the last major iteration of the language, debuted in 1997 and has been subsequently poked and prodded so that it can handle the demands of the modern Web.

What New Elements Are In HTML 5?

The main building block of any website is its markup language. The markup language is what structures the information on the page – indicating that one block of text is a heading and another block is a paragraph or a list. HTML 4 and xHTML are the most commonly-used markup languages today, and they share a common set of elements for marking your web-based documents. Using the elements correctly means that you’re applying concrete semantics to your documents, giving them the best chance of being understood by the widest variety of user agents.

Most of the new elements in HTML 5 are directly related to content structure and information types. The new content structure types include <section><article><aside><hgroup><nav>, and <figure>. New information type elements include <video><audio><meter><time>,<details>, and <summary>. There are many others, but these elements are particularly likely to be useful in ecommerce.

Most of the current discussion of these elements relates to their use in blog posts or articles. The examples provided tend to explain how a given element applies to your article titles and bylines, or including information in applications. In fact, the examples provided by the W3C for the <article>element specifically indicate a blog entry or newspaper article as the logical document content for that element. But that shouldn’t be interpreted to mean that they aren’t applicable to ecommerce!

Key New Features

One of the most key elements is article, which represents a single, independent piece of content on your site. In ecommerce, this is essentially your product. On a product page, it should enclose all the details about your product: pictures, description, details, purchase information. On a category page, it’s the container for each product shown. “Article” doesn’t just mean a written document; it’s also an article of clothing.

A major game-changer coming in HTML 5 is the <video> element. Particularly given the decision by Apple to not support Flash on the iPhone or the iPad, the use of a browser-driven video player has great potential for any website making significant use of video. Right now, support isn’t well enough developed to forego Flash video as well; but providing use of the video element to at least certain applications may already be necessary.

It should be readily apparent from the usage of the <article> element that one of the principles applied in development HTML 5 was that the name of an element should clearly indicate the usage of that element. This doesn’t mean that it’s necessarily obvious how to use them, however. Examples of usage can tend to bias expectations in one direction, as in the example above, where article appears to represent a written document.
Currently, most product pages are marked up using a variety of <div> elements. The lack of distinguishing structural elements in HTML means that on any given product page, all types of information are semantically equal. This can change in HTML 5. With the new elements available to structure your page, you can now clearly indicate what area of your page is the “meat” of the product page: the article section. Within that area, you can structurally separate any figures representing the product, details about the product, supplemental information that is only peripherally about the article, or the progress a visitor has made towards completing his or her order for complicated products.

These structures have great potential for future usability of a site, once they are fully supported by all major browsers.