SEO研究所サクラサクラボ

SEO・コンテンツマーケティングを成功に導くパートナー

メタタグとは?SEOに重要なタグと確認方法

Webサイトを運営されている方なら、Webページ(記事)を作成する際には内容だけでなく、タイトルやメタディスクリプションにも気を配っていることでしょう。
メタタグ(metaタグ)は、ページを開いた時に必ずしも直接表示されるものではありませんが、ページの内容や指示を検索エンジン(クローラー)やブラウザに伝えるという役割を担っています。

一口にメタタグといっても多くの種類が存在しますが、この記事では、Web集客やSEOの視点で重要なメタタグ、あまり重要でないメタタグをピックアップして紹介します。

メタタグとは

メタタグとは、HTMLにおいて、要素で記載される、クローラーやブラウザ向けなどのシステム向けの情報(メタデータ)のことを指します。
主なメタタグの用途として、ディスクリプション(ページ概要)の記載、文字コードの指定、クローラーへのインデックス可否の意思表示などがあります。

なお文脈によっては広義に、必ずしも要素でなくとも内に記載されるような情報全般がメタタグと呼ばれることがあるため注意が必要です。例えば、タイトルタグやカノニカルタグなどは要素ではなく厳密にはメタタグではありませんが、ロボット向けのコードとして同列に扱われることがあります。

ブラウザでページを見ているユーザーがメタタグを直接目にすることはほとんどありませんが、メタタグを適切に設定すると、クローラーやブラウザにページの情報や指示を伝えられるようになるため、結果としてWebサイトの成果を高める可能性があります。

メタタグの確認方法(見方)

メタタグは、HTMLのタグ内に記載されていますが、ページを開いただけでは通常表示されないものばかりですので、ソースコードを確認します。

一般的なブラウザでは、Ctrl+Uでソースコードを表示することができます。

もしくは、Chromeであれば、Ctrl+Shift+I(またはページ内の任意の位置で右クリックして「検証」)でデベロッパーツールを開けばElementタブ内にコードが表示されます。

参考:Google Chromeデベロッパーツールとは?使い方や簡易的な解析テクニックについて

メタタグは内に記載することになっていますので、ソースコードの上のほうを探してみましょう。要素はname属性、http-equiv属性、charset属性のうち一つが必須となっていますが、このうちname属性が記述されたものが最も一般的です。
name属性が使用された場合、content属性も必須であるため、「<meta name=”値” content=”内容”」という形のものが多いでしょう。例えば、メタディスクリプション(descriptionタグ)やSNSでシェアされたときのサムネイル画像(og:imageタグ)は以下のように記述されています。

<html>
<head>
<meta property=”og:image” content=”サムネイル画像の URL” />
<meta name=”description” content=”ページ概要”>
</head>
<body>
       (ここにWebページの中身が入ります)
</body>

メタタグの記述方法のサンプルについては、後述するメタタグのリストを参照ください。

SEOやWebマーケティングに重要なメタタグ7選

メタタグには様々な種類がありますので、特にSEOの視点で特に重要なメタタグを解説します。

なお、Googleがサポートしているメタタグのリストは以下のドキュメントで公開されています。
Google がサポートしている特別なタグ

タイトル

<title>○○○○○○○○</title>

titleタグは正確にはメタタグではありませんが、検索エンジンが検索結果画面に使用したり、ブラウザがタブに表示させたりする、ページ内で非常に重要なタグです。

SEOを重視するのであれば、検索結果画面でユーザーに目を留めてもらえるよう、キーワードを含む形で、なるべく端的に(35文字程度以内)、コンテンツの魅力が伝わるタイトルを考えて設定するとよいでしょう。

メタディスクリプション

<meta name=”description” content=”○○○○○○○○”>

ページの概要を定義するメタタグで、検索エンジンもこのタグの内容を検索結果のスニペットとして表示することがあります(ただし絶対ではなく、場合によってはGoogleが自動的に生成して表示することもあります)。

現在メタディスクリプションにはランキング効果はありませんが、タイトルタグに書ききれなかったページの魅力をここに記載して、ユーザーのクリックを促すという意味でSEOに効果のあるタグです。

検索結果に表示される文字数は仕様変更の可能性もありますが100文字前後を目安とし、タイトルタグと同じようにキーワードを含む形で設定するとよいでしょう。

文字エンコード

<meta charset=”UTF-8″>

または

<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″/>

エンコードは記載したからといってSEOのランキングが向上するといったものではありませんが、HTMLでページを公開する際のきまりごととして、クローラーやブラウザなどのコンピューターに誤りなく処理してもらうために必ず設定しておきましょう。

OGP(Open Graph Protocol)

<meta property=”og:title” content=”○○○○○○○○”>

<meta property=”og:description” content=”○○○○○○○○”>

<meta property=”og:type” content=”○○○○○○○○”>

<meta property=”og:url” content=”○○○○○○○○”>

<meta property=”og:image” content=”○○○○○○○○”>

TwitterやFacebookをはじめとするSNSでWebページがシェアされた際に、どのようにリンク表示するかを定義するタグです。特にサムネイル画像(og:imageタグ)やタイトル(og:title)のリンクカードの表示のされ方は、集客力に大きく影響します。Twitter専用のタグとしてTwitter cardがありますが、OGPがあればそちらを参照しますので、twitter cardは設定しなくても問題はありません。

なお、FacebookやtwitterはタイトルやディスクリプションタグよりOGPを優先して認識する一方、GoogleはOGPを参照しませんので、これらは両方設定しておく必要があります。

ビューポート

<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1″>

モバイル最適化された表示をするためのビューポートを指定するタグです。
このタグはページごとに埋め込むというよりも、サイト制作の段階でテンプレートとして埋め込むことがほとんどでしょう。

すでにモバイル対応済みのサイトであれば気にする必要はありませんが、まだモバイル対応を行っていないサイトでは、採用するモバイル対応方式を検討の上、実装しましょう。

参考:
モバイルユーザビリティとは?テストの実施方法とエラーの改善方法を解説
これからのモバイル対応はレスポンシブが強く推奨

メタリフレッシュ

<meta http-equiv=”refresh” content=”10; url=○○○.html”>

ユーザーが古いページを訪問した際に新しいページに自動転送することを「リダイレクト」と呼び、メタリフレッシュはそれを実現するための方法の1つです。

しかし、メタリフレッシュの利用はHTMLの規格を定めるW3Cでは推奨されていません。また、Googleもメタリフレッシュをサポートはしていますが推奨しておらず、あくまで他のより適切なリダイレクトが設定できない場合の救済措置という位置づけです。
可能であればメタリフレッシュは避け、301リダイレクトを設定するようにしましょう。

参考
htmlのmeta refreshを使ったリダイレクト設定
リダイレクトとは?リダイレクトの種類と設定方法

robotsメタタグ(noindex, nofollowなど)

<meta name=”robots” content=”noindex”>

<meta name=”robots” content=”nofollow”>

robotsメタタグは検索エンジンにそのページの扱いなどを指示するためのものです。
主なrobotsメタタグには以下のようなものがあります。

noindex
そのページをインデックスすることを拒否する
nofollow
広告コンテンツなどの理由により、そのページからのリンクをたどらないように指示する
max-image-preview: [setting]
discoverなどに表示された場合の画像を指定します。[setting]部分はlargeを入れておくとよいかと思います。
nosnippet
そのページが検索結果に表示された際、スニペットを表示しないための指示。特別な理由がない限りおすすめしません。
max-snippet: [number]
[number]に数字を入れることでスニペットの最大文字数を制御することが可能ですが、あまり使用する機会はなさそうです
noarchive
設定しておくことで、検索結果にキャッシュが表示されないようになります。

Googleがサポートしているrobotsメタタグは以下も参照ください。
https://developers.google.com/search/docs/advanced/robots/robots_meta_tag?hl=ja

なお、BingもGoogleと同じようなrobotsメタタグをサポートしているようです。
https://www.bing.com/webmasters/help/which-robots-metatags-does-bing-support-5198d240

その他メタ要素でないタグ

要素でないものの、内に記述するコードとしてすでにタイトルタグを挙げましたが、他にもSEOに影響するものとしてcanonicalタグがあります。このタグは正規URLを指定する際に使用され、正規でないページはインデックスされたり検索結果に表示さたりしにくくなります。ただし、他のメタタグが検索エンジンなどに「指示」するものであるのに対し、canonicalタグはあくまで指標であり、検索エンジンが必ずしも従うとは限りません。

参考:canonicalタグの書き方と使い方

他に検索エンジン向けのコードとしては、構造化データが挙げられます。構造化データについては必ずしも内にあるものではありませんが、ユーザーには表示されないロボット向けのコードであるという点でメタタグと似た特徴があります。今後SEOにおいてますます重要性が高まっていくものと考えられます。
参考:構造化データとは?~HTMLを構造化する前に知っておきたいこと~

Web集客やSEOにはほとんど影響しないメタタグ

メタタグはユーザーではなくシステム向けのコードですから、システムがそのタグを解釈・使用していなければ意味がありません。

システム的な挙動にも、Web集客やSEOにも影響しない代表的なメタタグを2つ挙げます。

メタキーワード

<meta name=”keywords” content=”○○○,△△△,◇◇◇”>

ページのキーワードを記載するもので、かつて検索エンジンが参照していたことがありましたが、現在は使用されていませんので、設定する必要がありません。

著者

<meta name=”author” content=”○○○○○”>

ページの著者を表しますが、Googleが使用していたことはありません。なお、Googleは一時期、Google+を用いたrel=”author”(オーサーシップ)を検討していましたが、本格実装されることなく終了しており、その後Google+も終了しています。

いずれにしても、Googleは著者をメタタグなどコード1つで記載される単純なものとしては扱わないということになります。
一方で、「誰が作成したコンテンツであるか」ということは、SEOにおいてもますます重要になりますので、ページ内に著者を明示したり、構造化データを記載しておくなどの対応が求められます。

まとめ

メタタグによりWebページの内容や指示を適切にクローラーやブラウザに伝えることができます。SEOにおいてはコンテンツが最も重要であるということに疑いはありませんが、メタタグにより効果を一層高めることができるケースもあります。
ただし、使用法を誤ったり確認を怠ったりすると、ページがインデックスされないなどマイナス方向への影響が出る可能性もありますので注意が必要です。

執筆者 / 監修者

サクラサクマーケティング株式会社 取締役社長 COO

1980年生まれ 東京都稲城市出身、都立三鷹高等学校、専修大学文学人文科学を卒業後、2003年に学校関連の広告・出版を扱う株式会社JS コーポレーションに入社。

3年勤務した後に、学生時代より、ベンチャー企業への興味関心が高かったこと、より企業の課題解決に向き合っていきたいという想いから、WEB マーケティング業界へ転身。
2006年にSEM コンサルタントとして、インターネット総合代理店、株式会社オプトに入社。リスティング、ディスプレイ広告の運用から、SEOの施策提案など主にキーワードマーケティング領域に特化した業務に従事。

同年10月に、当時4名のベンチャー企業であった当社の役員と共鳴し、転職。入社後は、営業をはじめ、SEOコンサルティング、新規事業開発、自社マーケ、人事、財務と幅広い領域を経験し、営業部長、執行役員、取締役と経て、2015 年に社名変更とともに取締役社長に就任。

SEOコンサルタントとして大規模サイトから新規サイトまで、売上向上に繋がるコンサルティングを武器に200サイト以上の実績。9年連続でラスベガスで開催されるPUBCONに参加するなど海外の最新のSEO情報の収集にも尽力。
現在は、サクラサクラボの編集長、サクラサクラボチャンネルでの情報発信などの自社マーケティングを通じてBtoBマーケティングにも精通し、ここで培ったノウハウをもとにコンサルティングを展開。

3歳から現在に至るまで、サッカーを続けており、組織マネジメントにおいて、この経験値を大いに活用している。

◇ 情報発信
ねぎお社長のWEBマーケティングチャンネル
ねぎお社長Twitter
ねぎお社長Facebook
ねぎお社長Instagram
ねぎお社長linkedin
ねぎお社長note

◇ 掲載メディア
リスティングプラス様 - 【最新版】SEOコンサルティングのプロが語る、今後中小企業が取り組むべきSEO対策
シンフィールド様 - サクラサクマーケティング株式会社 取締役社長COO根岸 雅之氏に聞いた!SEO対策で最も重要なことを教えてください!

◇ 共催セミナー歴
オウンドメディアの成功事例とSEOを支える運用型広告の活用
今日から始められるWebマーケティング~コンテンツマーケティングとGoogle マイビジネス~
GMO TECH × サクラサク共催セミナー~テクニカルSEOとコンテンツマーケ~
リモート環境下においても売上・利益が成長し続ける組織創りと営業戦略

その他のブログ記事

Return Top