May 13th, 2011
HTML5 is the revised standard for HTML, XHTML and the HTML DOM. Although it is new, most modern browsers support HTML5. It is an upgrade to HTML4 which includes the following features:
- New content specific elements: footer, header, navigation, article, section, aside, figure.
- New form controls: time, date, calendar, url, search, email.
- The video and audio elements for media playback.
- Better support for local offline storage.
- The canvas element for drawing.
- Context menus.
- Inline elements: mark, meter, progress.
- Deprecated elements: acronym, applet, basefont, big, center, dir, font, frame, frameset, isindex, noframes, noscript, s, strike, tt, u.
- Character encoding.
- Optional href on links.
- The async attribute.
- Interactive elements: details, menu, datagrid.
HTML4 is such a popular mark up format that HTML5 reinforces its success. It still functions with your existing web application, so that it is backward compatible. The collation of its individual features can support geolocation, video, audio and canvas. It is more than angle brackets and tags due to its interactive abilities with other programming languages. The new semantic elements supported by HTML5 include sliders, daters, email input types, amongst other input controls. Upgrading to HTML5 is as simple as defining your document type with <!DOCTYPE html>.
Browsers such as Firefox, Chrome, Safari, Opera, Google and Microsoft IE9 already support HTML5 which is defined by WC3. For further reading refer to the following: http://www.w3.org/TR/html5/introduction.html
This is an example taken from Digital Mosaic’s website for Rolls Royce, of how simple HTML5 video code can look:
<video width=”815″ height=”458″ poster=”preview1.jpg”>
<source src=”video1.webm” type=”video/webm; codecs=”vp8, vorbis”>
<source src=”video1.mp4″ type=”video/mp4; codecs=”avc1.42E01E, mp4a.40.2″>
<source src=”video1.ogv” type=”video/ogg; codecs=”theora, vorbis”>
However, as with all new versions of programming languages, there are pros and cons to consider. The advantages are most major players have implemented the HTML5 doctype.
- Web browsers all become subject to strict rendering.
- Progressive enhancement can augment structural elements into an impressive web page.
- It is validated by core authorities and the more a website is marked up with HTML5, the higher the probability that it will benefit from SEO.
- A drawback could mean additional formatting or scripting for older browsers.
The current version of HTML5 contains syntax that is more rigid than before. In short, this means that this allows users to browse with a more enriched experience. It evolved with end users and developers influencing the design principle. There have been additional syntax changes, the character encoding is immediately functional apart from some Android based devices and it has advanced greatly by informing user agents how to handle errors. Also it has acquired new semantic meanings via removal and alterations to some elements.
Vector graphics have become an intrinsic part of the web. Scalable Vector Graphics (SVG) enhance mouse driven games whereas Canvas benefits keyboard orientated games. The beauty of this programming upgrade is that it explicates scripts, holds images and information dense data is condensed. You can now deploy 95% of SVG to web. HTML5 is the long awaited update to HTML4, providing useful additions to the HTML language by simplifying coding and making web based applications more efficient and accessible.
Article written by