HTML Meta Tags & SEO

Also Known As

TL;DR

Explanation

Key meta tags: title (50-60 chars, unique per page), meta description (150-160 chars, compelling summary), meta robots (index/noindex, follow/nofollow), canonical (prevents duplicate content penalties), Open Graph (og:title, og:description, og:image — for Facebook/LinkedIn sharing), Twitter Card (twitter:card, twitter:image), and lang attribute on html element. Structured data (JSON-LD with Schema.org) enables rich snippets in search results — FAQPage, Product, Article, BreadcrumbList. Each PHP page template should generate unique, meaningful meta tags dynamically.

Common Misconception

Why It Matters

Common Mistakes

• Same meta description on every page — each page needs a unique, descriptive description.
• Missing canonical tag on paginated pages — /products?page=2 competes with /products.
• Open Graph image not specified — social shares show a blank or incorrect image.
• Title tag over 60 characters — truncated in search results.

Code Examples

<!-- Static/missing meta — same on every page:
<title>My Website</title>
<!-- No meta description -->
<!-- No canonical -->
<!-- No Open Graph -->

<!-- Dynamic meta in PHP template:
<title><?= esc($page->title) ?> | CodeClarityLab</title>
<meta name="description" content="<?= esc($page->description) ?>">
<link rel="canonical" href="<?= esc($page->canonicalUrl) ?>">

<!-- Open Graph:
<meta property="og:title" content="<?= esc($page->title) ?>">
<meta property="og:description" content="<?= esc($page->description) ?>">
<meta property="og:image" content="<?= esc($page->ogImage) ?>">
<meta property="og:type" content="article">

<!-- Structured data:
<script type="application/ld+json">
<?= json_encode(['@context'=>'https://schema.org','@type'=>'Article','name'=>$page->title]) ?>
</script>

References

• ↗ https://developers.google.com/search/docs/fundamentals/seo-starter-guide

Tags

Related Terms