WOW icon indicating copy to clipboard operation
WOW copied to clipboard

Googlebot crawler doesnt see the content reveleaded by wow.js

Open palci12 opened this issue 9 years ago • 30 comments

content of the page which is reveleaded by wow.js isnt visible on render in Fetch as google tool. Have i done something wrong?

palci12 avatar Jun 17 '15 12:06 palci12

i have exactly the same problem. all content that is revealed by wow.js is invisible for googlebot. One can easily confirm this by using the "fetch as google" tool from googles webmaster tools.

The tool will see an empty page if you use wow on every element. Which means: Your page rank will go down the crapper!

Also it would be a bad idea to disable wow for the googlebot user agent because it will be categorized as cloaking (which is forbidden by googles quality guidelines)

So right now the only way i see to get around this, is to disable wow at all. Otherwise you will have a beautifully animated site that nobody visits.

z3robyt3 avatar Oct 22 '15 13:10 z3robyt3

Same problem here. It is affecting SEO very badly.

93gaurav93 avatar Oct 27 '15 16:10 93gaurav93

Just FWI: I completely disabled wow on all my pages. now google has reindexed them and my page rank is much better now. Very sad, because i really liked those wow effects

z3robyt3 avatar Oct 27 '15 16:10 z3robyt3

me too...

93gaurav93 avatar Oct 27 '15 16:10 93gaurav93

@z3robyt3 did you load your content dynamically? Or did you load the content on pageview and set it hidden?

mindbreaker avatar Dec 04 '15 12:12 mindbreaker

has this been resolved? @matthieua

gustavoatar avatar Feb 09 '16 21:02 gustavoatar

I know this is an old thread, but it appears that I am having the same issues with wow.js and the Google Search Console's "Fetch As Google". Can @gustavoatar or someone else tell me if this was ever solved? Thanks.

jjcweb avatar Jan 14 '17 06:01 jjcweb

Love this script! I'm using the commercial license. But it does look like Google Fetch isn't seeing it. I tried playing with the "live" setting (act on asynchronously loaded content), and toyed with overriding the visibility setting in css. No affect. Any solution for this? or a resolution?

I am using it on dynamic content but it is loading with the page. It seems like Google Fetch doesn't recognize the viewport check, or maybe the time delay?

jberg1 avatar Jan 14 '17 20:01 jberg1

@jberg1 I've never used Google Fetch but never had issue with Google crawling the content so far.

I can't think of an elegant solution (apart from rendering static content accessible by crawler which is not ideal). Happy to hear anyone's suggestions on this one?

My suggestion would be not to hide content that is crucial for SEO or at least making sure it's visible when JS is turned off.

matthieua avatar Jan 17 '17 04:01 matthieua

So should I turn off wow, wait for google to crawl and get data? then turn it back on? Really messing up my seo

alexrmacleod avatar May 14 '17 08:05 alexrmacleod

I don't think it's considered as cloacking if you disable wow for google bots as far as the content with or without wow is the same.

You can use : PHP - if (!preg_match('/google/i', $_SERVER['HTTP_USER_AGENT'])) { END PHP

PHP } END PHP

Hope it helps...

PaulBiod avatar May 16 '17 01:05 PaulBiod

It's strictly prohibited by google if they detect that, they will ban your site. Don't do it. It's violation of Google quality guidelines.

https://support.google.com/webmasters/answer/66355?hl=en

alan-mroczek avatar May 24 '17 08:05 alan-mroczek

@PaulBiod It is cloacking, because hash of entire html is different for google and for regular user. They will compare that and they will block your site some day. You can learn more at google support link which I sent. Matt Cuts, Google SEO expert there also makes a point, at the end of video that there is no such thing as "white hat" cloaking. Page should be exactly the same for both users and google bot.

alan-mroczek avatar May 24 '17 08:05 alan-mroczek

Ok, I understand. So what about using microdata to get the content indexed for wowed elements ?

PaulBiod avatar May 24 '17 11:05 PaulBiod

Has a fix for this been implemented ? My website's SEO is badly affected due to this.

vishnuramana avatar Oct 26 '17 10:10 vishnuramana

Hi all,

One idea could be to delay the adding of the Animate CSS class until the element is within the viewport. From what I can tell, Wowjs makes the element have visibility: hidden applied to it. This is what causes the issue.

An alternative would be to not add the wow class to the element, instead add the animated class and then as the element is in the viewport using jQuery or some other JS to add the "fadeInUp" or other Animate CSS class to apply the animation. I believe Wowjs is awesome but is more useful for lower priority content.

Google crawlers need to be able to see the content as the user sees it so I agree @alan-mroczek

rruprai avatar Nov 29 '17 17:11 rruprai

I've found a solution. I've tested this and it works.

Fix

var scrolled = false;

$(window).on('scroll', function() {
    if (!scrolled) {
        scrolled = true;
        wow.init();
    }
});

Basically just don't initialize wow.js until the person has started scrolling. I've tested this with the 'fetch as google' tool and this works.

credits to @robbie-thompson

danielgoodwin97 avatar Dec 03 '17 01:12 danielgoodwin97

So bad that this doersn't work for wow elements on the top of page

PaulBiod avatar Dec 04 '17 01:12 PaulBiod

@PaulBiod Why would you need a wow element at the top of the page? The user would already be able to see that without scrolling? Could you not just put the 'animated' class on it with the animation that you want so it plays on load?

danielgoodwin97 avatar Dec 04 '17 07:12 danielgoodwin97

@danielgoodwin97 Well yes, I had my logo on wow class so it comes from the left

PaulBiod avatar Dec 04 '17 10:12 PaulBiod

@danielgoodwin97 Thank you! You saved my day.

evenloooo avatar Jan 17 '18 07:01 evenloooo

I logged in to thumbs you up @danielgoodwin97

vsilva007 avatar Feb 11 '18 17:02 vsilva007

@danielgoodwin97 In what file I should include the block of code that you have proposed? I want to use it in a wordpress with the Zerif Lite theme enabled.

Thanks in advance!

rubenmromero avatar Mar 15 '18 07:03 rubenmromero

@rubenmromero It can go anywhere, as long as it's after jQuery & wow's scripts have been called.

robbie-thompson avatar Mar 15 '18 15:03 robbie-thompson

@danielgoodwin97 this doesn't appear to be working anymore for some odd reason. Can you confirm this?

Xayer avatar Jul 03 '18 13:07 Xayer

@danielgoodwin97 @robbie-thompson is your solution still working? Will implement site-wide if so

alexrmacleod avatar Aug 10 '18 19:08 alexrmacleod

What about this?

function bodyScrollAnimation() {
    var scrollAnimate = $('body').data('scroll-animation');
    if (scrollAnimate === true) {
        new WOW({
            mobile: false
        }).init()
    }
}

alexrmacleod avatar Aug 10 '18 20:08 alexrmacleod

@alexrmacleod I can confirm this is still working just fine for me! As long as you haven't scrolled everything is visible and once you start scrolling "visibility:hidden" will be triggered.

captainscorch avatar Aug 15 '18 10:08 captainscorch

I'm not convinced that this is still a valid SEO concern.

I tested one of my sites that uses wow.js and used an animated headline at page bottom. Here's my testing:

1. Google search: I used an "exact match" with my headline that was in question and Google returned my page as the first result. Great! BUT... Google did not show the keyword phrase I searched for in the SERP description (typically Google shows your search in bold). Not great. 2. SEO Quake Chrome Extension: Under Diagnosis, the tool shows my animated headline listed. Great! 3. Crawl as Googlebot: Using this tool (https://totheweb.com/learning_center/tools-search-engine-simulator/) and the tool read my animated headline. Great!

Maybe wow used to be a problem with SEO but is no longer since Google's algorithm is so advanced now?

MattWilsonMD avatar May 22 '19 22:05 MattWilsonMD

You can update the script to use opacity instead of visibility. This will fix any SEO and a11y issues with hidden elements.

wtran avatar Sep 25 '20 18:09 wtran