Alejandro Rioja.
Scripts

Quick Guide On How To Access Website Source Code

Alejandro Rioja
Alejandro Rioja
8 min read
TL;DR

Open any page's raw HTML with Ctrl/Cmd+U or the view-source: prefix in your address bar. Use DevTools (F12) for live inspection of rendered DOM, CSS, and network requests. Five things worth checking for SEO: title tags, meta descriptions, H1 headings, image alt attributes, and analytics tracking snippets.

Free newsletter

Every Wednesday. 28,400+ operators. Zero fluff.

Table of contents

Open Table of contents

How to View Source Code

There are two distinct tools here. Know which one to reach for:

Most modern sites are partially or fully JavaScript-rendered, so DevTools is where I spend most of my time.

The view-source: shortcut (all browsers)

Type view-source: directly before any URL in the address bar — e.g., view-source:https://example.com — and press Enter. This works in Chrome, Firefox, Edge, and Opera. Safari requires enabling the Develop menu first (see below).

PC keyboard shortcuts

Chrome (Windows / Linux)

Firefox (Windows / Linux)

Microsoft Edge (Windows)

Opera (Windows / Linux)

Mac keyboard shortcuts

Chrome (macOS)

Firefox (macOS)

Safari (macOS)

Safari hides developer tools by default. Enable them once:

  1. Open Safari → Settings (or Preferences on older macOS) → Advanced tab.
  2. Check “Show features for web developers” (replaces the old “Show Develop menu” checkbox as of Safari 17).
  3. Now Develop → Show Page Source (Cmd+Option+U) and Develop → Show Web Inspector (Cmd+Option+I) are available. Right-click → Inspect Element also works.

Microsoft Edge (macOS)

Mobile

Important SEO Elements To Check

Once you can view source, use Ctrl+F / Cmd+F to search the raw HTML for the snippets below.

1. Title Tags

Search for <title. Each page should have exactly one, and the text inside it should be unique across your site. Title tags are the single most important on-page signal for telling both users and search engines what a page is about. Duplicate or missing title tags are among the most common SEO mistakes I find during audits.

2. Meta Descriptions

Search for <meta name="description". The content attribute is the snippet Google often shows in search results — keep it under roughly 160 characters. It is not a direct ranking factor, but it drives click-through rate, which matters. Check that no two pages share the same description.

3. H1 Headings

Search for <h1. Best practice is one H1 per page. It should describe the main topic clearly and include your primary keyword naturally. Stuffing multiple keywords into the H1 reads as spam to both users and algorithms.

4. Image Alt Tags

Search for <img. Each image should have an alt attribute that describes its content. Alt text is what screen readers announce to visually impaired users, and it is the only signal search engines have for understanding image content. Missing alt tags are easy wins — flag them and fill them in.

5. Analytics Tracking Code

Search for your GA4 measurement ID (format: G-XXXXXXXXXX) or Google Tag Manager container ID (GTM-XXXXXXX). If you are using the older Universal Analytics UA- format, note that Google shut down standard UA properties in July 2023 — those IDs are no longer collecting data. Verify you have migrated to GA4 or an alternative (Plausible, Fathom, PostHog, etc.).

Reasons to Read a Website’s Source Code

You do not need to be a developer to get value from this skill. Here are the main reasons I return to it:

1. Verify Meta Robots Tags

A single misplaced <meta name="robots" content="noindex"> will silently de-index a page. Search the source for robots to confirm you are not accidentally blocking pages from being crawled.

2. Audit Heading Structure

Good heading hierarchy (H1 → H2 → H3) helps both accessibility and SEO. A quick view-source scan shows whether headings are nested logically or whether someone has used H tags purely for styling.

3. Check Image Optimization

Beyond alt tags, look at the src attribute. Are images served from a CDN? Are they modern formats (WebP, AVIF)? Are width and height attributes set (prevents layout shift)? These details show up clearly in source.

4. Spot Hidden or Injected Content

Occasionally a plugin, third-party script, or bad actor injects content into a page that is invisible in the rendered view but visible to search engines. Common patterns: display:none divs stuffed with keyword spam, links hidden off-screen, or text matching the background color. A raw source scan will surface these.

Search for <a href= and scan the link targets. Broken relative paths, accidentally nofollow-ed internal links, or redirect chains inside the site hierarchy can silently drain PageRank. View Source is faster than waiting for a full Screaming Frog crawl when you just need a quick check.

Bottom line

Viewing source is a thirty-second habit that catches expensive SEO problems before they compound. Whether you use Ctrl+U for the raw HTML or DevTools for the live DOM depends on whether the page is server-rendered or JavaScript-rendered — for most 2026 sites you need both.

Check out these articles you might find useful for SEO:

Viewing Website Source Code — 2026 FAQ

Does view-source still work on JavaScript-rendered sites?

Partially. view-source: shows the HTML the server sent — which for React, Next.js, Astro (client-only), or similar frameworks is often a near-empty shell with script tags. The rendered content lives in the live DOM, which you access via DevTools → Elements panel. For server-side rendered (SSR) or statically generated sites, view-source: shows the full page content because the HTML is complete before it reaches the browser.

Can I view source on a page that requires login?

Yes, as long as your browser session is authenticated. view-source: and DevTools both operate on whatever the browser already has loaded. If you can see the page, you can inspect its source. You cannot view source of a page you have not loaded.

In virtually every jurisdiction, reading HTML that a web server voluntarily sends to your browser is legal — the server chose to transmit it. Automated scraping at scale, bypassing access controls (e.g., circumventing a paywall), or using the source code commercially without a license are separate questions with different legal answers. For routine SEO audits and competitive research, reading publicly served source is standard and uncontroversial.

What is the fastest way to check if a site uses a specific technology in 2026?

Three options: (1) check the source for tell-tale strings (e.g., __NEXT_DATA__ for Next.js, astro-island for Astro, wp-content for WordPress); (2) install the Wappalyzer browser extension, which identifies frameworks, CDNs, analytics tools, and as of 2025 some AI stack components (LangChain, LlamaIndex); (3) run the URL through BuiltWith for a detailed tech stack report.

Related reading:

This guide is part of alejandrorioja.com — written by Alejandro Rioja, who now builds AI agent systems for founders. Including the agent that keeps this site current. How it works →

Updated for May 2026

A couple of 2026 updates to the specific advice in this post:

Keep reading

Get the AI playbook in your inbox

Every Wednesday. 28,400+ operators. Zero fluff.

⌕
↵ ↵ to see all results esc esc to close