メタタグとは、htmlやxhtmlに使われる<meta>タグのことを言い、Webページの構造化されたデータを伝える役割を果たします。様々な属性でメタ情報を伝えることができ、検索結果に表示されるタイトルや説明文などに活用されます。そのためメタタグを設定することは、SEOで重要な作業と言えます。
この記事ではメタタグとSEOの関係や、設定しておくべき主要なメタタグの種類、メタタグの設定方法について解説します。
目次
メタタグ（metaタグ）とは、設置する文書（ページ）に関する情報を指定する時に使用します。メタ要素とも呼ばれ、HTML文書で<head>～</head>要素内に記載し、検索エンジンにWebサイトの情報を伝える役割を果たします。
メタタグで記述された内容は、コンテンツ上では表示されないので、設定内容を確認したい時はHTMLソースを見る必要があります。
メタタグの指定内容は「コンテンツ上では表示されない」と書きましたが、titleやdescriptionというメタ要素で指定された内容は、検索エンジンの検索結果に表示されたり、記事がSNSでシェアされたときに表示されたりします。
▲メタタグ実装済の検索結果表示例
▲主要SNSの表示例
ユーザーのクリック率を高めるためにも、メタタグの意義を理解して適切に設定しておきたい項目です。
メタタグは、直接的にSEO効果（検索順位を上げる効果）があるケース、ないケースどちらもあります。
つまり、いくらメタタグ内にキーワードを詰め込んでも、そのキーワードで上位表示できるわけではないということはあらかじめ理解しておきましょう。
ただし、設定が正しくできていないと意図しない形で表示されたり、検索結果に表示されなくなったりするリスクがあるため、内容を理解し正しく設定することが重要です。
メタタグのメリットをまとめると、以下の2点に集約されます。
メタタグの中には、検索エンジンの巡回を拒否したり許可したりする役割を果たすタグがあります。
巡回が必要なページかどうかを伝えることで、結果、検索エンジンから適切にクロールされ、検索結果へ望んだ状況で表示される可能性が高くなります。
また、逆にインデックス登録させたくない（検索結果画面には表示させたくない）ページについても、検索結果に表示されないようにするための指示も記載できます。
メタタグには、記事のタイトルを指定するタグ（titleタグ）、記事の要約を指定するタグ（descriptionタグ）などがあります。これらで指定したテキストは、検索結果画面やSNSのシェア情報として自動で表示されます。
Webサイトを訪問する前のユーザーにサイトの内容を伝える役割を果たすので、ここでユーザーのニーズを含めた内容を記載することで、クリック率を高めることができます。どんなに良い内容のコンテンツを準備できていても、タイトルや要約を見てクリックされなければアクセスにはつながらないので、メタタグの設定がアクセス数の肝を握っているとも言えます。
では、具体的にはどんなメタタグを設定しておく必要があるのか、SEO対策で知っておくべき7つのメタタグを説明します。
titleタグは文書にタイトルを付ける際に使用します。検索結果に表示される大事なタグなので、必ず最適化して設置しておきたいタグです。1つのページに1つだけ<title>記事のタイトル</title>という形で<head>～</head>内に記述します。厳密にはメタタグの中には入らないのですが、メタタグと一緒に設定しておくべきタグ要素なので、一緒に覚えておきましょう。
titleタグの中に、SEOで効果的なキーワードを含めることで順位向上を見込むことができる大事なタグです。最低限のSEO対策としてtitleタグは最適化するのをおすすめします。
meta description（メタ ディスクリプション）タグには、ページの概要を120字程度で設定します。メタディスクリプションの設定によってSEO順位が変わることはありませんが、検索結果に表示される文章次第でクリック率に影響します。
メタディスクリプションは、好きな様に設定するものではなく、あくまでもページの概要を反映したものであるべきです。
もし、ページの概要と合っていない設定内容だと検索エンジンが理解した場合、検索エンジン側が要約した文章をもって検索結果に反映されます。検索エンジン側が要約した文章は日本語の文法がおかしい場合や、意図しない内容となってしまう場合があるので、注意が必要です。
また、最近ではメタディスクリプションよりも、ページ内のコンテンツをもとに検索結果の説明文を生成するようになってきています。
一見、メタディスクリプションの設定は不要になったようにも捉えられますが、メタディスクリプションを無視するようになったわけではありませんので、引き続き設定はしておくようにしましょう。
詳細なメタディスクリプションの設定内容は、下記記事を参考にしてください。
HTML文書がどの文字コードでエンコーディングされているかは、charset属性を使用します。日本語の場合は、「utf-8」「shift_jis」「euc-jp」が該当します。日本語に対応されていない文字コードを使用すると、文字化けしたコンテンツが表示されることになります。charset属性は1つの文書に1つとなっています。
例えば「utf-8」を指定する場合、以下の記述を必ず入れます。
<meta charset="utf-8">
SNSでのシェアを意識するなら、必須なのがOGPに関連するタグです。これはOpen Graph Protocolの略語で、SNSでシェアされた時にページのタイトル、アイキャッチ画像、URL、ディスクリプションを正しく表示させるための仕組みです。正しく設定されていないと、シェアされていたときのクリック率が低くなってしまいます。
OGPタグには複数の種類があります。基本的なコンテンツには、以下のタグを適宜設定してください。
OGPを設定するWebページのURLを指定するためのタグです。
<meta property="og:url" content=" WebページのURL" />
シェア時に表示されるページタイトル。一般的にはtitleタグと同じでいいですが、サイト名などの共通項を除いてよりシンプルな内容で指定するとわかりやすいです。
<meta property="og:title" content="タイトル" />
シェア時に表示されるよう、短めの文字数でまとめたdescriptionを記述します。
<meta property="og:description" content="ディスクリプション" />
title属性から省いたサイトタイトルやブランド名などを、ここに設定します。
<meta property="og:site_name" content="サイトタイトル・ブランド名" />
シェアされた時に表示されるサムネイル画像URLを指定します。
<meta property="og:image" content="画像URL" />
ビューポートタグは、モバイル端末での表示をブラウザに指示するためのメタタグです。レスポンシブデザインに必須のタグです。今はモバイルフレンドリーであることが求められるので、忘れずに指定しましょう。
Google推奨のレスポンシブな記述は以下のとおりです。
<meta name="viewport" content="width=device-width, initial-scale=1.0">
検索エンジンにインデックスされたくないページに記述しておきたいメタタグ要素です。インデックスやクロール不要なページを検索結果から除外することで、質の高いページのみがインデックスされるようになることで、サイト全体の評価が高まるようなSEOに良い影響があります。
Webフォーム回答後のサンクスページや、URLを知っているユーザーだけがアクセスできるページなど、検索エンジンのインデックス不要な場合によく使います。
以下のように記述することで、クローラーにページをインデックスさせないこと、リンクしているページをクロールしないようにすることを指示できます。
<meta name="robots" content="noindex,nofollow">
AI Overview（旧SGE：Search Generative Experience）への表示を制御するメタタグです。AI Overviewは、検索結果の上部にAIによって生成された要約が表示される機能のことで、この機能にサイトのコンテンツが引用されたくない場合に設定します。
以下のように、nosnippetを記述すると引用を完全にブロックできます。また、max-snippetを記述すると引用される最大文字数を制限でき、下記は50文字に制限する場合の記述例です。
<meta name="robots" content="nosnippet">
<meta name="robots" content="max-snippet:50">
なお、上記の設定は通常の検索結果のスニペット表示にも影響します。現時点ではAI Overviewへの引用のみを制限する方法はないため、通常の検索結果に影響を与えたくない場合には設定を避ける方がよいでしょう。
Googleではすでにサポートが終了しているメタタグもあり、これらの設定有無はGoogle検索の評価に影響しないため認識しておきましょう。なお、Google以外の検索エンジンでは引き続き設定した情報が利用される可能性があります。
メタタグの中で、重要性が低いものにメタキーワード（meta keywords）タグがあります。
これは、以下の通りページに関連するキーワードを記述するためのタグです
<meta name="keywords" content="キーワード1,キーワード2,キーワード3">
メタキーワードは従来、SEO対策で有効とされていましたが、今はSEO効果を見込むタグではありません。Googleの公式な言及でもSEO効果はないとされています。
Google検索では、コンテンツを構成している文字情報に基づいて言語を検出・判断するため、lang属性の情報を利用しません。
ページネーションにおいて、ページの関係性を伝える
<link rel="next" href="...">
<link rel="prev" href="...">
は、現在Google検索では利用されません。
コンテンツを表示している状態ではメタタグを見ることは出来ないので、メタタグを確認するには意図的な操作が必要です。
メタタグを確認するためには、該当ページを開き、右クリックを行います。するとメニューが表示されるので、「ページのソース表示」をクリックしてください。すると、以下のようにソースコードが表示されます。
また、該当ページを開いた上で、「Ctrl + U」をクリックしてもソース閲覧画面が開きます。この画面内で、メタタグの表示を確認してください。
ブラウザのChromeを使っている場合は、拡張機能を使うことでより簡単に確認可能です。
「META SEO Inspector」をインストールすると、閲覧中の画面のメタタグをすぐに確認できるようになります。分析作業を効率化できるので、たくさんのページのメタタグを確認する場合などはぜひ活用してみてください。
以下からインストールできます。
メタタグを作成するには、HTMLファイルに直接書き込む、WordPressの場合はプラグインもしくはテーマで既に用意された記述ボックスを活用する、という方法があります。
HTMLファイルを作成している場合は、<head>要素内に必要なメタタグを記述します。各メタタグの記述方法は、本記事を参考にしてください。
WordPressの場合、プラグインを活用することでメタタグを記述することができます。いちいちFTPでアップロードする必要もなく、手軽です。
よく使われているプラグインは、「Yoast SEO」や「All in one SEO Pack」です。メタタグの設定のほか、WordPressのSEO効果を高めるための設定を一度にできるので、導入することをおすすめします。インストールすると入力画面が表示されるようになり、フォームを埋めるようにすれば設定が完了するので楽です。
ただしWordPressのテーマの中には、プラグイン追加せずにメタタグを設定できる記述ボックスが最初からついている場合もあります。
最後に、メタタグを作成する際の注意点を2つお伝えします。
まずは、HTMLファイルに直接記述する際の注意点です。気をつけるのは、メタタグを記述する場所です。HTMLファイルは大きく<head>部分と<body>部分に分かれます。このうち、メタタグを記述するのは<head>部分です。
<body>内はWebサイトの中身部分を各場所なので、ここにメタタグを記載しても意味がありません。
簡略化すると、以下のような構成となります。
<html>
<head>
head部はブラウザや検索エンジンについての情報を記載する場所。ブラウザ上は表示されない。メタタグはここに書く
</head>
<body>
ブラウザ上で表示される場所。コンテンツはここに書く
</body>
</html>
記載する場所を間違えると、ページデザインもおかしくなり、検索エンジンに指示ができないので、くれぐれも注意しましょう。
ついつい関連するキーワードをたくさん盛り込んでしまいたくなりますが、キーワードはコンテンツの内容に関連するものだけに絞って記載しましょう。たくさん詰め込みすぎると、何が大事なキーワードかが逆に分からなくなります。
あくまでも、「内容をわかりやすく伝える」ことを意識しながら、シンプルな記述を心がけてください。
headの記述方法に誤りがあった場合、Googleの処理に問題が発生することがあります。
特に注意すべきは、head内で無効な要素を誤って記述しないことです。
もし、Googleがhead内に下記のような無効な要素を見つけた場合、それ以降の要素はすべて無視されてしまいます。
可能な限りJavaScriptによるメタタグの挿入や変更は控えましょう。GoogleによるJavaScriptの処理精度は向上しているものの、適切に処理されなかった場合、メタタグの設定が意図しない内容になる可能性があります。
やむを得ずJavaScriptを用いる場合はリッチリザルトテストやURL検査ツールでチェックを行いながら実装しましょう。レンダリングされたHTML内に意図した内容のメタタグが記述されているかどうかを確認してください。
メタタグには検索エンジンやブラウザに対して必要なメタ情報を記述します。文字コードやページのタイトルや説明、検索結果のインデックス有無を指定します。本記事ではSEO対策で設定を推奨する7つのメタタグを紹介しています。
メタタグはhtmlファイル内のheadタグの中に記述します。
robotsメタタグとは、noindex、nofollowなど、クローラーの動きを制御するメタタグのことを指します。
インデックスや検索結果への表示に影響するものが多いため、設定は慎重に行いましょう。上記の他にもnoarchive、nosnippet、noimageindexなど、様々なrobotsメタタグが存在します。
メタタグは、検索エンジンやユーザーに記事の内容を伝える重要な役割を果たします。今まであまり意識したことがなかった方は、メタタグの意義を理解して、適切に設定するようにしてください。クリック率向上など、Webサイトの効果改善につながるはずです。
WordPressでサイト立ち上げることになった時、「どんなプラグインを使うべきか分からない！」とお困りの方も多いのではないでしょうか？ 今…
meta description（メタディスクリプション）は、検索エンジンの検索結果画面に表示されるWebページの説明文です。新しいWebペ…
社内でWordPressを運営しているのであれば、Webサイトへの集客力を上げるため、SEO対策が可能なプラグインの利用が欠かせません。もし…
GoogleやYahoo!で検索を行った際、みなさんはどのようなサイトをクリックしますか？ 検索順位が上位のサイトはもちろんクリックされやす…
サイト運営する上で、注意しなければいけないのがGoogleペナルティです。 Webサイトの流入が急に減った…そんな時、実はGoogleからペ…
みなさんがSEOに取り組みだしたのはいつ頃からでしょうか？ 私がSEOに出会ったのは2006年頃にインターネット広告事業の立ち上げをさせてい…
今話題のAIによるコンテンツ自動生成機能も！SEO対策に本当に必要な機能だけを搭載した使いやすさとコストパフォーマンスに優れたWeb集客支援ツールです。
Webマーケティングに関わる施策全般をワンストップで
ご提供します。
お気軽にご相談ください。
Webマーケティング最新ニュースのレポートや無料セミナーの先行案内が届く、お得なメルマガ配信中！
検索順位で1位まで上げるためのSEOポイント8つ
E-E-A-Tとは？ SEOにおける重要性と評価の高め方を解説
成功確率アップ！BtoBのコンテンツマーケティング施策とは
YMYLとは？該当するジャンルとSEOにおける対策のポイント8つ
SEO内部施策とは？重要な項目16選【セルフチェックリストつき】