Putting content behind tabs is a common solution for keeping a websites body content clean and concise. Offering the user the ability to show, or hide content with a single click.
But is tabbed content a good thing for your search engine optimization efforts?
Recently Gary Illyes of Google confirmed that they are OK with tabbed content.
So the question isn’t whether tabbed content is SEO-friendly or not but how to implement it right.
How Badly Implemented Tabbed Content Can Hurt Your Rankings
When a crawler reads your JS statements it will simply either be able to understand it or not. If it isn’t understood, any piece of content within that sector won’t be displayed or rendered. Meaning that your well-structured content may not be of any value to your search aspirations.
A good way to see if your content is being read is to use the Fetch as Google function within Google Search Console, which displays both a rendered version for Googlebot and how a visitor will see the page.
So how does this relate to tabbed content?
Here’s an example is a standard piece of tabbed content – notice how it doesn’t contain a standard hyperlink:
<button class="tablinks" onclick="OPENTAB(event, 'EVENTNAME')" id="defaultOpen">TAB TITLE</button> <script> document.getElementById("defaultOpen").click(); var content = document.createTextNode("<YOUR_CONTENT>"); theDiv.appendChild(content); </script>
This is bad news for your webpage because this will significantly lower your content quality, not to mention missing out on those keyword-rich and relevant pieces of content.
What You Can Do to Fix This Issue
Because tabbed content is dependent on the kind of code showcased above, the most reliable way to fix it is by using CSS-based techniques where you have the text in different
div containers but hidden via
style="display:none" command then display them when one clicks on a tab.
Here is a real-life example of such implementation.
When you click on a section row, it displays the text behind it. If you need an in-depth how-to example, you can find one here.
Are you wondering if hidden text might not work with Google? Here is John Mueller’s confirmation that they are okay with content not being visible by default, especially in a mobile-first index era.
So you need to choose a well-structured and designed page that enables Googlebot to effectively crawl your website, indexing every single piece of content you have got to offer.
From the table above, you can quite clearly see the effect that tabbed content removal has had on the search engine rankings. Pages that previously struggled to get onto page 1 are now (and have remained) on page 1 for its target keyword. Target keywords that were already on Page 1, have gained position, pushing for that top slot.
Keyword 8, for example, wasn’t gaining any positioning. Once the tabbed content was removed, the page dropped slightly. However, over time, the page went from Page 3 to Page 1 within a matter of months.
Keyword 2 gradually started to pick up positioning but instantly jumped to Page 1, which indicates that the page was most likely crawled naturally at that point. Once the GoogleBot noticed the rich content that was not being hidden anymore, it decided that the page was worthy of page 1 status.
Arguments Against This Ideology
When creating an SEO rule such as this, considering other factors is also essential. Are there any other reasons why these pages have grown?
Below is a short list of other possible factors that may have affected these search engine results:
- Page age: As webpages get older, trust grows and will affect the position. The pages showcased in this research didn’t contain any information indicating the date that the page was created.
- Natural organic external links: No external links were built to these pages in the time we were monitoring the research.
- Algorithm changes: The only algorithm change that would have helped this would have been the ongoing content quality updates. This means that ongoing algorithm changes would benefit pages that showcase more (and relevant) content.
- Page creation: Pages weren’t gaining any position 3 months prior to the page being created.
- Existing on-page optimization: When the pages were created, standard SEO was applied, including meta optimization, content creation, header optimization and image optimization.
Will Google Ever Be Able To Read Tabbed Content?
Subscribe to SEJ
Get our weekly newsletter from SEJ's Founder Loren Baker about the latest news in the industry!