The Complete Guide to HTML Meta Tags for SEO in 2026

April 2026 · 9 min read · SEO

Meta tags are invisible to users but critical for search engines and social media platforms. Here's every tag that matters, with copy-paste templates.

Essential Meta Tags

Title Tag

<title>Your Page Title — Brand Name</title>

Keep it under 60 characters
Put the primary keyword near the front
Use pipes (|) or dashes (—) to separate brand name

Meta Description

<meta name="description" content="A compelling 150-160 character description that includes your target keyword and a call-to-action.">

Viewport (Mobile)

<meta name="viewport" content="width=device-width, initial-scale=1.0">

This is non-negotiable. Without it, your site won't be mobile-friendly and Google will penalize rankings.

Open Graph Tags (Facebook, LinkedIn)

<meta property="og:title" content="Your Page Title">
<meta property="og:description" content="Page description for social sharing">
<meta property="og:image" content="https://yoursite.com/og-image.jpg">
<meta property="og:url" content="https://yoursite.com/page">
<meta property="og:type" content="website">
<meta property="og:site_name" content="Your Brand">

💡 OG Image dimensions: 1200×630 pixels is the recommended size. Facebook crops smaller images to a square thumbnail, which loses impact.

Twitter Card Tags

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Your Page Title">
<meta name="twitter:description" content="Page description">
<meta name="twitter:image" content="https://yoursite.com/twitter-card.jpg">
<meta name="twitter:site" content="@yourbrand">

Canonical URL

<link rel="canonical" href="https://yoursite.com/page">

Prevents duplicate content issues. Always set the canonical to the preferred URL version (with or without www, with or without trailing slash).

Robots Directives

<!-- Allow indexing (default) -->
<meta name="robots" content="index, follow">

<!-- Block indexing -->
<meta name="robots" content="noindex, nofollow">

<!-- Index but don't follow links -->
<meta name="robots" content="index, nofollow">

Complete Template

Copy this template and fill in your values:

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Page Title — Brand</title>
  <meta name="description" content="Description">
  <link rel="canonical" href="https://yoursite.com/page">
  
  <!-- Open Graph -->
  <meta property="og:title" content="Page Title">
  <meta property="og:description" content="Description">
  <meta property="og:image" content="https://yoursite.com/og.jpg">
  <meta property="og:url" content="https://yoursite.com/page">
  <meta property="og:type" content="website">
  
  <!-- Twitter -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="Page Title">
  <meta name="twitter:description" content="Description">
  <meta name="twitter:image" content="https://yoursite.com/og.jpg">
  
  <!-- Favicon -->
  <link rel="icon" type="image/svg+xml" href="/favicon.svg">
</head>

🔍 Generate meta tags instantly

Use our free Meta Tag Generator with live Google preview, or grab all 170+ templates.

Get the Bundle — $49