HTML SEO Inspector - Audit Meta Tags Online

HTML Content

Enter your HTML content to inspect for SEO elements, meta tags, headings, and structured data

SEO Inspection Results

Inspecting HTML Pages for On-Page SEO Elements

On-page SEO determines how search engines understand, categorize, and rank individual pages. Every HTML document communicates metadata to crawlers through title tags, meta descriptions, canonical URLs, heading hierarchy, structured data, and social media previews. Missing or misconfigured elements mean search engines cannot properly display your content in results pages, understand page relationships, or extract rich snippets that drive click-through rates. The HTML SEO Inspector analyzes your page markup to identify gaps in this critical metadata layer.

Paste any HTML document and receive a comprehensive audit covering title optimization, meta description quality, canonical URL configuration, heading structure, OpenGraph tags for social sharing, Twitter Card metadata, JSON-LD structured data validation, and image accessibility. Each finding includes the current value (or absence), its SEO impact, and specific recommendations for improvement. All processing happens in your browser — your HTML content never leaves your device.

Title Tags and Meta Descriptions

Title tags and meta descriptions are the primary elements displayed in search engine results pages (SERPs). The inspector validates:

Title presence: Pages without <title> tags cannot rank effectively
Title length: Titles exceeding 60 characters get truncated in Google results
Title uniqueness: Generic titles like "Home" or "Page" provide no ranking signal
Meta description presence: Missing descriptions mean Google auto-generates snippets
Description length: Descriptions beyond 160 characters get truncated
Canonical URL: Missing <link rel="canonical"> risks duplicate content issues
Robots meta: Accidental noindex or nofollow directives block indexing

The inspector distinguishes between missing elements (critical), suboptimal configurations (warnings), and well-optimized elements (passing), giving you a clear prioritization of fixes.

Heading Hierarchy and Content Structure

Search engines use heading hierarchy to understand content structure and topic organization. The inspector checks:

H1 presence: Every page should have exactly one H1 describing its primary topic
Multiple H1s: More than one H1 dilutes the page's topic signal
Level skipping: Jumping from H2 to H4 (skipping H3) indicates poor structure
Heading depth: Deep nesting (H5, H6) without matching content indicates misuse
Empty headings: Headings without text content provide no semantic value

Proper heading hierarchy helps both crawlers and users understand page organization. Screen readers use headings for navigation, making correct hierarchy an accessibility requirement as well as an SEO best practice.

Structured Data and Social Previews

Rich results (featured snippets, recipe cards, product listings) require structured data markup. The inspector validates:

JSON-LD presence: Detects <script type="application/ld+json"> blocks
Schema validation: Checks for required properties in common schemas (Article, Product, FAQ)
OpenGraph tags: og:title, og:description, og:image for Facebook/LinkedIn sharing
Twitter Cards: twitter:card, twitter:title, twitter:image for Twitter previews
Image alt text: Images without alt attributes miss ranking opportunities in image search

Social preview metadata controls how your pages appear when shared on social platforms. Missing OpenGraph images result in generic link previews that dramatically reduce engagement rates.

Code Examples

Well-Optimized HTML Head Section

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>JSON Formatter — Pretty Print and Validate JSON Online</title>
  <meta name="description" content="Format, validate, and beautify JSON data with syntax highlighting. Free online tool with instant results and no data transmission.">
  <link rel="canonical" href="https://stratecode.tools/tools/json-formatter/">
  <meta name="robots" content="index, follow">

  <!-- OpenGraph for social sharing -->
  <meta property="og:title" content="JSON Formatter — Pretty Print JSON Online">
  <meta property="og:description" content="Format and validate JSON with instant results.">
  <meta property="og:type" content="website">
  <meta property="og:url" content="https://stratecode.tools/tools/json-formatter/">
  <meta property="og:image" content="https://stratecode.tools/images/og-json-formatter.png">

  <!-- Twitter Card -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="JSON Formatter — Pretty Print JSON Online">

  <!-- Structured Data -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "SoftwareApplication",
    "name": "JSON Formatter",
    "applicationCategory": "DeveloperApplication",
    "operatingSystem": "Web"
  }
  </script>
</head>

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.