5 New Features in HTML5
Matcha Design - Tuesday, November 23, 2010
HTML5 is still a
work in progress, and some parts are still being refined or are subject to change, but partial experimental support is already existent in most major browsers. At this point I wouldn't recommend building a whole website in HTML5 without any kind of contingency for those whose browsers don't support it or behave differently than some others, but it pays to get prepared early on.
To that end, I've compiled a short list of some of the cool new things HTML5 can do.
I could write an entire article on why better semantics are good for the developer, the designer, and search engines (and I plan to.) The short version is these elements provide for overall improved structure of HTML documents, including fewer structural errors.
New form controls
New Media Tags
One of the objectives in HTML5 was to reduce how often plugins needed to be used. Embedding audio and video clips with native tags means fewer instances of the Flash, Windows Media Player, and Quicktime plugins, for example. The embed element, which was not part of the HTML4 specification, but returned to HTML5 in a more simple form, supporting only the width, height, src, and type attributes, along with the standard HTML5 attributes and event attributes.
The canvas Element
WebSockets and Server-Sent Events
Traditionally, HTML is stateless. Basically that means that the browser requests a file from the server and the server returns some data. For each file a new request is made. Persistent logins and other apparent states are achieved with cookies, server-side data, forms, etc. Furthermore, there's no way for the server to tell the client something unless it specifically asks.
Both of these new-to-html technologies provide a means for the server and client to interact more flexibly. Server-Sent Events basically listen for some data to be sent from the server, and the server can send that data whenever it needs to. Great for chat applications for example. The benefit here is that requests aren't being sent back and forth, and in fact nothing is being sent unless there's relevant data. WebSockets are a more robust mechanism that also allow the browser to send data to the server. This is how most network/internet-enabled stand-alone applications (such as multiplayer games) communicate. Typical web servers aren't capable of handling this communication yet, but some are, and we'll likely see more of them implement it soon.
I hope you enjoyed this brief look at a few of the things HTML5 is improving. Be sure to check the official spec working draft and the related W3Schools tutorial for more details and ongoing status. And don't forget to check out our Web Design and Development page.
About Matcha Design
Matcha Design is a full-service creative agency specializing in web design, print, identity, branding, interface design, video production, still photography and motion design. Using our passion for excellence, multi-cultural background, and award winning practices, we consistently provide high-quality, custom, innovative solutions to meet the diverse marketing needs of our clients. For more information, visit www.MatchaDesign.com.