HTML5 is the latest version of the hyper text markup language (HTML) that’s used to build websites. While it preserves many of the elements found in previous versions, HTML5 brings a slew of new features and additions to the table. Let’s take a look at some of the top benefits of this latest version and why you should make the switch.
#1) Built-In Media Playback
Say goodbye to using Adobe Flash, Apple Quicktime, Microsoft Silverlight or similar third-party programs to play media on your website. With HTML5, there’s video/audio playback built into the framework for quick and easy integration. There’s no need to download third-party programs and mess with complicated embed codes to play movies or audio files, as this function is built directly into HTML5.
See below for an example of video playback using HTML5.
<video poster=”video.jpg” controls>
<source src=”video.ogg” type=”video/ogg”>
<source src=”video.mp4″ type=”video/mp4″>
Your browser does not support the <code>video</code> element.
</video>
Another neat feature of HTML5 is its ability to provide different video formats based on visitors’ web browser specifications. Using the above code as an example, visitors will first attempt to load the video.ogg. If their browser doesn’t support this format, however, it will move on to the next format, video.mp4.
#2) Smartphone and Tablet Friendly
With mobile internet use expected to trump desktop use by the end of the year, webmasters can no longer afford to overlook compatibility across different devices. Just because a website loads on a desktop computer doesn’t necessarily mean it will load and function properly on a smartphone or tablet computer.
Thankfully, HTML5 tackles this issue head on with its mobile-friendly approach to creating websites. As most iPhone users already know, iOS-powered devices typically lack Adobe Flash support, meaning videos and other media may not play on these devices. HTML5, however, runs across all devices, so you don’t have to worry about the lack of Flash support.
With HTML5, webmasters can also define viewport widths and zoom settings to optimize display across different devices. Forcing visitors to scroll horizontally or zoom to access certain area may not restrict the core function of the website, but it can lead to a poor user experience.
#3) Cleaner Code
A third reason why you should embrace HTML5 is because it has cleaner code and improved semantics. You can remove all of those <div> tags cluttering your website and replace them cleaner, more search engine friendly tags like <header>, <footer>, <article> and <section>.
The introduction of these new tags allows search engines to read and categories content more accurately. It’s still to early to draw any direct correlation between these codes and higher search engine rankings, but organizing your content with the appropriate tags can only have a positive impact in terms of SEO value.
#4) Offline Caching
Caching isn’t an entirely new technology, as most web browsers have at least some form of built in. However, HTML introduces a new type of advance caching, known as offline caching.
Offline caching allows webmasters to define which parts of their website visitors should save and store in their browser. If someone is reading an article published on a website built using HTML5, their browser will store the files locally. In the event this person loses his or her internet connectivity and accidentally hits the back button in their browser (which is something we’ve all experienced), they can still access the site without seeing the “You are not connected to the internet” message.
#5) It’s Compatible Across All Major Web Browsers
HTML5 is supported across all the major web browsers, including Microsoft Internet Explorer, Mozilla Firefox, Google Chrome, Apple Safari and Opera – even most of the older versions. All of the major web browsers will load the HTML5 doctype, so you don’t have to worry about your website not loading for visitors using a dated version of Internet Explorer. With that said, certain elements of HTML5 may not currently be supported across all browsers.
If you’re wondering whether or not your web browser supports HTML5, head over to html5test.com. The name pretty much says it all. It immediately checks your browser for semantics, multimedia, 3D graphics, effects, performance, integration, connectivity, device access and more.
These are just a few of the many benefits of HTML5. Other features introduces in this version include:
- Geo-targeting
- Improved forms
- Interactions and animations using the <canvas> tag
- Support for building mobile applications
- Reduced load times
- Less maintenance required
There’s really no reason why you shouldn’t build websites using HTML5. It’s a cleaner, more versatile language that’s optimized for mobile devices. And with built-in support for video and audio, it’s guaranteed to create a more positive experience for visitors. So the next time you get ready to launch a new site, or update an existing one, consider the use of HTML5.