Zap.Tools
By Updated

HTML Meta and Heading Extractor

Extract every meta, title, link, canonical, and hreflang tag from an HTML page, or analyze the H1-H6 heading outline with accessibility flags. Paste HTML or fetch any URL.

Interactive tool

HTML source

Meta surface

Live

Paste HTML or click Load sample to begin.

What is the HTML Meta and Heading Extractor?

A free HTML auditor with two complementary modes. Meta mode lists every <title>, <meta>, and <link> tag: Open Graph, Twitter Cards, robots, canonical, hreflang, categorised and audit-checked. Headings mode renders the H1-H6 outline with accessibility flags for missing H1, multiple H1s, and skipped levels. Paste HTML for instant local analysis or fetch any URL through our SSRF-safe backend.

How to Use the HTML Extractor

  1. 1Pick a mode: Meta tags or Heading outline
  2. 2Pick an input source: paste HTML or fetch from URL
  3. 3Read the live results: categorised meta tags and a hierarchical heading outline
  4. 4Review the audit findings (errors, warnings, info notes)
  5. 5Fix any flagged issues in your source HTML and re-run
What you get

Key features

Two-mode tagged-union processor

Single tool, two complementary lenses on the same HTML: meta-surface analysis and heading outline analysis

Categorised meta tag display

General, Open Graph, Twitter, robots, http-equiv, link, social: every tag bucketed for at-a-glance review

Hierarchical heading outline

H1-H6 rendered as a nested tree with depth indents, anchor IDs, and skipped-level flags

Accessibility audit findings

Missing H1, multiple H1s, skipped levels, empty headings: all the WCAG-relevant issues are surfaced

SEO audit findings

Title length, description length, viewport, canonical absoluteness, multiple canonicals, noindex robots: flagged automatically

Paste or fetch

Local-only paste mode for development, or fetch any URL through our SSRF-safe backend

Privacy-first fetching

URL fetches go through our hardened backend with size, timeout, and SSRF caps. URLs are not logged.

Why Audit a Page's Meta Surface and Heading Outline?

Meta tags drive search-result snippets, social-media link previews, and crawler behavior. Heading outlines drive screen-reader navigation and Google's topical understanding of the page. A page can render perfectly to the eye while shipping a broken canonical, a noindex robots tag, or a skipped heading level that locks out users with screen readers. This tool flags those silent failures in seconds.

Common use cases

  • Pre-deploy QA on a new page template (catch missing canonical or viewport)
  • Diagnosing why Twitter or LinkedIn renders a poor link preview
  • Verifying hreflang setup matches what the page actually emits
  • Auditing a competitor's page outline to understand their topical structure
  • WCAG conformance check on heading hierarchy before an accessibility audit
  • Confirming a CMS migration preserved every meta tag and link tag

Meta vs heading mode: when to use which

Meta mode answers: "What does this page say about itself to search engines and social platforms?" Headings mode answers: "Can a screen-reader user navigate this page logically?" Both matter; both are commonly broken; both are fixed with one-line edits once you know what to fix.

What the meta audit checks

  • Title presence and length (~60 char ideal)
  • Meta description presence and length (~155 char ideal)
  • Viewport tag (mobile-friendliness)
  • Robots directives (noindex warning)
  • Open Graph required fields (og:title, og:type, og:url, og:image)
  • Twitter Card presence
  • Canonical absoluteness and uniqueness
  • Legacy http-equiv refresh redirects

What the headings audit checks

  • Exactly one H1 per page
  • No skipped levels (H2 → H4)
  • No empty heading tags
  • Reasonable nesting depth

Open Graph vs Twitter Cards

Twitter (now X) reads Open Graph as a fallback if no twitter:* tags are present, which is why we emit only an info-level finding when twitter:* is missing. Facebook, LinkedIn, Discord, Slack, and most other previews read Open Graph exclusively. If you set Open Graph well, Twitter is a free win on top.

Pro tips

Tips & best practices

Make canonical absolute

Relative canonical URLs like "/page" are silently demoted by Google. Always emit the full https:// URL.

One H1 per page

HTML5 technically allows multiple H1s inside <section> or <article>, but every major screen reader still expects exactly one document-level H1. Use H2-H6 for nested sections.

Mind the description length budget

Google truncates around 155-160 chars on desktop and ~120 on mobile. Bing allows ~250. Aim for 150 chars to look good in both.

Verify hreflang reciprocity

Every locale variant must self-reference and point to all sibling locales. The Hreflang Generator in this category builds reciprocal sets correctly out of the box.

Don't skip heading levels for visual styling

If you need an H2 to look smaller than an H3, use CSS: not a smaller heading level. Screen readers cannot fix a broken outline.

Built for trust

Privacy & security

Paste mode runs entirely in your browser. Fetch mode sends only the URL to our backend, which applies SSRF guards plus response size, timeout, and rate-limit caps. The URL is not logged.

Related tools

Frequently Asked Questions

What is the difference between meta mode and headings mode?

Meta mode lists every <title>, <meta>, and <link> tag and audits them for SEO issues like missing canonical, oversize description, or noindex robots. Headings mode lists every H1-H6 and audits the outline for accessibility issues like missing H1, multiple H1s, or skipped levels. Both modes work on the same HTML, just different lenses.

Does it work with fragments or only full HTML pages?

Both. Paste a full <!DOCTYPE html> page or just a snippet: the regex-based parser tolerates either. Findings that depend on a fully-formed page (like missing viewport) will still surface even when only the <head> is present.

Why does the audit warn about multiple canonicals?

Search engines treat conflicting canonical signals as a sign of an error and may pick the wrong one or ignore both. Exactly one <link rel="canonical"> per page should be emitted, pointing to the absolute URL of the page itself.

What does "skipped level" mean in the heading outline?

A skipped level is a heading whose level number is more than one greater than the previous heading's level: for example, an H2 followed by an H4. Screen readers expect a contiguous outline; skipping levels makes the document harder to navigate. Adjust the heading levels (or use CSS for size) to fix.

Are private IPs blocked when fetching?

Yes. Our backend refuses any URL that resolves to a non-public address: loopback, private, link-local, or otherwise internal, and also enforces response size, timeout, and rate-limit caps.

Can it parse JavaScript-rendered content?

No. The fetch is a static HTML download: the same HTML Googlebot would receive without rendering JS. If your page populates meta or headings via client-side JS, those will not be visible. This matches what crawlers see and is usually exactly what you want to audit.