search

ampproject / ampstart

AMP Start source code and templates .
https://ampstart.com/
Apache License 2.0
419 stars 152 forks source link

Missing css style makes Googlebot render a site falsely with heavy consequences for ranking #820

Open reinhardmohr opened 6 years ago

reinhardmohr commented 6 years ago

Hi, I had submitted this same bug on ampproject/amphtml (#16538) but was advised by some John Pettitt to file the bug again here – so I repeat it here. Thanks for helping!

Starts here: I had made a new AMP site for a customer. It did not rank well after a while with Google. So I looked into it. In Google Search Console (GSC) there is a feature "fetch as Google" where you can see how Googlebot renders (!!!!!!!) a site compared to a browser. Googlebot there rendered the pages after the navigation bar completely white and wthout content. This obviously was punished by Google as cloaking. I went into it and found that the ampstart component "Navigation – Responsive Menubar" did not have a css height in units. This caused only the Googlebot (not the browsers) to cover the page content with the menubar's white background color – thus hiding the content and in letting assume Googlebot an attempted cloaking. See screenshots from GSC while I was working on the bug and after having fixed it.

42206094-74ae2800-7ea6-11e8-95ff-abba2a4ffce4

42206111-7c941c14-7ea6-11e8-8df7-a89c718da6a5

How do we reproduce the issue?

Run the fetch-as-Google-feature in Google Search Console on a standard responsive menubar from ampstart.

What browsers are affected?

No browsers – but only Googlebot when rendering (!!!!) a page.

Which AMP version is affected?

Powered by AMP ⚡ HTML – Version 1530567757224 https://www.physiomuenchen.de/

ericlindley-g commented 6 years ago

/cc @pbakaus

camelburrito commented 6 years ago

@reinhardmohr thanks for filing the bug , could you share what exactly was the fix ?

reinhardmohr commented 6 years ago

Hi, camelburrito, I added .ampstart-headerbar { height: 4rem; } to the styles in the head of the page of https://www.physiomuenchen.de There you can see the page or the code. This seems to have fixed it. As now the headerbar for Googlebot does not cover the complete page with its white background any more. And Googlebot now renders the page correctly.