Published on September 30th, 2022
9 min read
Published on September 30th, 2022
9 min read
It’s becoming a norm for entire websites to be built using popular JS frameworks like React or Angular. These frameworks are used to power mobile and web apps since they can build both single-page and multiple-page web applications.
A more popular term for the Google-website interaction is crawling. Google doesn’t interact with your content as a user will. It has its unique way of going through your website. Here are a couple of things you need to know about the Google-website interaction:
This means that the only content Googlebot can see is the content available in rendered HTML. Here’s what Googlebot does:
After Googlebot scans each URL in its queue, the crawler executes a GET request using a mobile user-agent, which returns the HTML document. That’s how Google determines what resources are needed to render the page’s core content. This usually indicates that only the static HTML, not any connected CSS or JS files, gets crawled.
It would help to consider the primary content rules associated with meta tags, title tags, image alt attributes, etc.
It would help if you made sure that the titles and descriptions aren’t reused and that the image alt attributes are set (a point that’s often ignored)
You should never block access to resources or .js files. To allow the resources, you want to be indexed to be crawled first, add the following to your robots.txt file:
Don’t forget to link to internal pages using the HREF attribute:
<a href=”content-link”>Anchor text</a>
This will help Google to easily find the links and follow them. Don’t use the following for internal links on your website:
Note: Always use static links to help Googlebot discover your web pages.
So, there’s a possibility that the following may exist:
Choose one version you want to be indexed and set canonical tags.
To ensure that the images you have added within your content or on your website, link the image from the ‘src’ HTML tag:
<img src=”link-to-image.png” />
Lazy loading is handled by various modules, Lazy and Suspense being the most popular ones. When implementing these, you need to beware that you only lazy load images and not the content. If you have implemented lazy loading libraries, you might notice that it uses a ‘data-src’ attribute to store the real image URL and any additional image information, e.g.,
<img data-src=”link-to-image.png” class=”inline lazyloaded” src=”placeholder-imge.gif”></div>
This will help you enhance your page load speed. You can also exchange the placeholder image for the target image so that <img src> shows the path to the target image.
Ensure that the rendered HTML has all the information you want Google to read.
Use the Search Console URL inspection tool to check whether Google can render your web pages or not.
Enter the URL of a page you want to test. Click on the ‘TEST LIVE URL’ button on the top right of your screen.
You will soon see a ‘live test’ tab appear, and when you click ‘view tested page,’ you’ll see a screenshot of the page that shows how Google renders it. You can also view the rendered code within the HTML tab.
Once your web page is rendering correctly, the next step is to determine whether or not it’s being indexed. You can check it on Google as well as on Google Search Console.
If you’re checking it on Google, type site: domain-name.com/page-URL to see whether your web page is in the index.
If the page is indexed, you’ll see it in the result.
If the URL isn’t there, the page isn’t indexed.
You can also use the Search Console URL inspection tool to check the same.
Click the ‘view tested page’ button and view the indexed page’s HTML source code.
Technical Content Strategist and Inbound Analyst at FirstPrinciples, Heba is a motivated self-starter with a knack for analyzing and solving tough business problems. When not working, you can find her either reading a book, painting landscapes or sketching places she yearns to visit one day.
Actionable insights and learnings about building and scaling SaaS companies
As the top choice for SaaS SEO, we believe in delivering quality results with the best suitable SEO Packages. It is proven that the top 3 results in Google get 92% of the traffic so we have a team of passionate digital marketers who are experts in search engine optimization.
At FirstPrinciples, we empower our people to express ideas that drive success. Our open and collaborative work culture motivates our people towards building their dream career.I’m Happy to join!