HTML SEO Inspector
Inspect HTML for title, meta description, canonical, headings, OpenGraph, Twitter Cards, JSON-LD, and images without alt
Enter your HTML content to inspect for SEO elements, meta tags, headings, and structured data
What is the HTML SEO Inspector?
The HTML SEO Inspector is a client-side tool that analyzes your HTML pages for essential on-page SEO elements. It checks for title tags, meta descriptions, canonical URLs, robots meta directives, heading hierarchy, OpenGraph tags, Twitter Card tags, JSON-LD structured data, and images missing alt attributes — providing a comprehensive score with actionable recommendations to improve your search engine visibility.
How to Use
- Paste your HTML page source into the input field
- Click "Inspect" or wait for automatic processing
- Review the score and SEO checklist results
- Check individual findings: missing tags, length issues, hierarchy problems
- Export a full report in JSON or Markdown format for your team
Example: HTML with SEO Issues
This HTML page has several SEO problems the inspector will detect:
<!DOCTYPE html>
<html>
<head>
<title>Hi</title>
<meta name="robots" content="noindex">
</head>
<body>
<h2>Skipped heading level</h2>
<img src="photo.jpg">
<img src="banner.png">
</body>
</html>What SEO Elements Are Checked?
- Title tag — Presence, length (50-60 chars recommended), uniqueness
- Meta description — Presence, length (120-160 chars recommended)
- Canonical URL — Presence and valid format for duplicate content prevention
- Robots meta — Detection of noindex/nofollow directives that block indexing
- Heading hierarchy — Single H1, logical heading order without skipped levels
- OpenGraph tags — og:title, og:description, og:image for social sharing
- Twitter Card tags — Card type, title, description, image for Twitter/X
- JSON-LD structured data — Valid schemas for rich search results
- Images — Missing alt attributes for accessibility and image SEO
On-Page SEO Best Practices
- Use a unique, descriptive title tag (50-60 characters) on every page
- Write compelling meta descriptions (120-160 chars) with relevant keywords
- Set a canonical URL on every page to prevent duplicate content issues
- Use exactly one H1 per page and maintain logical heading hierarchy
- Add OpenGraph and Twitter Card tags for rich social media previews
- Include JSON-LD structured data for enhanced search result snippets
- Add descriptive alt text to all non-decorative images
- Only use noindex/nofollow when you intentionally want to block indexing
Privacy and Security
All inspection happens entirely in your browser using the native DOMParser API. Your HTML content — which may contain proprietary markup, internal URLs, or unreleased page designs — is never transmitted to any server. No data is stored, logged, or shared. Any rendered preview is sanitized to prevent XSS.
Frequently Asked Questions
What SEO elements does the HTML SEO Inspector detect?
The inspector analyzes title tags, meta descriptions, canonical URLs, robots meta directives, heading hierarchy (H1-H6), OpenGraph tags for social sharing, Twitter Card tags, JSON-LD structured data, and images missing alt attributes. Each element is evaluated against SEO best practices.
Why is the title tag so important for SEO?
The title tag is the most critical on-page SEO element. It appears in search engine results as the clickable headline, in browser tabs, and when sharing on social media. Search engines use it to understand page topic. Keep it between 50-60 characters and make it unique and descriptive.
What is a canonical URL and why does it matter?
A canonical URL (link rel='canonical') tells search engines which version of a page is the 'official' one when the same content is accessible at multiple URLs. Without it, search engines may split ranking signals between duplicate URLs, weakening your page's authority.
Why should images have alt attributes?
Alt attributes serve two purposes: they provide accessible descriptions for users with screen readers, and they help search engines understand image content for image search rankings. Missing alt attributes hurt both accessibility scores and SEO. Use descriptive text for informational images and empty alt (alt='') for purely decorative images.
What are OpenGraph and Twitter Card tags?
OpenGraph (og:) tags control how your page appears when shared on Facebook, LinkedIn, and other social platforms. Twitter Card (twitter:) tags do the same for Twitter/X. Without these tags, social platforms generate their own previews which may be less compelling, reducing click-through rates from social shares.
What is JSON-LD structured data?
JSON-LD is a format for adding structured data to your pages using schema.org vocabulary. It helps search engines understand your content type (article, product, recipe, event) and can enable rich results like star ratings, prices, and FAQ accordions directly in search results.
What does a 'noindex' robots meta tag mean?
A meta robots tag with 'noindex' instructs search engines not to include the page in their index. This means the page will not appear in search results. This is useful for internal pages, staging environments, or duplicate content, but harmful if applied to pages you want to rank.
Is my HTML data sent to any server?
No. All inspection happens entirely in your browser using the native DOMParser API. Your HTML content — which may contain proprietary markup, internal URLs, or unreleased page designs — never leaves your device. No data is stored, logged, or transmitted.