メタタグとは？

メタタグとは、HTMLの<meta>要素を指す包括的な用語で、ページのメタデータを<head>内に提供します。meta descriptionとmeta robots tagはそのサブタイプです。
メタタグは、charset（文字エンコーディングの宣言）、http-equiv（HTTPヘッダーの代替）、およびname+content（文書レベルのメタデータ）の3つの方法で情報を伝えます。
Google が認識するメタタグには、description、robots/googlebot、viewport、google-site-verification などがあります。
og:ファミリーは、Open Graphプロトコルのメタタグで構成されており、ページがソーシャルメディアで共有されたときに表示されるプレビューカードを作成します。
メタタグ自体が直接検索順位を上げるわけではありませんが、インデックス登録、スニペット、モバイル表示、そしてページが共有された際の見え方を制御する重要なシグナルです。

メタタグの定義

メタタグとは、HTMLページの<meta>要素を指す包括的な用語であり、それらは<head>内に配置され、検索エンジンやブラウザなどのクライアントにページの補足情報を伝えます。メタタグはページ上で視覚的に表示されることはありませんが、文書の文字エンコーディング、ページ概要、モバイル画面での表示方法、クローラ向けのインデックス指示などのメタデータを定義します。

重要なのは、メタタグが親概念であるという点です。Themeta descriptionとmeta robots tagは、SEOでよく言及されるものですが、別個の概念ではなく、metaタグの特定の種類です。つまり、<meta name="description">と<meta name="robots">の両方が、より広いカテゴリであるmetaタグに含まれます。

メタデータの提供方法

MDNのドキュメントによると、<meta>要素は以下の方法でメタデータを提供します。役割は、使用する属性によって変わります。

charset— ドキュメントの文字エンコーディングを宣言します。HTML5では、utf-8のみが有効な値であり、ドキュメントの最初の1024バイト以内に記述する必要があります。
http-equiv— HTTPレスポンスヘッダーをエミュレートするpragmaディレクティブとして機能します（例：refresh）。
name + content— ページ全体に適用される名前と値のペアとして、ドキュメントレベルのメタデータを定義します（例：description、viewport、robots）。
itemprop— microdata用のカスタムメタデータを提供します。name、http-equiv、charsetとは併用できません。

主要なメタタグ

以下は、実務で頻繁に使われ、Googleによって公式に認識されている主要なmetaタグです（出典：Google Search Central、MDN）。

メタタグ	役割
`charset`	ドキュメントの文字エンコーディングを宣言します（HTML5 では utf-8 に固定）
`name="description"`	ページの要約を提供します。検索結果のスニペットとして表示される場合があります
`name="robots"`/`name="googlebot"`	インデックス登録とクロールの動作を制御します。robots はすべての検索エンジンに適用され、googlebot は Google 専用です
`name="viewport"`	モバイル画面でページをどのように表示するかを指定します。モバイル対応のシグナルです
`name="google-site-verification"`	Search Console でサイトの所有権を確認します
`name="notranslate"`	ページの翻訳版が検索結果で提供されるのをブロックします
`property="og:*"`	Open Graphプロトコル。ソーシャル共有用のプレビューを構築します

コード例

これは、ページの<head>に配置される一般的なメタタグのセットです。

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="A one- or two-sentence summary of the page.">
  <meta name="robots" content="index, follow">

  <!-- Open Graph (social sharing preview) -->
  <meta property="og:title" content="Page title">
  <meta property="og:description" content="Description shown when shared">
  <meta property="og:image" content="https://example.com/preview.jpg">
  <meta property="og:url" content="https://example.com/page">
</head>

SEO関連性とエビデンス

metaタグは、検索順位を直接押し上げる魔法のレバーではありません。実際、Googleは長年にわたり、name="keywords"のmetaタグをランキングに使用していないと明言しています。とはいえ、metaタグは検索可視性とユーザー体験を左右する中核的な制御シグナルです。

スニペット制御:descriptionは、検索結果に表示される要約の候補となり、クリック率（CTR）に影響します。
インデックス制御:robotsmetaタグを使うことで、個々のページがどのようにインデックスされ、表示されるかを細かく指示できます。
モバイル対応:viewportは、ページがモバイルでどのように表示されるかをGoogleに伝えるシグナルです。
共有時の表示:Open Graphmetaタグ（og:title、og:imageなどは ogp.me 標準に準拠しており、ソーシャルプラットフォームのクローラーがプレビューカードを生成するための基盤となります。

実装チェックリスト

すべてのページにcharset="utf-8"とviewportが含まれていることを確認します。
各ページごとに、一意で適切な長さのdescriptionを記述します。
インデックスから除外するページには、noindexをrobotsメタタグ内に指定します。
ソーシャル共有が重要なページでは、og:title、og:description、og:image、そしてog:url。
ランキングには意味がないkeywordsメタタグに時間を費やさないでください。

メタタグ