We are migrating to a Javascript framework. Do we need to consider SEO?
JavaScript use in website builds is incredibly popular these days, with the ease of functionality and ability to build out various interactive elements at scale a popular choice for developers, company owners and product teams.
Site migrations of all kinds always need to consider investment SEO to ensure that organic visibility and revenue is protected as best possible. This is heightened if you are moving to a JavaScript framework. JavaScript can often present challenges to search engines in crawling and rendering content properly if it is detected on a page by crawlers as key parts of the source code (including links and content) may be hidden to them. Done incorrectly, this will lead to massive drops in organic visibility and revenue.
You will need to consider SEO investment to make sure that the content you are migrating to JavaScript is accessible to search engine crawlers. If you are migrating to JavaScript make sure you involve your SEO team early, as this will help protect key metrics such as indexation, ranking and subsequent commercial value tied to those pages during the move.
Google says Javascript isn’t an issue, is that true?
Yes and no. Google has historically had issues crawling JavaScript, which has presented headaches in the past for SEO teams and product managers looking to improve user interactivity of their sites using JS.
These days, Google has got a lot better in processing and understanding JavaScript frameworks as they continue to grow in popularity. Google has plenty of documentation on JavaScript SEO and best practices which developers, product managers and in-house SEO teams can read up on, which shows it is taking the topic seriously.
As a business, you will need to ensure that Google can see what the user sees when it comes to JavaScript, and picks up all the important code resources accordingly. There are plenty of ways to test this, including the use of Google’s native tools such as Google Search Console and how it is reading JavaScript pages and their resources in its rendered code.
What are the best CMS for JavaScript frameworks?
There are plenty of modern-day CMS’s worth considering that handle JavaScript frameworks well and will help your business’s website scale in an SEO-friendly way if you’re going down the JS path.
Taking a popular JavaScript framework, Node.js as an example, some of these CMS options include Strapi, Ghost, Sanity, Apostrophe, Tina, KeystoneJS and Total.js.
Will my business lose visibility if we migrate to a JS framework?
Regardless of whether your migration is one to JS or not, you can often expect an initial drop in visibility as Google recrawls and reinterprets all the changes made to your site. If the migration is managed and maintained well from an SEO standpoint, then visibility recovery to previous levels (and even beyond) can sometimes be pretty quick.
If you’re moving over to JavaScript from a standard web build, then it may take Google a bit longer to recrawl and reinterpret the new structure of your website and all its associated content and link resources. As such, initial visibility drops may take a little longer to recover, even if you have ensured all your key resources are visible to Googlebot.
How does JS impact the SEO of my business?
In short, JavaScript adds an additional layer of complication for search engines when they read your website. This can result in mixed messages sent to search engines in terms of what content they can see and subsequently index and rank.
For example, some JavaScript elements may hide certain content elements from search engines, only being activated if a user clicks on them. This can cause problems in ensuring that all your content is read by search engines.
There are plenty of techniques such as server-side rendering and dynamic rendering for your developers to explore which can help alleviate this, allowing you to serve a pre-rendered HTML version of your site to search engines without the need to process JavaScript. From a visibility and revenue perspective, if you’re using JS one of these solutions is worth investing in.
Does Javascript impact indexing and crawling of a website?
Google crawls JavaScript in a slightly different manner to other website resources which does impact indexation. Firstly, Googlebot will crawl HTML resources and not JavaScript, which it will return and process in a second phase of crawling if it is detected on websites.
This causes a delay in crawling and eventual indexation of websites as it requires more resources from Google’s side to process.
What are some common issues that can arise when using JavaScript on a website, and how can my team address them?
Common JavaScript challenges include ensuring there is no difference in terms of what the user sees to what Google sees when it processes JavaScript.
This can extend to basic SEO elements that your SEO team will need to optimise to improve your organic rankings (such as page titles, content headers and body copy) not being read and subsequently not being indexed if search engines cannot access them due to the use of JavaScript.
In terms of addressing these issues, dev team implementation of pre-rendering techniques can really help, offering crawlers HTML versions of your JS-built pages.
Additional JS issues include mobile friendliness, with some resources not performing or responding well when used on mobile devices. Google again offers various resources and tools to help troubleshoot this, such as the Mobile-Friendly Test and the URL Inspection Tool.
What’s the difference between CSR and SSR, do I need to worry?
CSR and SSR stand for client-side rendering and server-side rendering. As the latter’s name suggests, this relates to your website’s HTML being rendered on the server, while CSR renders HTML using JavaScript in the browser instead.
In SEO, SSR has the advantage over CSR as it displays a fully-loaded HTML page to search engines on first load without the need for browsers to process JavaScript. This can rapidly improve your page load speed as well as make it easier for crawlers to access resources on said pre-rendered version quicker.
If you’re a business owner your team uses a lot of JavaScript on your website, investment in SSR as an SEO solution is definitely worth consideration.
Will lazy loading impact SEO as well as conversions?
Lazy loading, that being the deferring of loading resources such as images until the user scrolls to where they lie on the page, can be a way to improve initial page load speed which links directly to not only SEO performance but also user satisfaction and on-site conversions.
If your website is resource heavy (JS or otherwise), developer implementation of lazy loading can speed up page load speed. Page load speed is also an important ranking factor for SEO and can help your performance.
Load times also have a direct impact on user interaction and can help drastically improve conversions on key money pages, improving your revenue opportunities on such pages.
Will Javascript slow my website down?
JavaScript resources, with their focus on interactive elements, can be quite heavy and can contribute to slow loading of websites. Many news and publisher site companies deal with websites that deploy heavy JS elements that impact page load speed and as a result, potential user and conversion drop off.
Solutions worth investing in for product and developer teams implementing server-side rendering so your website is loaded as a static HTML page, bypassing the need for JavaScript to load each time. It’s also vital to ensure that developers are making resource savings on JavaScript elements by minimising or compressing JS code where possible, and ensuring that there aren’t superfluous or unnecessary JavaScript resources within a website’s structure that may have been left over from previous JS ventures.
How does Javascript impact UX?
As a business or website owner, one pull for JavaScript is that it can play a vital role in enhancing various UX and interactive elements that can improve user interaction and key conversion opportunities. JavaScript can be utilised to deploy user-friendly elements across websites in many scenarios, encouraging visitors to stay on your site for longer.
For many ecommerce sites for example, JavaScript is at the core of many shopping experiences where users have the option to apply various filters and taxonomy selections, allowing them to explore their personalised desired range of products with ease. This user-friendly method of site interaction can be a vital component of boosting sales and encouraging repeat purchases.
What is dynamic rendering and do I need to be concerned?
Dynamic rendering is a method that can also serve as a workaround where the need to execute JavaScript to enable your content to be visible to search engine crawlers is averted.
Dynamic rendering blends the use of client-side rendered content and pre-rendered (server side) content, with the former shown to users and the latter shown to search engine crawlers. If you’re using JavaScript, users see the full version of the site, with JS functions all in place, while search engine crawlers see a pre-rendered version that is easily crawlable and indexable, much like what can be achieved in server-side rendering.
Dynamic rendering is recommended for JS-based sites that change rapidly, such as single-page applications, however isn’t recommended by Google as a long-term investment for navigating JavaScript-related issues from an SEO perspective.
How do I know if my website is being impacted by Javascript issues?
It may not be immediately obvious if the use of JavaScript on your website is causing issues with your organic performance.
Google provides many free tools to help your SEO teams troubleshoot potential JavaScript related issues or opportunity improvements on your site. For basic JS (and other SEO) diagnosis, tools like Lighthouse can be a good starting point.
Google Search Console’s URL Inspection Tool can also help you see if there are any wider indexation issues and how Google is seeing on your JavaScript pages from a crawling perspective.
Performance tools such as the Core Web Vitals report can also give you further insights as to which areas of your site are suffering from performance and site speed issues, and will often call out individual elements such as JavaScript files to help you identify issues.
Javascript SEO Case Study
JavaScript-related indexation issues on large ecommerce sites.
Problem: An enterprise ecommerce business which is heavy on JavaScript execution to deliver its content struggled with effective crawling of its resources by search engine bots, and as a result had poor organic search visibility and sales from SEO.
Solution: The business implemented the use of server-side rendering for key category and product pages to serve pre-rendered HTML versions of the content to search engine bots. This made it easier for bots to crawl and index the content properly. As a result, key money pages across the site saw heightened organic visibility and higher conversion rates and revenue from the organic channel.