HTML, CSS & the Browser

View Source

Definition

Ctrl+U, or right-click and View Page Source, opens the exact bytes the browser received for the document — the same thing a crawler downloads on its first pass. It is the file as served, not the page you are looking at. Anything a script added afterwards is absent from it, and anything a script removed is still sitting there. You can ask for it directly with the view-source: prefix in the address bar, or with curl from a terminal, and get the same text either way. The Elements panel in developer tools shows something quite different: the DOM as it stands now, with every change a script made folded in.

Why It Matters

The gap between those two views is the whole of JavaScript SEO in one comparison. A React page built from a single div with the id root has a source of maybe thirty lines and a rendered tree of two thousand, and it is the thirty lines that a crawler, a link preview bot and a text-only reader meet first. Search engines do render JavaScript now, but on a later pass and not reliably, and most social scrapers never render at all. If your title, your meta description and your Open Graph tags are written in by a script, they are not in the source, which is why a link that looks fine in the browser pastes into a chat as a bare domain.

How It Works

The browser fetches the HTML document and view source prints that response body verbatim, comments, whitespace and all. In most browsers it does not re-request the page, it shows the copy already in the cache, which is why it sometimes lags a file you have just uploaded. Anything held in a separate file appears only as a tag: a script src, a link to a stylesheet, an img. Server-rendered and prerendered pages carry their words inside that response, which is what makes a plain static HTML file the easiest thing on the web to crawl. A client-rendered page carries an empty container and a script, and everything visible arrives seconds later.

Real-World Example

A portfolio built by an AI tool is uploaded to 99helpers and lives at studio-work.99helpers.site. Pasted into a chat, the link preview shows the bare domain and no image. View source explains it at a glance: the head holds a generic title and no og:image, because the script writes both after load. Moving those few tags into the HTML file itself corrects the preview without changing a single pixel of the page.

Common Mistakes

  • Checking the Elements panel to see what a crawler gets — it shows the rendered tree, and will happily display content that is nowhere in the served file
  • Putting meta tags in JavaScript — most preview scrapers read only the HTML as served and never see them
  • Assuming view source is current after an upload — it can show a cached copy, so hard-reload before concluding the file did not change

Related Terms

Put a file online in seconds

Drop in a document, an image, a page or a whole static website and share the link — free, with no build step and no server to set up.

Host a file free →