Is Tabbed Content Striking a Balance Between UX and SEO?

Posted by Kristian

In one of the age old battles that has waged on since time immemorial, or at least in the AG age (after Google) we've always had to bear witness to a bitter rivalry between user experience (UX) and search engine optimsation (SEO). And as much as the big G would have us believe the two are ideal bedfellows, the truth is that they are anything but. If a picture tells a thousand words why am I even bothering with on page copy at all? In short the answer is to placate Google, and to a lesser extent the other search engines.

[caption id="attachment_9236" align="alignright" width="400"]SEO + UX Image source: https://pixabay.com/en/chalk-chalkboard-seo-ux-webdev-792182/[/caption]

OK so this isn't entirely true and the web would be worthless without text, both from a user's and a search engine's perspective. However the point I'm making is that much of the time a page's written content is purposefully written in such a way as to balance what a user wants to see and what Google wants to see, because the two are still distinct. One primary example of this is the way in which text is presented on a page. We lazy humans of the Internet age are distinctly unimpressed by long unbroken paragraphs or seemingly unending sentences and will likely give up on getting to the end of anything over 600 words. By contrast however, when it comes to text Google is like a ravenous blood-sucking monster always wanting more, more MORE. What's the best way in which to balance the two? Why you shunt the less interesting content out of the way of course. The pretty stuff gets pride of place for the user with painstakingly handcrafted typography sitting among fancy graphics and smooth flat panels whilst the ugly but necessary bit can have a separate tab under which to do its dirty work of feeding Google those precious keywords that will help the customer facing stuff show up in search results. Ultimately the modern day SEO practitioner recognises that Google needs a good bit of meat to get its teeth into whilst the majority of users visiting a site need far less in order to come away impressed. This is of course dependent upon the type of site obviously, and users reading a blog will naturally expect more text than if they're visiting an online washing machine showroom. The trouble is that Google doesn't care, and it just wants that text regardless. People don't want to read 1,000 words on washing machines, but if you've got 1,000 words to put down about washing machines, Google is going to love you for it.

You’ve (Not) Got To Hide Your Content Away

[caption id="attachment_9237" align="aligncenter" width="500"]Image source: https://pixabay.com/en/ginger-cat-white-tabby-650545/ Image source: https://pixabay.com/en/ginger-cat-white-tabby-650545/[/caption]

Tucking away your nitty gritty in tabbed content, or behind a "read more" script, has long been the go to compromise by which you keep your website clean and crisp for the user whilst still serving the content Google's greedy spiders are seeking, and has served the design world well. Web developers hate the way in which technical SEO folk seemingly butcher their lush and trendy designs in order to cater to Google's needs in much the same way as those same SEO sorts get annoyed when all their carefully crafted search engine friendly content gets culled in favour of a jazzy animation concocted by an overeager web designer. The tabbed content workaround was a solid effort to keep the two warring factions apart.

[caption id="attachment_9238" align="aligncenter" width="500"]kblog3 Image source: http://www.smallerearth.com/uk/gap-years/[/caption]

By way of example take a look at this page on gap year jobs from adventure travel experience provider Smaller Earth. The information immediately visible to the user is the list of available programmes, however if you want more information in a broader sense on what this page is about you need to click through to the three other tabs of the page which each display a little more useful text. Now this text is supplementary to the page's primary aim in enticing visitors to make an enquiry about an exciting overseas travel experience, but it does serve a purpose in that by themselves the individually listed programmes don't tell a user or a search engine exactly what the site and the company is about. Give a little click to that Overview tab however and a handy round up of what you're actually looking at here is presented.

So What’s the Problem?

Everybody’s happy then, right? Wrong. Google came out last year and stated that doing things in this way was essentially "hiding" content from users and could therefore be discounted when Google crawls the page. In a live Google+ hangout last November Google Webmaster Trends Analyst John Mueller shed the following light on the issue: "If we [Google] can recognise that the content is actually hidden, then we'll just try to discount it a little bit. So that we kind of see that it's still there, but the user doesn't see it. Therefore, it's probably not something that's critical for this page. So that includes, like, the Click to Expand. That includes the tab UIs, where you have all kinds of content hidden away in tabs, those kind of things. So if you want that content really indexed, I'd make sure it's visible for the users when they go to that page.” So from the horse’s mouth you have it: tucking away that text is NOT the answer. But exactly what are you supposed to do with it? We already know that Google craves it so you’re shooting yourself in the foot by removing it all together. However, don’t you risk putting users off if you’ve just got reams and reams of writing, giving your pages oodles of scroll bar? Herein lies the problem. Ever since Mueller’s panning of the tabbed content workaround this commonplace feature of modern websites has been gradually disappearing as webmasters fear their content being ignored and their rankings suffering as a consequence. The world’s most popular content management system (CMS), Wordpress, has thousands of tabbed content plugins, which just goes to show how popular this method of content organising has been over recent years. Are these plugins now near enough redundant?

Examples in the Wild

Perhaps the most high profile example of a website doing exactly what Google is heavily hinting at here is the eCommerce behemoth Amazon. Take a look at any of the millions of product pages that exist on Jeff Bezos’ galaxy sized web store and you’ll note that they are LONG. To take one product page at random for the purposes of analysis I copied all the text from this page relating to a compact camera and ran a word count. From top to bottom there were over 3,200 words filling the busy page, none of them tidily tucked away in order to make the view more aesthetically pleasing and comfortable. This doesn’t feel like the right way to do things when you look at it. I want a clean and clutter free experience when I’m doing my online shopping. However, you can’t really argue with a company doing sales of over $88bn a year. So are Amazon doing things the way they should be done?

[caption id="attachment_9239" align="alignright" width="500"]kblog4 Image source: https://pixabay.com/en/monkey-amazon-spider-monkey-tree-365795/[/caption]

Based upon this evidence and Google’s assertion that it will “discount” text in tabbed content one would assume our earlier example from Smaller Earth would be precisely the sort of page with unindexed content. But take a look in Google’s cache for the aforementioned Gap Year Jobs page and switch the view to Text Only (a top tip for doing this is by adding a Google cache bookmarklet to your bookmarks bar and clicking it every time you’re on a page you want to see Google’s cached version of, then clicking the “text only version” link at the top) and what do we see? Why all that “hidden” content sunk under the frowned upon tabs appears to be just as indexed as the immediately visible front-facing content that appears as soon as the page is loaded. And if you really want to double check the indexation of that shadowy behind the scenes text, grab a sentence or two into your clipboard and paste it within quotation marks for a Google search. You’ll find the result returned is that very same page on the Smaller Earth site, which obviously wouldn’t happen were this content being ignored by Google.

Well What is Best Practise Then?

This is where things get tricky. Take a look at what Amazon are doing and combine this with Google’s own comments, you’d be of the opinion that tabs are bad and everything should be laid bare and made visible from the off. But of course in my Smaller Earth example above we’ve shown that the tidy tabs have had no detrimental effect on SEO, whilst keeping the site spick, span and user-friendly. Right now I’m keeping my tabs, because I believe user experience is of paramount importance. I know as an Internet user myself that ugly, messy sites are far less likely to keep my attention. However this isn’t to say that my way is the right way and there’s still every chance the big G could clamp down on this behaviour, suddenly devaluing content behind tabs. For now however, I’m going to take that risk whilst keeping a close eye on sites where I know this to be working. If they do pull the rug from under our feet, we’ll just have to address that problem when we come to it. If you would like to know more about SEO and UX download the free guide SEO Friendly Web Design Explained or follow my contributions to the blog to find out more about SEO best practise, content guidelines and eCommerce. Or sign up to the ThoughtShift Guest List, our monthly email, to keep up-to-date on all our blog posts, guides and events.