There’s a lot of noise in SEO about JavaScript. Some people will tell you it’s not an issue anymore, while others will tell you it’s killing your rankings.
The reality is that managing your JavaScript dependencies sits somewhere in the middle.
Modern websites can rely heavily on JavaScript because it powers everything from filters and calculators to full front-end frameworks. From a user point of view, that’s great, but from an SEO point of view, it’s where things can get messy. To understand why, you need to strip it back and look at the basics. What is HTML doing, what is JavaScript doing, and how do search engines and AIs actually deal with both?
HTML: The Bit Search Engines Actually Read First
HTML is the foundation of every page on your site. It’s not flashy; it doesn’t do anything clever, but it does the most important job: it’s the bones of your website, whilst telling search engines what’s on the page. That includes your headings, your content, your links, your images, and all the signals that help Google figure out what the page is about. When a search engine lands on your site, it doesn’t see the finished version straight away. It sees the HTML first.
So if something is important for SEO, this is where it needs to live.
Why HTML Exists in the First Place
HTML is the standard way the web is built; every browser understands it, every search engine understands it. It’s simple, consistent, and most importantly, it doesn’t need anything else to work. That’s what makes it reliable.
Why HTML Still Matters for SEO
If your content is in HTML, there’s very little that can go wrong.
Search engines can:
Access it immediately
Understand it quickly
Index it without delay
It also gives you:
Clear structure through headings
Clean internal linking
Strong relevance signals
There’s no second step, no waiting around for anything to load properly. It just works.
And that’s exactly what you want when you’re relying on something to rank.
JavaScript in SEO: Useful, but Not Without Risk
JavaScript is what makes modern websites feel modern. It handles interactions, updates content dynamically, and allows you to build things that would be painful or impossible with HTML alone.
It entirely depends on how the site was built, but you’ll see it potentially used for:
Filters on category pages
Interactive tools
Dynamic content loading
Menus that update without refreshing
- And any other shiny on-page features like ‘read more’ functions
None of that is a problem in itself, but the issue is how that content gets seen by search engines, or more importantly, how reliably search engines and AIs can see it.
Why JavaScript Is Everywhere
From a development and UX point of view, JavaScript makes a lot of sense. It helps websites feel faster, more responsive, and more interactive by allowing parts of a page to update instantly instead of forcing a full reload every time a user clicks something. It also gives developers much more flexibility in how content and functionality are delivered, which is why features like product filters, calculators, tabbed content, and dynamic menus are so often powered by JavaScript. On e-commerce sites, especially, this can make a big difference to usability, helping users find what they need quickly and move through the site with less friction. For businesses, that usually leads to better engagement and higher conversion rates. It also aligns with how many modern websites are built, with JavaScript frameworks making it easier to manage large, complex platforms. So, from a usability and development perspective, it is easy to see why JavaScript is everywhere.
If your goal is purely user experience, it’s a no-brainer.
Where It Becomes an SEO Problem
Search engines and AI crawlers don’t treat JavaScript the same way they treat HTML because they don’t see everything straight away.
For search engines like Google, this happens in two stages:
- First wave (HTML crawl)
The crawler fetches the raw HTML and indexes anything it can see immediately. This includes your core content, links, and structure if they’re present in the HTML. - Second wave (JavaScript rendering)
Google comes back later to render the page and execute JavaScript. This is where additional content, links, or functionality may be discovered.
That second step is where problems start to appear.
Rendering JavaScript takes more time and resources, so it isn’t always immediate or guaranteed. If something breaks or is deprioritised, content can be delayed, missed entirely, or not interpreted correctly. This often affects key SEO elements like on-page content, internal links, and navigation.
When it comes to AI crawlers, the gap is often even bigger.
AI systems sometimes may not fully render JavaScript at all, or they do so in a very limited way. This is because rendering is far more expensive and resource-intensive than reading raw HTML, so instead, they may rely on the raw HTML to understand and extract information. If your important content only exists after JavaScript runs, there’s a chance it won’t be seen or used.
On smaller sites, you might not notice much impact. But as sites grow in size and complexity, these issues can scale quickly and start to affect visibility across both search engines and AI-driven platforms.
A Quick Note on CSS
CSS controls how everything looks: layout, colours, spacing, and responsiveness.
It doesn’t play the same role in SEO as HTML or JavaScript, but it still matters.
If your CSS is poor, your site becomes harder to use. If your layout shifts or loads badly, it affects performance metrics.
So while it’s not directly driving rankings, it’s still part of the bigger picture.
So what Should Always Be in HTML
At a minimum, the following should always be available in HTML:
On-page content, including main copy and headings
Images and image attributes such as alt text
Primary navigation and key pathways
Internal links using standard anchor tags
Redirects handled at server level
Why Your Key Content Should Be in HTML
Not everything on a page is equally important.
Certain elements do most of the heavy lifting for SEO:
Your main content
Your headings
Your internal links
Your key product or service information
If JavaScript controls this, you’re gambling on both the JavaScript crawler returning to the page after the initial crawler leaves, as well as hoping the crawler then has no issues with the rendering process from start to finish. This adds risk for no real benefit, so instead of gambling, play it safe and ensure that anything critical is held within the HTML. It means search engines can access them straight away, understand them properly, and use them as intended.
It’s a simple decision, but it has a big impact.
Navigation and Internal Linking
This is where things often go wrong. A lot of sites now try to be fancy with smart main navigation bars featuring animations or dynamically filtered pages that try to blow your mind, whilst you just try to reach the bottom of the page. Whilst these might be great to show in team catchups and quarterly meetings, they rely heavily on JavaScript to handle the menus, filters and internal links. If those links aren’t in the HTML, search engines may not follow them properly.
That affects:
How your pages are discovered
How authority flows through your site
How your site structure is understood
Internal linking is one of the few things you have full control over in SEO. It’s not something you want to weaken by accident.
Common Issues We See
When JavaScript is overused, the same problems tend to come up:
Content only appears after interaction
Links that search engines cannot follow
Pages are not being indexed properly
Lazy loading breaking visibility if used incorrectly
Differences between what users see and what search engines see
- Gradual bloat from overuse
These issues are not always obvious, and at a small scale may seem irrelevant or low priority, but as time goes on and sites begin to scale, they can grow rapidly and go from a three-page issue to a three-hundred-page issue. That two-hour dev task has suddenly become a three-month-long project, so catch it as early as you can.
You can use both, just use them properly
This isn’t about avoiding JavaScript or being anti-JavaScript. JavaScript is great, and it lets you take your site to the next level, but it’s about using it in the right place. HTML should handle your structure and important content, while JavaScript should enhance the experience, not impair it.
That way, you get the best of both without creating unnecessary problems.
How does this Impact AI Visibility
The shift towards AI-generated results changes how content is evaluated. It is no longer just about ranking in a list of links; it is about whether your content can be understood, trusted, and reused. If your key content is not immediately accessible, it becomes less likely to be selected.
This can affect:
Whether your content is included in AI overviews
How accurately your content is interpreted
Whether key details are picked up or ignored
AI systems tend to favour content that is:
Clearly structured
Easy to extract
Immediately available
HTML naturally supports this; however, JavaScript can still work, but only if it does not block or delay access to important content. If that content is hidden behind JavaScript, you are relying on additional processing steps that do not always work perfectly.
So what’s the key takeaway?
Search engines and AI systems can render JavaScript, that’s no secret, but this requires additional resources and is not as consistent or reliable as HTML crawling.
The key takeaway here is not to leave it up to chance. Make sure that all critical content and navigation are within the HTML and not reliant on JavaScript, as it not only provides benefits to your SEO and AI performance, but also improves your core web vitals which Google uses to form an understanding of how positive or negative the user experience is on your site.