Welcome to WebmasterWorld Guest from 35.175.191.168

Forum Moderators: Robert Charlton & goodroi

Message Too Old, No Replies

Google Not Displaying Hidden Content - Solution ?

     
7:40 am on Dec 16, 2014 (gmt 0)

Full Member

5+ Year Member Top Contributors Of The Month

joined:June 18, 2012
posts: 341
votes: 1


Hi All,

It looks like I'm late to the party. Of late, I notice that Google is not showing my home page when I search for the content hidden behind tabs.

These tabs shows 3 different products and very minimal bullet points upon mouse over. This new design was proved to improve the user engagement on the site and enhance the user experience. That's it.

Not sure why Google is going towards not indexing contents behind tabs/ajax/accordion/collapsed content. This one video from Google's John Mueller almost confirm the same. [seroundtable.com...]

Have any of you observing the same? What do you think would be an alternate way other than long scrolling pages?


Thanks for the inputs!
12:26 am on Dec 17, 2014 (gmt 0)

Administrator from US 

WebmasterWorld Administrator goodroi is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:June 21, 2004
posts:3509
votes: 387


We talked about this two months ago [webmasterworld.com...]

The simple solution is to just move your important content on top.
12:37 am on Dec 17, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member themadscientist is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 14, 2008
posts:2910
votes: 62


The use of a #! to indicate an AJAX page state [#!show-tab-two-here] or displaying all content and using a fragment-identifier [#fragment-id-here] so the SEs can send visitors to the page with the correct tab or what would be scrolled-to content displayed initially might be your friend in this type of situation.

In-other-words: A #! [shebang identifying the correct tab for SEs to display for visitors] so SEs send visitors to the correct content *or* displaying the entire content of the page and using fragment-identifiers [#identifier-here] with prominent links to the correct section of a page to make it readily accessible to visitors by clicking rather than scrolling and also allowing SEs to send visitors to a specific section of a page, especially on mobile, might be the way to get the-best-of-both-worlds in this type of situation.

[edited by: TheMadScientist at 12:42 am (utc) on Dec 17, 2014]

12:38 am on Dec 17, 2014 (gmt 0)

Senior Member from GB 

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month

joined:Apr 30, 2008
posts:2630
votes: 191


What do you think would be an alternate way other than long scrolling pages?

As TMS said, but be vary of "thin content" URLs.
Also, what about the good old-fashioned pagination?

What I would like to know is whether anybody who is using tabs or similar actually noticed drop in ranking/impressions that is attributed to this? I mean other than searching for the part of the sentence inb quotes?
12:55 am on Dec 17, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member themadscientist is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 14, 2008
posts:2910
votes: 62


I should probably add: I have used fragment-identifiers with prominent links to specific sections on pages to eliminate scrolling and they rank(ed) well for a number of keyphrases, even if the phrase(s) first appeared far down the page, but I don't use a shebang often, even though for a tabbed viewing situation it might [would probably] be a better solution -- I don't use tabs very often so there hasn't really been a need for me test and see which is better in a given situation or if there is any difference between the two from a SEO perspective, but I would guess for tabbed viewing a shebang [AJAX-page-state indication] would likely be a better way to go.
5:10 am on Dec 17, 2014 (gmt 0)

Preferred Member

5+ Year Member

joined:Jan 12, 2012
posts:397
votes: 0


I used tabs for a long time. I got rid of them a few months ago, but not because of anything search-related. It was just a design change.

Honestly, I never really felt like the content in the tabs was being discounted. But then again, I covered all the things that would be important to most people on the default tab -- the other tabs just went into more specific detail on certain elements.

So maybe that's a potential way to go about it.

IE: If you imagine a page that's selling computers, you might have a specs tab. Well, mention the specs your customers think are most important (CPU, graphics card, whatever), on the default tab too, but then show the more detailed stuff in the specs tab. That way, you have specs content that isn't discounted for being in a tab, and you may have a better chance of showing up for that stuff.

Just an idea.

Edit:

In response to this:

Not sure why Google is going towards not indexing contents behind tabs/ajax/accordion/collapsed content.


I get it. If a user searches for x computer specs, and they land on a page that doesn't have any specs (but rather a tab -- which is essentially a link to the specs), you can understand why that might not be a good experience for a searcher. Now, that doesn't mean it isn't a good experience for your site users. But you have to admit it may not be a good experience for a searcher looking for a particular piece of information to land on a page that doesn't have their answer readily visible.

From a technical point of view, sure, the content is on the same page. But from a user point of view, a tab is basically a link to a different page. Why should one page rank for content that's on a different page? That, I assume, is the problem Google is struggling to solve.
10:42 am on Dec 18, 2014 (gmt 0)

Full Member

5+ Year Member Top Contributors Of The Month

joined:June 18, 2012
posts: 341
votes: 1


Thank you all for answering and the references.

I'm not a code pro. I found that there are two situations on my site where the hidden contents are used.

1. Home Page - The user lands on the first tab by default and 2nd, 3rd tabs are right beside it which opens upon mouse over.
--> I used Google chrome dev tools and it shows HTML <div> for this action.

2. Inner Pages - The 'learn more' links under each product specifications brief opens up a larger detailed content below it.
--> This one is done using CSS display: none function as I could see it.

Now, as most of people have already claimed, Google is showing the collapsed content page when I make a site search like site:example.com "content from collapsed section". But it's not showing the content in the meta description section as it would show for any others pages in bold texts.

It's so confusing. So, Google sees the content but it's not going to rank that page for the optimized keywords if it's in the collapsed content section? Also, @TheMadScientist - Do you really think using a 'fragment id' can help the collapsed content rank for certain keywords that the collapsed content is optimized for?

Thanks again!
1:28 pm on Dec 18, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member netmeg is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Mar 30, 2005
posts:13012
votes: 222


So, Google sees the content but it's not going to rank that page for the optimized keywords if it's in the collapsed content section


Not quite, it sounds like they see the content, but it won't necessarily be useful for SEO purposes. Because they probably figure if it's important (or legit), you wouldn't put it in a collapsed content scenario. Which is a nuisance, but it means I'll make sure amost of the important stuff on a product page is front and center, and use the tabs for stuff like specs.

I've definitely seen abuses of collapsed content, but it's still a useful thing for users, and trying to squeeze 10lbs of info into a 5lb page.
4:26 pm on Dec 18, 2014 (gmt 0)

Senior Member

WebmasterWorld Senior Member bwnbwn is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Oct 25, 2005
posts:3595
votes: 50


I think the problem was caused by owners stuffing these tab menus with nonsense content on thin pages to help rank a page. I have seen this so many times I was wondering when this would happen.

legit owners suffer from the ones that abuse it but really there isn't a way to tell abuse from legit, so solution is to stop using this as page content.
6:38 pm on Dec 18, 2014 (gmt 0)

Senior Member from GB 

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month

joined:Sept 16, 2009
posts:1087
votes: 83


I don't know if it's still the case, but a while back Moz published an experiment that showed that links from one part of the page to another using # were not only counted, but more than one anchor text was noticed (previous tests having shown that Google counted first anchor only when page A linked more than once to page B).

Google indexes Wikipedia on-page anchors and displays them in the SERPs.
12:44 am on Dec 19, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member themadscientist is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 14, 2008
posts:2910
votes: 62


@TheMadScientist - Do you really think using a 'fragment id' can help the collapsed content rank for certain keywords that the collapsed content is optimized for?

No. I'd use an AJAX Page-State [#!show-tab-2] for content that is not displayed initially so SEs and visitors can link directly to the version of the page that displays the hidden content -- I use fragment-identifiers with links to specific sections of content when all the content is expanded/displayed initially, so SEs and visitors can link or "jump" via link directly to a displayed section without having to scroll the page.
9:53 am on Dec 22, 2014 (gmt 0)

Full Member

5+ Year Member Top Contributors Of The Month

joined:June 18, 2012
posts: 341
votes: 1


Because they probably figure if it's important (or legit), you wouldn't put it in a collapsed content scenario.
Do you think they are smart enough to distinguish between abusive collapsed content and the the legit ones aimed at improving user experience? I think the move is not quite good since Google asks to create websites for users not search engines. May be not anymore.

I don't know if it's still the case, but a while back Moz published an experiment that showed that links from one part of the page to another using # were not only counted, but more than one anchor text was noticed (previous tests having shown that Google counted first anchor only when page A linked more than once to page B).
Yeah, I read that too. That seems to helps to break the believing of only the 1st anchor text on a page counts when there are multiple anchor texts pointing at the same page. I believe that's more of a ranking factor than whether the actual content is considered for indexing or not. Even that might have changed now until it's proved wrong with a new case study.

so SEs and visitors can link directly to the version of the page that displays the hidden content
Can you please explain this part? I don't get it. Thanks!
1:24 pm on Dec 22, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member netmeg is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Mar 30, 2005
posts:13012
votes: 222


Do you think they are smart enough to distinguish between abusive collapsed content and the the legit ones aimed at improving user experience?


Sometimes. Maybe. I wouldn't want to depend on it.
1:26 pm on Dec 22, 2014 (gmt 0)

Senior Member from GB 

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month

joined:Apr 30, 2008
posts:2630
votes: 191


so SEs and visitors can link directly to the version of the page that displays the hidden content

Can you please explain this part? I don't get it. Thanks!


This means: Can you link to the page in a such a way that the hidden content shows open when you first land on the page? E.g. if your default tab is tab1 and the hidden content is on Tab#2, can you link to this URL in a way that tab#2 is initially open?
9:54 am on Dec 24, 2014 (gmt 0)

Full Member

5+ Year Member Top Contributors Of The Month

joined:June 18, 2012
posts: 341
votes: 1


This means: Can you link to the page in a such a way that the hidden content shows open when you first land on the page? E.g. if your default tab is tab1 and the hidden content is on Tab#2, can you link to this URL in a way that tab#2 is initially open?

I'm confused. Will not that make the Tab#1 content disappear from Google index? Thanks.
10:52 am on Dec 24, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member themadscientist is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 14, 2008
posts:2910
votes: 62


Will not that make the Tab#1 content disappear from Google index?

No. If you implement AJAX Page States correctly using the #! it should be more like having 3 different pages rather than only one page with some content hidden when a visitor initially lands on the page, because modern SEs [think Google, Bing, Yahoo! (if Yahoo! was actually still a search engine) etc.] can send a visitor to the page and via the info after the #! can tell the page to display the tab/content [tab-1, tab-2, tab-3, etc.] the visitor was searching for when the page initially loads rather than having to send visitors to "tab-1" and hoping they click on "tab-2" or "tab-3" or "whatever" to find what they searched for.

That's the best way I can put it right now, sorry if it doesn't make sense...
6:25 am on Dec 30, 2014 (gmt 0)

Full Member

5+ Year Member Top Contributors Of The Month

joined:June 18, 2012
posts: 341
votes: 1


Thanks again @TheMadScientist

Is there a possibility to share a live example (sorry if it's against forum policy) or ajax tutorial on this?

Much appreciated!
9:24 am on Dec 30, 2014 (gmt 0)

Senior Member from US 

WebmasterWorld Senior Member themadscientist is a WebmasterWorld Top Contributor of All Time 10+ Year Member Top Contributors Of The Month

joined:Apr 14, 2008
posts:2910
votes: 62


The best example I can come up with using here is...

NOW

The main topic location is:
http://www.webmasterworld.com/google/

This specific topic is:
http://www.webmasterworld.com/google/4722381.htm

With AJAX and telling search engines

The main topic could be:
http://www.webmasterworld.com/google/

With this thread being:
http://www.webmasterworld.com/google/#!4722381 or
http://www.webmasterworld.com/google/#!Google-Not-Displaying-Hidden-Content

###

Basically, the #! lets visitors view your content and says "treat the info displayed as a different page even though the base URL is the same" to search engines at the same time, meaning basically you're saying to search engines, "Hey, we change the content based on the info after the #!, so treat it as individual!"

Conversely, # only says, "Go to this part of the page/info, which is part of a bigger whole page."

So as far a search engines go, in the first case, you're saying "send people here and it's the entire info [page] they'll see", but in the second, you're saying "send people to a specific part of the page/info they land on."

###

In the preceding example, #! says "different page/info" to SEs, while # simply takes people to a specific part of a bigger "whole" page -- Hope that make sense.

###

Here, the "better answer" would be:

http://www.webmasterworld.com/google/4722381.htm#msg-num

Rather than:
http://www.webmasterworld.com/google/#!4722381

Because here, a post should be treated as part of a bigger page, not an individual page on it's own as a "whole" or anything like that.
1:33 pm on Dec 30, 2014 (gmt 0)

Senior Member from GB 

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month

joined:Apr 30, 2008
posts:2630
votes: 191


TMS has explained well. Note that if you are switching with CSS only, this would involve changing this to use AJAX.

Here is Google's recommendation on how to implement this:

Making AJAX Applications Crawlable
https://developers.google.com/webmasters/ajax-crawling/ [developers.google.com]

To clarify, it is not enough just to add ! after the # in URL. There must be some back end server changes done too.