Many websites are today using modern-day JavaScript to load in crucial content. And Googlebot is struggling with it, with the implications that JavaScript has on crawling and indexing. Here is a guide that companies offering digital marketing services in Bangalore use, and that you can also use to work with JavaScript effectively with the minimum knowledge about the language. In order to be effective when it comes to JavaScript and SEO, there are three main questions that need to be answered.
- Does the page rely on client-side JavaScript to load or change on-page content or links?
- If yes, is Google able to see the content properly?
- If no, what is the ideal solution?
Does the page in question rely on client-side JavaScript to load or change on-page content or links?
First and foremost, you need to diagnose any issues with the JavaScript, regarding if the domain uses it to load in crucial content that could impact SEO, or not. This happens whenever there is a new client, or whenever there is a new feature launched, or redesign of an existing feature. So, how do we diagnose this?
- Simply ask the client – This is one of the easiest ways to check. Contacting the developers or POC, and asking them straightaway is a great option as they are the ones working on the website day-in and day-out. You just need to ask if client-side JavaScript is being used to load in important content, and you can further ask for a bulleted list of where and what content is being loaded.
- Check manually – Another option is to check manually by using the Chrome Web Developers plugin. First, you will need to disable JavaScript, and then manually check the important templates on the sire. Jot down the notes about content that isn’t being loaded at all, or is being loaded wrongly, or about any internal linking that isn’t working properly. This will help you know if the domain in question relies on JavaScript to load or change on=page content or links.
- Crawl – You can also crawl the site with a relevant tool with JavaScript rendering first turned on, and then off. Then, you can compare the differences with internal links and on-page elements.
If yes, is Google able to see the content properly?
If certain parts of the website is relying on JavaScript, it needs to be seen if Google is actually seeing the page as required. And, in order to understand this, we need to attempt to mimic how it crawls the page. So, how do we do that?
- Use Google’s new mobile-frienldy tool – With this tool, you simply need to input the URL, hit “Run test”, and then click on “Source code”. Taking the code and searching for any on-page content or links, will help you know if Google is most likely seeing the content.
- Search for visible content in Google – Simply select the visible text on the page and do a site:search for it in Google with quotations around the text. If there is nothing you get out of this site:search, it means that Google hasn’t indexed the content.
- Crawling – Using a tool like Screaming Frog, you can head to configuration > spider > rendering > selecting JavaScript from the dropdown > save. Here, you can input the domain or URL and see the rendered page or code once the crawl has been completed.
If no, what is the ideal solution?
If Google is not seeing the content the way it should be, there needs to be an ideal solution to the problem. Here is how it can be done.
- You want server-side rendering – If Google is landing on the page and trying to execute JavaScript as best as possible, but leaving without seeing any content, client-side JavaScript is being used. In this case, you will want to take the heavy lifting off of Googlebot, and put it on the site’s servers to ensure that when Googlebot comes to the page, it doesn’t have to do any heavy lifting, and can instead crawl the rendered HTML.
- Using isomorphic setups – Here, the website is asked to load the first request on the server, and then any future requests are made client-side. So, when Googlebot comes to the page, the client’s server has already executed the initial JavaScript required for the page, and then sends the rendered HTML down to the browser. Anything after that is done on the client-side.
