element has a semantic reason.
The semantic reason is that it communicates that the content wrapped between the
elements are the main content.
Search engines divide a page into sections like the navigation, main content, and footer.
Google’s Martin Splitt talked about that in a couple podcasts.
Regarding the use of heading elements to identify what sections of a page are about, Martin Splitt said:
“It’s pretty much that.
With any kind of content some semantic and some structure in your content so that it’s easier for automated systems to understand the structure and the kind of like, the bits and pieces of your content.”
In another webinar, Martin Splitt talked about what Google calls the Centerpiece Annotation, which is like a summary of what the topic is about.
Martin Split discussed how Google looks at the semantic content and the layout tree (how the HTML elements label the sections of a page) to determine what the topic is.
He explained:
“That’s just us analyzing the content and, I don’t know what we have publicly said about this, but I think I brought it up in one of the podcasts episodes.
So I can probably say that we have a thing called the Centerpiece Annotation, for instance, and there’s a few other annotations that we have where we look at the semantic content, as well as potentially the layout tree.”
He goes on to explain that Google reads from the HTML content structure to figure out that the content contained in that section is about a specific topic.
So in other words, the
element isn’t an SEO ranking factor.
It’s used as a way to divide a webpage into sections and communicate to Google what that section is, what can be found in that part of the webpage.
Element and Accessibility
Mueller also mentioned the use of the
element for purposes of making a webpage more accessible.
The Mozilla Developer resource pages, a great source of information, describes the role of the article element:
“…the
element should be used. User agents translate this to the appropriate accessibility information just like the article role.
Using the
element also helps search engines better discover the structure of a page.”
Can
Element Be used for Product Listing Pages?
The last question that was asked is if the
element can be used for product listing pages.
The official HTML documentation indicates that yes, the
element can be used for a product listing page because it’s an “independent item of content”.
The documentation explains:
“The article element represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication.
This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.”
The Mozilla Developer documentation for the
element is more explicit:
“The
HTML element represents a self-contained composition in a document, page, application, or site, which is intended to be independently distributable or reusable (e.g., in syndication).
Examples include: a forum post, a magazine or newspaper article, or a blog entry, a product card, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.”
Should You Use the
Semantic HTML Element?
I think that some people misunderstand the word “semantic” when considering the phrase, Semantic HTML.
It is not semantic in the sense of telling Google what a topic is about.
It’s semantic in the sense that it relates to identifying the purpose of a section.
And that’s what the
element does, it tells Google the purpose of a section of a webpage.
The fundamental essence of SEO is making it easier for search engines to understand what a webpage is about.
The
element makes it easier for search engines to identify where the main content is, making it easier to find where to find what Martin Splitt calls, the Centerpiece Annotation.
What the Google SEO Office Hours Video at the 6:44 minute mark:
Featured image by Shutterstock/ViDI Studio
