Date Posted: Sep 08 2016

Tags: HTML5, SEO, Semantics

Is there any SEO value in HTML5 semantic elements?

Since the release of HTML5 in October 2014 there has been a lot of discussion regarding "HTML5 Semantic Elements" and their value to search engine optimisation ("SEO").

There seems to be a vast amount of misinformation and misunderstanding circulating the web on the subject. This is most likely due to there being very little documentation or official confirmation from reliable sources, such as Google and other top search engines, on how semantic elements affect search results.

In this article we are going to break down what we know as fact and what is just speculation.

WHAT ARE SEMANTIC ELEMENTS?

So what exactly is a "Semantic Element"?

Stemming from the Greek word sēmantikós (‘Significant’), semantics is the study of the meanings of words, phrases and symbols in a language.

In programming languages "Semantic Elements" refer to elements with a meaning.

As an example we can compare two very commonly used HTML elements, "<div>" and "<h1>", to better understand the difference between non-semantic and semantic elements.

The "<div>" element defines a division or section in a HTML document. This element is a good example of a non-semantic element as it does not hold any extra meaning. When a browser or crawler reads a "<div>" element it is not receiving any information on the content contained within the element; it is seen simply as a division.

The "<h1>" element defines the most significant header within the HTML document. This is an excellent example of a semantic element. When a browser or crawler reads a "<h1>" element it is receiving multiple meanings or information on the content contained within the element. It is identifying the content as a header, and also as the most significant header within the HTML document.

WHAT IS ALL THE HYPE ABOUT HTML5 SEMANTIC ELEMENTS?

As we can see in the last section’s example; semantic elements are not new to HTML5 and have existed even since the first release of HTML in 1991. So what is all the hype about HTML5’s newly introduced semantic elements?

The new semantic elements that have been introduced with HTML5 allow us to structure HTML documents, more semantically and with much more meaning, in a much easier way than before.

For example, we can now define semantic divisions/sections within our HTML documents with the newly added HTML5 element; "<section>". We can also define where our content begins and ends with the "<main>" element and we can even define independent, self-contained content within the "<article>" element.

Better yet we can nest many of the new HTML5 elements within each other for even further semantic structuring of your content.

For instance we can nest "<section>" elements within the "<article>" element to define sections within our self-contained content. We can also nest that same "<article>" element within another "<section>" element.

SO HOW DOES THIS EFFECT MY SEO?

To be honest, we actually do not know as of yet. There has been no evidence or official confirmation, from Google or any other search engine to date, confirming if HTML5 semantic elements are being used by their algorithms to rank pages; but there has also been no evidence or official confirmation to state that they are not used.

SO WHY SHOULD I BOTHER WITH HTML5 SEMANTIC ELEMENTS?

Now this is a question we should all be considering and it can be answered logically to some extent.

1. The top argument for the use of HTML5 semantic elements lays in the history of semantic elements throughout HTML: how they have and still do affect SEO value of your HTML document. It is well known that standard HTML semantic elements (h1, title, etc.) are used by Google and other search engines as a core ranking metric.
   
   It seems a logical progression from the current practice of search engines to adopt HTML5 semantic elements into their ranking algorithms.
   
   
2. HTML5 semantic elements also assign priority in their meanings. For example, the use of the "<main>" element to define where your content starts and ends is a good indication to a crawler as to where unique content is contained within your document.
   
   
3. Google has readily adopted structured data in the form of Schema to allow webmasters to provide extra context and value to SERP users. So there is evidence of Google favouring more structured data.
   
   
4. HTML5 Semantic elements also promote a more universal naming system that is far easier for a crawler to understand when reading a HTML document. For example, one developer may name their headers surrounding div id "header" but another developer may name them something completely different such as "site-header".
   The HTML5 semantic element "<header>" is more universally understandable to a crawler, and clearly indicates to the crawler that the contained contents are part of a header.
   
   
5. Standard HTML semantic elements (h1, title, etc) have made content far more accessible to crawlers. HTML5 semantic elements provide even more potential accessibility to crawlers. To quote Google’s advice on improving your rankings "Make your site easily accessible".
   
   

IS THERE ANY REASON WHY I SHOULDN’T USE HTML5 SEMANTIC ELEMENTS?

Most modern browsers are fully compatible with the new HTML5 semantic elements; but as per usual Internet Explorer is here to rain on our parade.

Internet Explorer versions 8 and below do not support HTML5 semantic elements, and versions 9 to 11 only have very minimal support for HTML5 semantic elements.

A full list of supported browsers can be found here:
http://caniuse.com/#feat=html5semantic

THERE IS A WORKAROUND!

Fortunately, some very clever people have created a JavaScript script known as HTML5Shiv as a workaround for browsers incompatible with HTML5 semantic elements!

You can find the latest version and references for HTML5Shiv at GitHub:
https://github.com/aFarkas/html5shiv

HTML5Shiv is also distributed in the extremely popular JavaScript library Modernizr which can be found here:
https://modernizr.com

THE VERDICT

There is no solid evidence that using HTML5 semantic elements will improve your SEO, but there are plenty of logical reasons that they should or could in the future. Unless your audience is primarily Internet Explorer based, or you are uncomfortable using JavaScript as a workaround for older browsers, there is no harm in implementing HTML5 semantic elements.

Hopefully, in the future we will receive official confirmation from one of the major search engines regarding the SEO benefits, but until then we can at least prepare our HTML documents for possible future changes and in the process reap the benefits of a more universally structured mark-up.