Deutsch
How search engines render

Raw HTML / source code

Also known as: source code, view source, initial HTML, page source

Raw HTML is the source code of a web page as the server delivers it in the HTTP response, before a browser or crawler has run any JavaScript. It is also called the page source or initial HTML. The related term “source code” has a broader meaning in programming, but in SEO it usually points to this document.

What is the difference between raw and rendered HTML?

A browser reads the raw HTML and builds the DOM from it. If the page then runs JavaScript, the content can change. The state after scripts have run is the rendered HTML. The Firefox documentation puts it this way. View Source shows the original HTML as sent by the server, while the Inspector shows the live DOM including all dynamic changes.

For SEO the difference matters because crawlers handle the two versions differently. Google fetches the raw HTML, renders the page later in a headless Chromium and works with the rendered result. Google also states that not all bots can run JavaScript. Titles, canonical tags, links and important text that sit in the raw HTML are readable by every crawler. Anything that only JavaScript adds depends on a successful rendering.

Raw HTML and rendered HTML comparedLeft: the raw HTML as the server sends it, with an empty title and an empty div with the ID app. Right: the same document after rendering, where JavaScript has added the title, an H1 and two links. Google only sees this content and these links in the rendered HTML.RAW HTMLserver responseRENDERED HTMLDOM after JavaScriptJavaScript<head><title></title>empty</head><body><div id="app"></div>empty<script src="app.js"></body><head>+<title>Running shoes</title></head><body><div id="app">+<h1>Running shoes</h1>+<a href="/women/">Women</a>+<a href="/men/">Men</a></div><script src="app.js"></body>Schematic example. Anything JavaScript adds only exists in the rendered HTML.
The raw HTML of a JavaScript page lacks the title, heading and links. Google indexes the rendered HTML and parses it for links again. Source: Google Search Central: Understand the JavaScript SEO basics.

How to view both versions

  • Raw HTML. Use “View page source” in the browser, the view-source: prefix in the address bar on desktop, or a request with curl.
  • Rendered HTML. Use the Elements panel in developer tools, or the URL Inspection tool in Search Console, where Google recommends checking that rendered HTML contains the expected content.

Example

Shell
curl -s https://example.com/product | grep -i "<h1"

If the command returns no <h1> line but the browser shows a heading, JavaScript creates that heading. It is then missing from the raw HTML and only present in the rendered version.

Common mistakes

  • Adding important elements only with JavaScript: Not every bot runs JavaScript. Content, links, titles and canonical annotations in the raw HTML are readable for every crawler.
  • Links without href: Google discovers links only when they are <a> elements with an href attribute.
  • Conflicting canonical annotation: If JavaScript sets a canonical URL, it must match the value in the raw HTML.

FAQ

How do I see the source code of a web page? Open the browser’s context menu and choose “View page source”, or use view-source: in front of the URL.

Why does view source not work on my phone? Mobile versions of Chrome do not offer the view-source: command, according to tools that exist to fill this gap.

More on the searchVIU blog

Sources

  1. View Source – Firefox Source Docsfirefox-source-docs.mozilla.org
  2. Introduction to the DOM – MDN Web Docsdeveloper.mozilla.org
  3. JavaScript SEO basics – Google Search Centraldevelopers.google.com
  4. Fix search-related JavaScript problems – Google Search Centraldevelopers.google.com

Last updated: