Fetch and Render
The Fetch & Render tool within Google Search Console enables you to test how Google crawls a page on a website, along with how they visually render it on mobile and desktop devices. This enables you to pinpoint and fix any errors which may be occurring. While it is a useful tool, there are some guidelines that should be adhered to.
Google’s guidelines for using the tool are covered within our SEO Office Hours Notes below, along with further advice on the Fetch & Render tool from Google.
Remove CSS Stretching Images to Max Viewport to See How Full Page Renders
If the CSS sets images to the max viewport this will stretch them and stop you being able to see how the rest of the page is rendering in Fetch as Google. However, this view doesn’t represent what Googlebot is actually rendering.
Use Mobile Friendly Test to Check if Googlebot Can Access Page
Use the mobile-friendly test as an easy check to see if Googlebot can access a page. This will fetch the page with a Googlebot user agent and show you a screenshot of what was found.
Hard to Know if Page is Rendered Correctly if CSS Adapts Image Size to Viewport Height
Fetch & Render renders page with a high viewport (~9k pixels), so if a site is using CSS which adapts image size to viewport height then it can make it harder to diagnose if the rest of the page is being rendered correctly.
Increase in GSC 403 Errors Could be Due to CMS Bot or Denial of Service Protection
An influx of 403 Forbidden errors in Search Console could be due bot protection or denial of service protection built in by a site’s host or CMS. This might be triggered if Google fetches a lot of pages in a short space of time. John recommends checking server logs to get a better understanding of what is happening. Fetch & Render can be used to check if Googlebot is blocked from specific URLs.
Fetch & Render Won’t Necessarily Render Whole Page
Fetch and Render tool has cut off and won’t necessarily render the whole page. There is also a cut off for indexing, but this is fairly large (~100mb).
Google Doesn’t Always Crawl Lazy-loaded Images
Google will not always crawl images which are implemented using lazy loading.
Content that Fades in Onload With ~2s Transition is Not Considered Hidden
Content is considered hidden when it is not visible at all. Content which fades in within a couple of seconds during a transition or is slightly transparent is likely to be indexed. You can test a transition using Fetch and Render.
Google Tracks Link Starting Point and Final Destination
Links to URLs which redirect are fine as Google tracks the starting point of the link, and the final destination. Redirecting links can make sense if you want to change the destination without updating the link.
Fetch and Render Will Show Rendered HTML
To help diagnose issues with JavaScript based sites, Google is working on changing Fetch and Render to show the final HTML instead of just showing an image, but John couldn’t give a timeframe for this to be released.
Use Fetch & Render using Smartphone User Agent, Mobile Friendly Testing Tool, and AMP Testing Tool to test for Mobile-first Indexing
The Fetch and Render tool set to use a smartphone user agent, the Mobile Friendly Testing Tool, and the AMP Testing Tool can be used to show you the content Google will use for the mobile-first index.