How to check a page's title, meta tags and canonical in your browser

You don't need an SEO tool to see a page's on-page tags. Every browser can show them. Below are three methods, from quickest to most thorough, and the traps that make people read the results wrong.

Method 1: View source

1. Open the page.

2. Press Ctrl+U (Windows/Linux) or Cmd+Option+U (Mac). You can also type view-source: before the URL.

3. Press Ctrl+F and search for each of these:

- <title

- name="description"

- rel="canonical"

- name="viewport"

- og:

- <h1

This shows the raw HTML the server sent, before any JavaScript runs. That's useful, because it shows what a crawler gets on its first request.

Pitfall: on sites built with JavaScript frameworks, view source can be almost empty, with tags added later by scripts. If you can't find a tag here, check Method 2 before you report it as missing.

Method 2: DevTools Elements panel

1. Press F12, or right-click the page and choose Inspect.

2. In the Elements tab, expand <head>.

3. Press Ctrl+F inside the panel to search the DOM.

This shows the page after JavaScript has run. Compare it with view source:

In both: fine.
Only in Elements: JavaScript adds it. Note it. Search engines that render JavaScript may still see it, but it's less reliable.
Different values in each: a real problem. For example, the server sends one canonical and a script replaces it with another. That sends mixed signals.

Method 3: A console snippet that pulls everything at once

Open DevTools, go to the Console tab, paste this and press Enter:

`js

(() => {

const q = s => document.querySelector(s);

const all = s => [...document.querySelectorAll(s)];

const report = {

title: document.title,

titleLength: document.title.length,

titleTagCount: all('title').length,

description: q('meta[name="description"]')?.getAttribute('content') ?? 'MISSING',

descriptionCount: all('meta[name="description"]').length,

canonicalRaw: q('link[rel="canonical"]')?.getAttribute('href') ?? 'MISSING',

canonicalCount: all('link[rel="canonical"]').length,

viewport: q('meta[name="viewport"]')?.getAttribute('content') ?? 'MISSING',

h1s: all('h1').map(h => h.textContent.trim()),

imagesMissingAlt: all('img:not([alt])').map(i => i.getAttribute('src')),

vagueLinks: all('a').filter(a => /^(click here|read more|here|more)$/i.test(a.textContent.trim())).length,

ogTitle: q('meta[property="og:title"]')?.getAttribute('content') ?? 'MISSING',

ogDescription: q('meta[property="og:description"]')?.getAttribute('content') ?? 'MISSING',

ogImage: q('meta[property="og:image"]')?.getAttribute('content') ?? 'MISSING',

};

console.table(report);

return report;

})();

You get a table of every key tag. Some notes on reading it:

getAttribute('href') vs .href. The snippet reads the raw attribute on purpose. Using .href would quietly turn a relative canonical like /page into a full URL, which hides the problem. If canonicalRaw doesn't start with https://, flag it.
Counts above 1 for title, description or canonical usually mean a theme and a plugin are both outputting the tag.
imagesMissingAlt lists images with no alt attribute at all. Images with alt="" are left out, because an empty alt is correct for decorative images.
Empty h1s means there's no H1. Several H1s isn't automatically wrong, but check that they make sense.
This snippet reads the live DOM, so it reflects JavaScript changes, like Method 2.

What "good" looks like

A healthy <head> for a typical page looks something like this:

`html

<title>Emergency Plumber in Leeds | Acme Plumbing</title>

Each tag appears once, the canonical is absolute and points at the page itself, and the title and description are written for this page, not the whole site.

Common problems you'll find

Same title on every page. The template uses the site name only.
Canonical pointing at the homepage from every page, often from a misconfigured theme or plugin setting.
Staging URLs in the canonical or og:url, such as https://staging.example.com/....
Missing viewport tag on older hand-coded sites.
og:image pointing to a file that 404s, so shared links show no preview. Open the URL in a new tab to check.

Turning it into something you can act on

The browser tells you what's there. It doesn't tell you what to fix first. A simple order is: title and canonical problems first, then headings and viewport, then descriptions and alt text, then Open Graph tags. Write each item as an instruction, for example "Change the canonical on /services/ to point to itself," not just "canonical wrong."

If you'd rather not run the snippet and sort the results yourself, we make Auditfold: paste the page's HTML and it checks these same tags, then returns a score and a plain-words fix list ranked by importance. It's one option among several. The methods above cost nothing and work in any browser.