For example, tabbed content, like that shown in the gif below, won’t be indexed.
As you can imagine, this got us talking. Carousels, tabs and accordions are all legitimate devices to display content. So what’s OK and what isn’t?
First, let’s examine why Google have done this.
When your content far exceeds the real estate it’s supposed to occupy, these design elements can improve user experience.
The issue is that to ‘hide’ the content behind a tab, a CSS rule is usually applied to set the ‘hidden’ element’s display property to none; meaning it exists in the code, but is not displayed on screen.
You’ve probably already spotted the issue. Short-sighted, black-hat webmasters have started abusing this. Effectively, they are cloaking content by showing one thing to the user and another to the search engine’s crawlers.
Here’s Mr Cutts explaining the concept of cloaking:
Now, Google can’t apply an automatic downgrade/penalty to websites hiding content with tabs, carousels and accordions because there is far too much risk of penalising a legitimate use.
Their decision to simply ignore the hidden content is probably the most sensible. It negates any advantage for people attempting to game the system and doesn’t hurt anyone using tabs, carousels or accordions correctly.
Putting users first
As always, the motivation behind the announcement is improving a user’s experience. Google’s rationale is, if content is relevant and useful for a user, it shouldn’t be hidden.
On this point, I agree. When conducting a search, I am motivated to click a result based on the relevance of the snippet.
When I land on the destination page, I expect to see immediately the content within that snippet. If it’s hidden behind a tab, or in a collapsed section of an accordion, I won’t see it and will scroll up and down for a bit before hitting the back button, slightly confused.
Chunking isn’t anything to do with the 80’s classic movie, the Goonies. It’s a principle of interaction design.
According to ui-patterns.com, chunking is where you ‘group information into a limited number of units or chunks, so that information is easier to process and recall.’
The simplest example of chunking is this:
Telephone number before chunking: +44(0)1293265374
Telephone number after chunking: +44 (0)1293 264 374
Before chunking the phone number is impossible to understand and it’s hopeless to try and remember it. After chunking, it’s much clearer, with the international dialling prefix, area code, local number, all broken down into smaller units making it easier to process.
Applying chunking to your content
Here, it’ll be easier to show you a good example of chunking, rather than try to explain it.
The following screen capture comes from a section of MailChimp’s page about email automation.
This approach is good for users, because they can quickly see what’s relevant or interesting to them. It’s also good for search engines because they can crawl and index everything.
What about mobile navigation drawers?
So, does this mean Google will start to ignore your navigation? Does that negatively impact how your site gets indexed?
Reading the announcement literally, this could be the case. But we know Google is clever enough to figure out what a navigation menu is.
So the short answer here is it’s ambiguous.
The RocketMill rule of thumb when accessing the SEO impact of anything ambiguous is to ask: “Is this good for my users?”
At which point, I think this post about hamburger menus from Techcrunch is interesting. The TL:DR is hamburger menus are a problem because content that is out of sight, is also out of mind. The proposed solution is tabbed content (a form of chunking), much like what we see with Facebook’s App UI.
Image credit: Techcrunch
Is all of your content displayed in tabs, carousels and accordions? How are you planning on tackling the SEO impact on this? Let us know your thoughts @rocketmill