Meta Description

Name: Meta Description
Author: thedaviddias

thedaviddias/frontendchecklist

1 installs
73.4k repo stars
Updated June 18, 2026
thedaviddias/frontendchecklist

Audits each page for a unique meta description tag between 120 and 160 characters and writes or fixes one when it is missing, duplicated, or the wrong length.

About

Checks the head of each page for a unique meta description tag of the right length and rewrites it as call-to-action ad copy for search results. A developer uses it when auditing page metadata or generating descriptions for new pages.

Flags missing, duplicate, or out-of-range (120-160 char) descriptions
Meta description is not a ranking factor but drives click-through rate

Meta Description by the numbers

1 all-time installs (skills.sh)
Ranked #1,710 of 1,879 Marketing & SEO skills by installs in the Skillselion catalog
Data as of Aug 5, 2026 (Skillselion catalog sync)

npx skills add https://github.com/thedaviddias/frontendchecklist --skill meta-description

Add your badge

Show developers this skill is listed on Skillselion. Paste this into your README.

[![Listed on Skillselion](https://skillselion.com/badge/skills/thedaviddias/frontendchecklist/meta-description.svg)](https://skillselion.com/skills/thedaviddias/frontendchecklist/meta-description)

Installs	1
repo stars	★ 73.4k
Last updated	June 18, 2026
Repository	thedaviddias/frontendchecklist ↗

What it does

Audits each page for a unique meta description tag between 120 and 160 characters and writes or fixes one when it is missing, duplicated, or the wrong length.

Files

SKILL.mdMarkdownGitHub ↗

Write a meta description for each page

A compelling meta description acts as organic ad copy in search results—well-written descriptions improve click-through rates even though they are not a direct ranking signal.

Quick Reference

Every page should have a unique meta description between 120–160 characters
Meta descriptions are not a ranking factor but strongly influence click-through rates
Write descriptions as a call to action that summarises the page value
Google may override your description with content from the page

Check

Check the <head> for a <meta name='description'> tag. Verify it is present, unique, and between 120 and 160 characters. Flag pages where it is missing, duplicated, or outside the recommended length.

Fix

Add or update the <meta name='description' content='...'> tag in <head>. Write a unique summary of 120–160 characters that accurately describes the page content and includes a natural call to action or value proposition.

Explain

The meta description appears as the short paragraph below the title in search results. Although not a ranking factor, a compelling description improves click-through rate, which can indirectly benefit rankings.

Code Review

Check the <head> for <meta name='description' content='...'> element. Verify: (1) the element exists, (2) content attribute is non-empty, (3) length is between 70 and 160 characters, (4) no HTML tags inside content, (5) the description is unique (not the same as other pages).

---

For full implementation details, code examples, and framework-specific guidance, see references/rule.md.

Rule page: https://frontendchecklist.io/en/rules/seo/meta-description

Write a meta description for each page

Validates meta description presence and length

Priority: high · Difficulty: beginner · Time: 10 min

--- The meta description is the short paragraph shown beneath your page title in search results. While not a direct ranking signal, it is your primary organic ad copy.

Code Examples

<!-- ✅ Good: Unique, 145 characters, describes value clearly -->
<head>
  <meta name="description" content="Learn to bake sourdough bread at home with our step-by-step guide. Covers starter, shaping, scoring, and baking in a Dutch oven." />
</head>

<!-- ❌ Bad: Missing description -->
<head>
  <title>Sourdough Bread Recipe | BakeCo</title>
  <!-- no meta description -->
</head>

<!-- ❌ Bad: Identical description on every page -->
<head>
  <meta name="description" content="BakeCo – the best baking website." />
</head>

Why It Matters

A compelling meta description acts as organic ad copy in search results—well-written descriptions improve click-through rates even though they are not a direct ranking signal.

Length Guidelines

Length	Result
< 70 characters	Too short — wasted opportunity
120–160 characters	Ideal for desktop SERPs
> 160 characters	Truncated with "…"

Google measures in pixels (~920px max for desktop), so exact character limits vary.

Writing Effective Descriptions

Answer the user's intent: What problem does this page solve?
Include a natural CTA: "Learn how to…", "Discover…", "Shop our…"
Avoid keyword stuffing: Write for users, not robots
Match the page: Google may replace your description if it doesn't match the query

Next.js Implementation

// app/blog/[slug]/page.tsx

  const post = await getPost(params.slug)
  return {
    description: post.excerpt.slice(0, 155),
  }
}

// app/layout.tsx — site-wide fallback

  description: 'BakeCo – Step-by-step artisan bread recipes for home bakers.',
}

Common Mistakes

<!-- ❌ Bad: Content attribute missing -->
<meta name="description" />

<!-- ❌ Bad: HTML tags inside description -->
<meta name="description" content="<b>Best</b> sourdough recipes" />

<!-- ✅ Good: Plain text, clear value -->
<meta name="description" content="Master sourdough at home. Our guide walks you through every stage, from building a starter to your first perfect loaf." />

Exceptions

Utility or intentionally noindex pages may keep minimal metadata when richer search presentation is not a goal.
Template-driven pages can look repetitive in isolation; confirm the fully rendered production output before flagging duplication or omission.
If a page is intentionally redirected or excluded from indexation, resolve that crawlability decision before treating metadata polish as the primary issue.

Verification

Automated Checks

View page source and search for name="description"
Use Google Search Console → Enhancements → check for missing or duplicated descriptions
Use Google's Rich Results Test to verify metadata is readable