ashleysheridan.co.uk

Welcome

Articles are organised by date. Typically, there will be a new one as and when I have the time and find a subject to talk about.

Why You Should Use HTML 5

Contents

Why You Should Use HTML 5

Some of you might have heard about HTML 5, and some of you might even have looked into the specification for this new proposed standard. The thing is, until until more browsers start supporting it, what possible incentive do you have to start implementing it on your own websites?

What HMTL 5 Is

One of the key aspects of HTML 5 is to be backwardly compatible with previous standards, so that browsers that don't understand the new tags are still able to render pages. With this in mind, it's worth considering just what the fifth iteration of this language will bring for the future of websites.

The most important concept behind HTML 5 is to bring meaning to the content. This is a far more important ideal than you might first realise. Primarily, the Web is a visual medium, and like all other visual media, such as print, semantic information is conveyed through colour and layout. Whilst this works for the majority of people, some have disabilities which mean they miss this. One shouldn't forget also, that people are not the only consumers of Web-based content; search engines are undoubtedly the most important part of the Web, because without them, who would find your site?

Earlier versions of HTML had a rudimentary semantic model in place, with such elements as <h1>, <acronym> and <em>, which, if used well, can aid user agents (browsers, search bots, etc) immensely. The idea in HTML 5 was to build upon this and improve the tools a developer has at their disposal to further this practice. So, now we get tags such as <article>, <footer> and <nav> to use in our websites, as well as a slew of others.

How Will HTML 5 Change Web Development?

What does this mean then to the average developer? Well, right now, there's no hard and fast facts, but there seems to be talk from the Google camp at least (http://radar.oreilly.com/2009/05/google-bets-big-on-html-5.html) that they are interested in the new specification. I mention Google specifically because they are undoubtedly the largest search engine in the world, with over 90%*1 of the market. If they say they're interested in HTML 5, you better believe that it's important.

At a very simple level, search engines that are HTML 5 aware will be able to distribute their page weighting more efficiently on your web pages. For example, Google uses various different weighting systems to value your pages against all the others in its database. One part of this is the page weighting on your own site. The weighting is always a single, fixed value that is distributed across the content of your pages. The content in a <footer> element might be weighted very low as opposed to the content in the <header> element.

Diagram showing a standard page layout where all content is equal, and a new HTML 5 layout, where footer tag content might be worth half the weight of regular content, and header tag content might be worth 1½ times as much as regular content

Now, this is by no means how it will work exactly, but it should give you an idea of what is possible. The new tags could allow you to identify the important parts of your pages, which a search engine can then use to determine how you rank against other pages of similar content.

If you're worried about this being something that can too easily be exploited, just think on where we are at the moment. It's fairly well known that search engines favour keywords inside <h1> tags more than the same words inside of

tags, but stuffing all of your content inside <h1> tags only serves to dilute the rating the keywords are given. It would be safe to assume that the new tags will be treated in just the same manner with regards to SEO to avoid the inevitable spammers.

Embedding Richer Media

The other main plus that HTML 5 brings is in the embedded media area. The standard includes tags for adding audio and video directly to your pages, even allowing you to add lists of fall-back file formats so that you can ensure that the greatest possible audience can view your latest home video. Up until now, Flash has always been used for this, but as the leading mobile phone right now doesn't have support for Flash, and with it's new brother the iPad being bereft of a Flash player, there will certainly be a use for <audio> and <video> tags.

The <canvas> tag looks like a promising feature to allow diagrams to be drawn dynamically with Javascript, and might be a total replacement for SVG if enough browsers adopt it. While the SVG language has more features than <canvas>, many browsers still require plugins to use it, and browser take up seems to be swinging more favourably to <canvas> right now.

Should You Start Using HTML 5?

The short answer is 'yes'. It's inevitable that this standard will have an impact on SEO and the browsers through which we access the Web, and the majority of the main browsers have already made efforts to implement the standard, with Opera leading the field, closely followed by Firefox and Chrome. As expected, Internet Explorer is languishing behind, but with all the indicators showing that it is losing more and more market share each year, there's no good excuse to base all your web development around its limitations.

The standard has been developed with backwards compatibility in mind, and there are a plethora of tutorials available online that show developers how to mark up their web pages so that they can fail gracefully in less capable browsers. This means that your websites can only benefit from these changes, as the worst that can happen is that they appear the same as they ever did to a few older, less compliant browsers. When you consider that just a little bit of time expended by you could improve SEO and the browsing experience of a large portion of your site visitors, there's no real reason why you shouldn't use the new standard.

Keep Up To Date

  • Follow me on Twitter
  • Add me on LinkedIn
  • Subscribe to my RSS feed
Works on all browsers!