Part Two: The Newest Family Members
In my last entry, I wrote about the HTML 5 family and its history. This entry will be about the latest incarnation of the standards, some of the new features, and why they're important.
Separation of Standards
Evolution of Standards
Enter HTML 5. It was designed both to address known shortcomings in the previous standards, and to achieve specific goals.
Backwards compatibility: one of the most important goals of HTML 5 was to not "break the web." The new standard had to be backwards compatible with previous standards, and needed to work with older browsers.
Ease of development: HTML 5 needed to be easier to use. We wanted to leave behind the restrictions of SGML and XML based documents
Future needs: HTML 5 needed to be forward-looking. It needed to cover more than just the structure of the markup and include broader support for applications and rich interactions.
Addressing these goals made HTML 5 depart from previous versions of the HTML standard. First and foremost, HTML 5 is not an application of XML or SGML. The HTML 5 standard is instead a collection of documents that define the markup tags as well as functionality and workflows. This leaves behind the strictures of SGML and XML, enabling ease of use and broadening the scope of the standard to include more advanced functionality.
New Family Features
The HTML 5 family has many new features. There are new HTML tags, new data features, new layout features, and new interactions.
New Structural Tags
What are they? New tags that allow us to be more specific with content structure, such as header, footer, menu, sidebar, and so forth.
What's the benefit? Obviously we've been creating headers and footers using older versions of HTML, so what's so special about these new tags? Before HTML 5, when we created headers (and footers, and so forth) there was no way to specify with markup that these elements were somehow structurally different than regular content. These new tags give is a way to say to the audience, "this part of the content is the document header" and "this part of the content is the document footer." This is a significant improvement in accessibility, as well as allowing automated user agents like search engine crawlers to better understand our documents.
New Semantic Tags
What are they? New tags that allow us to be more specific in defining what some types of content actually are: navigation, output, figures and captions, etc.
Audio and Video Tags
What are they? Tags that enable browsers to display audio and video content without using a third-party plugin like Flash or Quicktime.
What's the benefit? Similar to the new structural tags, the new audio and video tags give us the ability to specify in our documents the presence of content that previously we weren't able to specify with semantic markup. These new tags give us the ability to say "this is audio content" or "this is video content" and improve accessibility and search engine friendliness. Native audio and video support also has the potential to be more efficient and less resource-intensive than using a plugin.
The Canvas Tag
What is it? Put simply, the canvas tag provides a way to draw in the browser. These can be simple line drawings or they can be as complex as copying entire images or even frames of video. These drawings can be animated as well.
What's the benefit? The HTML 5 canvas gives a standard way of handling drawing and animation in the web browser without resorting to a third-party plugin. Plus, the canvas tag is a part of the document, so the browser can intelligently integrate it into the content both in terms of visual effects and user interactions.
What is it? The HTML 5 standard specifies new ways for browsers to store data locally. The data can be stored either simple key-value pairs or a SQL database, and can persist even when the browser is offline, or the session has ended, or even if the browser has been shut down and restarted.
What's the benefit? Where the canvas tag provides the possibility of vastly improving the visual aspects of HTML 5 applications, the data storage features of HTML 5 provide similar promises for handling the data that will drive those applications. The ability to be able to store data locally in easy-to-access ways makes it possible to create much more complex browser-based data handling, improving application efficiency, and reducing network load.
What is it? The offline applications specification gives us direct control over how the browser will handle a web-based application when it cannot access the internet. We will be able to specify local caching rules, rules for updating that cache, and how the cache should behave when the browser is online and offline.
What's the benefit? The offline applications specification will help us create web applications that react intelligently and predictably to offline situations, giving much better user interaction.
What are they? The new CSS 3 standard specifies many new but long-awaited visual styles such as rounded corners and gradient backgrounds. It also specifies visual transforms of document elements, like rotation and skewing.
That covers the newest family members, some of the new things they can do, and why they're cool. In my next post I'll talk more about how these evolving technologies will affect projects and businesses.