The Best New Features of HTML5
Nov. 3, 2011
Ashleigh Karasawa
You may have already heard of HTML5, but do you know what it has to offer you? Sure, it’s still a work in progress, but many browsers already support some of its most useful features. Right now, HTML5 is the hottest trend in web development.
One of the biggest benefits of using HTML5 is the flexibility that it has for developing interactive websites without having to use Adobe Flash or other plug-ins. Don’t get me wrong. I love Flash. But I find it rather annoying that Flash-based websites will not work on my iPod Touch and many other handheld devices. This is where HTML5 comes in. It standardizes many features that currently rely on third-party plugins, thus making it easier to create and use dynamic websites on smartphones and PCs alike.
Here’s a quick list of some of the amazing advantages of HTML5:
- Video and Audio. Eventually, adding video and audio to a webpage will be as easy as adding an image. We used HTML5 video for our recent site for South Bend Medical Foundation’s 100th Anniversary.
- Geo-location. This allows location-based services and websites to know where you are and customize your experience. We used this on our recent site for South Bend Parks and Recreation. You can see it on their map page and as a way to sort their full park list.
- Drag-and-drop. We’re all accustomed to drag-and-drop when using desktop applications. Now, that same functionality will be more consistent and easier to implement online. Gmail already uses this for attachments, but you can also view a demo here.
- Canvas 2D Drawing. The new canvas element provides a consistent, standardized 2D “artboard” that can be dynamically modified in real-time…again, without any extra plugins. This opens up amazing possibilities, such as this drawing program built using HTML5 canvas.
- Editable Content. The ability to easily edit online content without the use of complex JavaScript or Flash editors. Here’s a simple demo.
- Offline Content. Going to be offline for awhile? HTML5 lets you use properly configured sites and apps offline. For example, Google offers a full-featured version of Angry Birds that is playable offline (at least if you’re using their Chrome browser).
- Better Forms. An easier way to build forms that have built-in controls such as validating submissions and choosing dates using a calendar. This feature isn’t well supported by most browsers, but you can view a very bare-bones demo here.
With all the advantages of HTML5, what’s the downside?
The biggest limitation is this: older browsers don’t support the new features of HTML5. In fact, to view many of the examples above you will need to update your browser to the most current version. Go to HTML5test.com to see what HTML5 features your current browser supports and WhatBrowser.org to learn more about upgrading your current browser.
Did I mention that HTML5 was a work in progress? Even though most of HTML5 standard is considered stable, things can still change at any time. However many of the features I mentioned above are ready to use today. In fact, Villing & Company has used HTML5 for every site we’ve built since I started my internship. As long as you recognize that the best new features require a newer browser, there’s no reason not to start using HTML5 on your site today.
Ashleigh Karasawa is a student at Ivy Tech State College majoring in web design and development. She began a six-month internship in the web department at Villing & Company in August.
To get our latest articles when they are posted, please subscribe by e-mail or RSS. Or, if you prefer updates through Facebook, please "Like Villing" using the link in the bottom red area of our sidebar navigation.