HTML Tag Inspector
Paste HTML source code to get a complete breakdown of tags — heading hierarchy, image alt attributes, link counts, and structural analysis.
Reviewed by the ToolNestr Editorial Team — July 2026
How HTML tag inspection works
The inspector parses your HTML using the browser's built-in DOM parser. It counts every element, then categorizes them by type: headings (H1–H6), images, links, and structural elements. For each category, it extracts additional attributes: whether images have alt text, whether links are internal or external, and which heading levels are present.
Worked example
Given this HTML fragment:
<html>
<head><title>Test</title></head>
<body>
<h1>Welcome</h1>
<h2>About Us</h2>
<img src="photo.jpg" alt="Team photo">
<img src="logo.png">
<a href="/home">Home</a>
<a href="https://other.com" rel="nofollow">External</a>
<header><nav>...</nav></header>
</body>
</html> The inspector reports:
Headings: H1=1, H2=1 (2 total) Images: 2 total, 1 with alt, 1 without alt Links: 2 total, 1 internal, 1 external, 1 nofollow Structural: header=1, nav=1 Total tags: 11 elements
The inspector flags the image missing alt text and shows the heading hierarchy for quick review.
Common HTML issues found in audits
These are the most frequently identified issues when auditing HTML structure.
SEO Auditor
Uses tag inspection to audit client sites for heading structure, image accessibility, and link quality issues.
Web Developer
Verifies semantic HTML structure and ensures proper heading hierarchy before deploying to production.
Content Manager
Reviews published content to confirm headings are used correctly and all images have descriptive alt text.
Accessibility Checker
Validates that the HTML meets WCAG requirements for headings, image alt attributes, and landmark elements.
| Requirement | WCAG Guideline | Level |
|---|---|---|
| Non-text content has text alternative | 1.1.1 | A |
| Headings describe topic or purpose | 2.4.6 | AA |
| Heading hierarchy is logical | 1.3.1 | A |
| Link purpose from link text | 2.4.4 | A |
| Multiple ways to locate a page | 2.4.5 | AA |
How to use the HTML Tag Inspector
Paste HTML
Copy the HTML source code from your page or template and paste it into the text area.
Click Inspect
Click the Inspect tags button to analyze the HTML. Results appear instantly below.
Review results
Examine heading counts, image alt-text coverage, link types, and structural elements to identify issues.
Tips for HTML tag inspection
Always check headings first
Heading hierarchy is the backbone of your document outline. Ensure H1 through H6 follow a logical, non-skipping order.
Images without alt text are accessibility failures
Every <img> tag must have an alt attribute. Decorative images can use alt="" but the attribute must be present.
Use semantic structural elements
Replace generic <div> containers with <header>, <nav>, <main>, and <footer> for better SEO and accessibility.
Why HTML structure matters
Search engine crawlers rely on HTML structure to understand the content and context of a webpage. Proper use of heading tags signals the relative importance of sections. Images with descriptive alt text improve both accessibility and image search rankings. Clean, semantic HTML also helps page speed and maintainability.
Heading hierarchy best practices
Always start with a single H1 that describes the page topic. Use H2 for major sections, H3 for subsections, and so on. Never skip levels (e.g., jumping from H2 to H4). This creates a clear outline that helps both users and search engines navigate the content.
Image alt text for SEO and accessibility
Alt text provides a textual alternative to images for screen readers and search engines. Good alt text is descriptive yet concise. It should convey the purpose of the image without keyword stuffing. Missing or empty alt text harms accessibility and misses an opportunity for image search visibility.
Link types and SEO
Internal links connect pages within the same domain and distribute link equity. External links point to other domains. Nofollow links tell search engines not to pass authority. Understanding your link profile helps you manage crawl budget and improve overall site SEO.
Limitations and considerations
Client-side parsing limitations
The inspector relies on the browser's built-in DOMParser API, which follows standard HTML parsing rules. This means it will interpret malformed HTML using the browser's error recovery mechanisms rather than reporting syntax errors. For example, unclosed tags, incorrectly nested elements, and missing quotation marks on attributes may be silently corrected by the parser, producing a tag count that reflects the parsed DOM tree rather than the literal source markup. For strict validation according to W3C specifications, use a dedicated HTML validator alongside this tool.
Dynamic and JavaScript-rendered content
This tool analyzes static HTML source code only. It does not execute JavaScript, so content rendered by client-side frameworks such as React, Vue, or Angular after page load will not appear in the analysis. To inspect dynamically generated markup, use the browser's Developer Tools to capture the final rendered DOM (right-click and select Inspect Element) and paste that HTML source instead. Server-side rendered content and static HTML files are analyzed without any loss of fidelity.
Scope of analysis
The inspector counts and categorises tags but does not validate semantic correctness beyond basic attribute presence. For instance, it checks whether an alt attribute exists on an image but does not evaluate whether the alt text is meaningful or appropriate. Similarly, it detects nofollow links but does not verify whether internal linking structure follows SEO best practices. Use the tag counts as a diagnostic starting point and supplement with manual review for qualitative assessments of content quality and accessibility.
Frequently asked questions
What does the HTML Tag Inspector analyze?
It scans pasted HTML for headings (H1-H6), images, links, meta tags, and structural elements, giving you counts and quality checks like missing alt text.
Is my HTML code sent to a server?
No. All processing happens in your browser. Nothing is uploaded or stored.
Do I need to include a full HTML document?
No. You can paste any HTML fragment. The inspector will parse whatever valid HTML you provide.
How does it detect missing alt text?
It finds all <img> tags and checks whether the alt attribute is present and non-empty.
What link types does it detect?
It counts total links, internal links (same domain), external links (different domain), and nofollow links.
Does it check for duplicate headings?
Yes. It reports if there are multiple H1 tags and flags heading hierarchy issues.
Can I inspect dynamically generated HTML?
Yes. Paste the rendered HTML source and the inspector will analyze it as static markup.
Does it validate HTML syntax?
No. It parses tag occurrences but does not validate HTML syntax or report errors.
What are structural elements?
Elements like <header>, <nav>, <main>, <section>, <article>, <aside>, and <footer> that define page regions.
Why is heading hierarchy important?
Proper heading structure (H1 > H2 > H3) helps search engines understand content hierarchy and improves accessibility for screen readers.