HTML5 & SEO

What is HTML5 ?

HTML5 is the fifth evolution of HTML, the omni-present tag system which is necessary to build websites.This evolution has not yet been officially validated by the W3C consortium in a final version. This validation process is still extremely long (the first work on HTML5 started in 2004).

Compared to previous developments in HTML / XHTML, the HTML 5 has retained a certain simplicity, thus being accessible to most webmasters, while offering powerful new features for the most sophisticated needs. While it is always difficult to predict the future in terms of technology, HTML 5 will most likely be more and more present on the Web.

Recent versions of major browsers (Chrome, Firefox, Internet Explorer ...) are able to handle the vast majority of features introduced by HTML5. This actually means that website creators can already take advantage of HTML5 now. The price to pay is that some features will not work with some older browsers that are still used today.

Here is the official HTML5 logo:

HTML5 and the SEO / Organic SEO

So far there is no indication that Google favors websites using HTML5 compared to other versions of HTML. This is consistent with the official goal announced by Google: providing the most interesting content to users based on their request. And it will therefore focus on the quality of the content rather than on the technology used to build the website. This could change in the upcoming years.

Specifically, if you already have a website that does not use HTML5 and which is well SEO optimized, from the SEO point of view, there is no urgent need to move to HTML5.

Conversely, if you have decided to create or fundamentalyl redesign your website using HTML5, for a good reason - other than for the SEO - it is interesting to consider these two new features of the HTML5 that will help you optimize your website:

  • Using the new <header>, <footer>, <article>, <nav>, <aside> tags for structuring your website.

    Indeed, HTML5 introduces a number of new tags that identify very classic blocks in most websites: the header (header), the footer (footer), the navigation area/ menu (nav) the content (articles), the band on the side (aside). This is interesting from the SEO point of view because it greatly facilitates Google's task of "understanding" the structure of your website. And in particular that of targeting the most important content areas of your webpage .

    Today Google is already able to do this with websites that do not use HTML5, but his task in this case is a bit more complicated, with a risk of error, just as there are no such specific tags.

    You can find in this articlean example of classic HTML 5 page structure

  • Reduce or eliminate your dependence on proprietary technologies (like Flash) on your website thanks to the new HTML5 tags for audio and video.

    From a SEO perspective, if a website makes extensive use of external areas (like Flash), it will be more difficult to optimize. Google is able to index the content of a Flash component, but its task is more complicated than for simple HTML. The HTML5 allows you to avoid the use of external technologies in many situations.

Other main new features of HTML5

Apart from the two points described above, which concern the SEO, here are the other main new features of HTML5:

  • a new <canvas> tag for dynamically creating images
  • the possibility to create websites with certain features which continue to function even without Internet access. This is very interesting for the new generation of Cloud applications (email portals, Google docs...)
  • Better HTML forms. In particular, it is now possible to validate the content of the fields seized by the visitor directly in HTML, without having to use the Javascript code or Client / Server interactions as today

An example of HTML5page

Here is the skeleton of a webpage using HTML5 :

<!doctype html>
<html lang="fr">
	<head>
		<meta charset="utf-8" />
	</head>
	<body>
		<header>
			Logo, tag line, login...
		</header>
		<nav>
 			 <ul>
			    <li><a href="#">Accueil</a></li>
				<li><a href="#">Menu 1</a></li>
				<li><a href="#">Menu 2</a></li>
				<li><a href="#">Menu 3</a></li>
  			</ul>
		</nav>
		<article>
			<h1>Titre 1...</h1>
				<h2>Titre 1.1...</h2>
					<p>paragraphe...</p>
					<p>paragraphe...</p>
				<h2>Titre 1.2...</h2>
					<p>paragraphe...</p>
					<p>paragraphe...</p>
		</article>
		<footer>
			<p>Copyright, Legal notice...</p>
		</footer>
	</body>
</html>

The free Yakaferci tool for analyzing the HTML versions used by your pages


Analyze your web pages with our free SEO Page Analyzer :
ANALYZE


To start a Yakaferci analysis, simply enter the link to your page in the area above and click the Analyze button. You can then access the different pages of the report, especially those on HTML.

View more...

If this article has inspired you to search for more information on HTML5, here are some useful links: