CSS broken in Google cache of page

[NVentouris]

Hi all,

I work in a e-commerce retail site and I recently noticed that when I type cache:url the product page is css broken.

Any idea why this happens and if this can affect our rankings ?

Thanks in advance

[keyplyr]

Are you blocking Googlebot from accessing the CSS file? Check your robots.txt and make sure you're not disallowing the CSS directory.

[Robert Charlton]

It could also be a CSS positioning problem. There are several ways this could go bad in the cache window, where Google adds some informational content up at the top. Absolute position maintains a constant relationship between pages elements in such a way that the addition of this material can disrupt the flow of the page.

Generally, the cache display problem happens when the entire page is absolutely positioned... but I don't believe the problem is limited just to those cases. I'll leave it to CSS experts to diagnose the possibilities and cures, depending on what kinds of shifts and overlaps occur. You might need to post example code in the CSS forum, or it might be a simple fix that can be diagnosed easily here.

This shouldn't affect your Google rankings. The cache is a completely separate Google display issue, handled after rankings are determined.

[Andy Langton]

Are you blocking Googlebot from accessing the CSS file? Check your robots.txt and make sure you're not disallowing the CSS directory.

This doesn't make any difference to the cache - it merely reproduces the HTML with a base href to the page involved. The user's browser requests the CSS, not Googlebot.

[keyplyr]

The user's browser requests the CSS, not Googlebot.

I disagree. Googlebot needs to access all the files that make up the page presentation to accurately display what the page looks like. Since you say the CSS is broken in Google's cache of that page, that's the first place I'd look.

Googlebot *does* request CSS, JavaScript, PHP, image files and anything else linked from a web page. Not for indexing, but for many other Googlebot activities (cache, screenshots, cloaking discovery, etc.)

This shouldn't affect your Google rankings. The cache is a completely separate Google display issue, handled after rankings are determined.

Agreed

[Andy Langton]

Not OP, incidentally ;)

I disagree. Googlebot needs to access all the files that make up the page presentation to accurately display what the page looks like. Since you say the CSS is broken in Google's cache of that page, that's the first place I'd look.

There's a difference between a render of a page that Google might use for evaluation, and the cached link you can click in search results. The cache is a plain HTML page with a base href. There's no Googlebot involved in requesting external CSS, JS, or anything else - only the HTML which will be as it was when Google retrieved it. External files are requested by the user's browser when they click the cached link.

[keyplyr]

Well then I stand corrected, thanks good to know.

I do know that when I disallowed access to CSS via robots.txt, Google could not accurately render my page in GSC. This was also true in the snapshots once used in SERP. I assumed it was the same in the cached copy.

To be honest, I've never allowed Google to cache any of my pages (nor display my web pages in translator, transcoder, weblight, et al.) I've always had an issue with Google serving my property to users without my permission. Let the user come to my page to see it.

[NVentouris]

Well Thank you all for your replies !

We don't block any css or js for sure.

Since this cant affect our rankings, I am good.

Thanks again !