meta情報(metaタグ)とは?書き方やSEOへの影響を解説 | WEB集客ラボ byGMO(GMO TECH)
SEO/SEM

meta情報(metaタグ)とは?書き方やSEOへの影響を解説

meta情報(metaタグ)とは?書き方やSEOへの影響を解説

「meta情報(metaタグ)の設定は難しい」などと考え、meta情報(metaタグ)を設定したほうがいいと思いながらも後回しになってはいませんか。

そもそも、「meta情報(metaタグ)は何のために設定するの?」と用途を知らない人もいるでしょう。

meta情報(metaタグ)は直接的なSEO効果はないものの、サイトのユーザビリティやクリック率の向上が期待できる大切なSEO対策です。
そこで、この記事ではmeta情報(metaタグ)の概要や書き方、SEOへの影響について詳しく解説していきます。

「meta情報(metaタグ)を正確に設定して、サイトのクリック率を上げたい!」という人は、この記事をぜひチェックしてみてください。

SEOに悩むサイト担当者必見!世界最高水準のテクニカルSEOツール「Lumar」
Lumar

URLを入れるだけでサイト内部の問題を一括検出。
Googleと同じ視点でサイトクロール
大規模サイトでも手軽に高度なSEO分析ができます!

まずは無料デモクロールを試して、あなたのサイトの問題点を一括検出!

meta情報(metaタグ)とは?

meta情報(metaタグ)とは、検索エンジンやブラウザにWebページの情報を伝えるHTMLタグの1つです。

具体的にはHTMLの<head>内に記述し、文字コードの指定やインデックスの可否などの指示を出します。

また、タイトルやディスクリプションの設定を適切に行えば、ユーザーの目を惹きつけクリック数の増加に繋げることも可能です。

直接的なSEO効果についてはGoogleが言及していないものの、クリック率の向上が期待できるため間接的なSEO効果があると言えます。

metaタグに期待できるSEO効果5つ

  1. 文字化けを防ぎ内容を正しく伝えられる
  2. 検索結果に表示されページの内容を正しく伝えられる
  3. クローラーのアクセス制御ができる
  4. デバイスに合わせた画面設定で見やすくできる
  5. SNSにシェアされた時の表示の制御ができる

metaタグに期待できるSEO効果としては、上記の5つが挙げられます。

SEO対策では、これから紹介するmetaタグのSEO効果を事前に理解した上で取り組んでみてください。

1. 文字化けを防ぎ内容を正しく伝えられる

metaタグを用いると、文字化けを防いで内容を正しく伝えることができます。

metaタグを用いることで、ブラウザに対して文書の状態、コンテンツの言語や文字のコーディングが伝えられ、検索エンジンのクローラーに情報を滞りなく伝えられるためです。

検索エンジンのクローラーに情報が適切に伝わると、検索エンジンからウェブサイトを正当に評価されるようになり、検索結果の上位表示が狙えます。文字化けを防ぐ、検索エンジンのクローラーに正しく情報を読み取ってもらう、そのためにもmetaタグは正しく活用しましょう。

2. 検索結果にページの内容を表示できる

metaタグを活用すると検索結果に説明文を表示することができるため、ユーザーにあらかじめページの内容をより詳しく伝えられます。

検索エンジンの検索結果ページには、サイト(ページ)のタイトルと説明文が表示されますが、その説明文の内容はmetaタグで指示することが可能です。metaタグを設定してない場合は、サイト(ページ)の冒頭の文章が表示されます。

ユーザーがクリックしたくなるような訴求力のある文章を載せた方が、サイトを実際に見てもらえる確率は高くなります。metaタグを適切に設定して、有効活用するとよいでしょう。

3. クローラーのアクセス制御ができる

metaタグを利用することでクローラーのアクセス制御も可能になります。

Googleではクローラーが探した情報が検索結果に表示されますが、ウェブページの内容によっては検索結果に表示されるべきではない内容のものがあります。

例えば、会員限定ページなど特定の人にしかアクセス権限のないサイトや、公開前のテストページなどは検索結果には表示されない方がよいでしょう。

こうした場合、クローラーを受け付けない機能を持つmetaタグを設定することで、クローラーのアクセス制御が可能となります。

4. デバイスに合わせて見やすい画面設定ができる

metaタグを使うことで、ユーザーが閲覧するデバイスに合わせた画面表示が可能になります。

サイトはPCの画面サイズだけではなく、画面の縦横比率も異なるモバイル(スマートフォン)でも見られるため、どちらで見る場合においても快適に閲覧できる必要があります。

特にGoogleでは、モバイルでの閲覧環境を重視するモバイルファーストインデックスという評価基準があり、モバイルの閲覧環境もおろそかにはできません。

通常、サイトはPCで作成されますが、metaタグを利用してPCとスマホそれぞれに合わせたレスポンシブな表示を設定しておくことで、どちらのユーザーにも見やすいページが作れます。

5. SNSにシェアされた時の表示の制御ができる

metaタグを利用して、SNSでシェアされた際の表示の内容を制御することができます。

ウェブサイトをSNSにシェアすると、デフォルトで画像やページタイトルと簡単な説明文が出てきます。これらは、URLの入力によって自動で表示される仕組みです。

そのため、しっかり指定をしておかないとページ上のランダムな画像が利用されたり、ページの主旨とは異なる部分の文章が説明文として抜粋されたりすることもあります。

metaタグを使えば、ユーザーの興味を引くような画像や説明文を指定できるので、シェアされることでさらなるアクセスの増加が期待できます。ユーザーからサイトに興味を持ってもらいクリック率を上げるためにも、metaタグの利用は効果的に行うことが大切です。

meta情報(metaタグ)の6つの要素と書き方

meta情報(metaタグ)の代表的な要素には「タイトルタグ」「ディスクリプション」「文字コード」「OGPタグ」「ビューポートタグ」「noindex、nofollow」の6つが挙げられます。

間違えて設定するとSEOに悪影響を与える可能性があるので注意が必要です。

それぞれのタグの書き方を記載しているので、必要なタグをコピペして使用してみてください。

1.タイトルタグ

<title>Webページのタイトル</title>

タイトルタグはWebページのタイトルを設定します。

ページタイトルの内容によってクリック率が左右されるので、最も重要なmeta情報(metaタグ)と言っても過言ではありません。

タイトルを読んで、このページにはどんなことが書かれているのかがひと目でわかるタイトルが望ましいです。

さらに、検索キーワードを必ず入れてユーザーの目を惹くことも大切です。

タイトルタグはユーザーにページの内容を知らせるだけではなく、検索エンジンにもコンテンツ内容を知らせる重要な役割を果たしています。

2.ディスクリプション

<meta name=”description” content=”ページの概要”>

ディスクリプションはWebページの概要を検索エンジンに知らせるタグです。

検索結果のタイトルの下に表示されているページの説明文は、このディスクリプションに記述された文章が表示されたものです。

先ほど紹介したタイトルタグと同じように、検索結果を見たユーザーがページをクリックするかどうかを判断する材料として使うケースが多いため、重要な要素になります。

ディスクリプションに記述する文章はユーザーにわかりやすいテキストが好ましいので、Webページの概要を簡潔に要約した文章を記述するようにしましょう。

ただし、スニペットに表示される文章は検索キーワードをもとに検索エンジンが自動的に抽出した文章です。

そのため、Webページにマッチしていない文章をディスクリプションに記述した場合は表示されない可能性もあるので、注意してください。

3.文字コード

<meta charset=”utf-8”>

文字コードの設定とは、Webページの文字をどのように表示するのかを設定することです。

コンピュータが認識するために、文字や記号には数字が割り当てられています。この文字コードを指定しなければ、日本語で作成したサイトに英語版ブラウザからアクセスした場合に文字化けが起こる可能性があります。

実際に設定するときは<head>の直下に記述してください。

日本語サイトの場合は、世界共通のUnicode「utf-8」や日本語の文字コード「Shift-JIS」を使用するケースが多いです。

4.OGPタグ

  • <meta property=”og:url” content=”ページのURL”/>
  • <meta property=”og:type” content=”ページの種類”/>
  • <meta property=”og:title” content=”ページのタイトル”/>
  • <meta property=”og:description” content=”ページのディスクリプション”/>
  • <meta property=”og:site_name” content=”サイト名”/>
  • <meta property=”og:image” content=”サムネイル画像のURL”/>

OGPタグは、SNSにWebページをシェアしたときにページのURLなどを正しく表示させて目立たせるために設定します。

例えばTwitterやFacebookなどでWebページの情報がシェアされると、ページのURLやページタイトルが視覚的に目につくようにサムネイルが表示されますよね。

反対にOGPタグの設定をしないと、せっかくシェアされたとしても目立つことなくスルーされる可能性があります。特に、SNSからの流入を伸ばそうと考えているサイトはしっかりと設定するようにしましょう。

上記のタグのようにOGPタグは種類が多いですが、全て設定する必要はありません。表示させたい要素をコピペして、content以降の「” “」の中を編集するだけで完了です。

5.ビューポートタグ

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

ビューポートタグは、スマホやタブレットなどのモバイル端末でもWebページを適切なサイズで表示させるための設定です。

ビューポートタグを適切に設定するとWebサイトがレスポンシブウェブデザインになり、デバイスサイズに応じた表示ができるようになります。

現代はスマホでWebサイトを閲覧する人が多くなっているため、Googleもモバイルファーストインデックスを推進しており、レスポンシブウェブデザインを推奨しています。

このようにWebサイトはスマホやタブレットなど、どのデバイスでも表示されるように設定することが必須です。

ビューポートタグをしっかり設定して、スマホへの対応を行いましょう。

参考元:モバイルファーストのインデックス登録について|Google検索セントラルブログ

6.noindex,nofollow

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

noindexとnofollowは、Googleのクローラーを制御するためのmeta情報です。

noindexは「検索結果に表示しないでください」という意味で、nofollowは「ページのリンクを辿らないでください」という意味になります。

低品質なページや内容が重複しているページなどをインデックスしないことによって、SEOのマイナス評価を避けることが目的です。

しかし、間違えて設定してしまうとページが表示されなくなるので、慎重に設定する必要があります。

meta情報(metaタグ)の確認方法

meta情報(metaタグ)は、HTMLドキュメントを開いて確認します。

  • 対象のページを開いて、右クリックする(Macの場合はCtrlキー+クリック)
  • 「ページのソースを表示」をクリックする

上記の操作でHTMLドキュメントが表示されます。

meta情報(metaタグ)は<head>内にあり、特に文字コードタグは<head>の直下に記述されています。

そのため、その他のmeta情報(metaタグ)も<head>の近くに記述されていることが多いです。

先ほど紹介した操作ですぐに見ることができるので、設定する前に他サイトのHTMLドキュメントを開いて参考にするといいでしょう。

meta情報(metaタグ)のSEOへの影響

meta情報(metaタグ)はGoogleの検索アルゴリズムに記載はあるものの、検索順位の変動には大きな影響はありません。

ただし、タイトルタグやディスクリプションはユーザビリティやクリック率に大きな影響があります。

理由は、検索結果が表示されたときに最初にユーザーの目に触れる情報だからです。実際に検索結果が表示されたとき、ページのタイトルとその下の説明文を読んでクリックするかどうか決めますよね。

このようにタイトルタグやディスクリプションはユーザーがクリックするかどうかに大きく関わる部分です。そのため、meta情報(metaタグ)は直接的なSEOへの影響はありませんが、間接的な影響があるので重要なSEO対策と言えます。

meta情報(metaタグ)を設定する際の2つのポイント

meta情報(metaタグ)を設定する際のポイントは、下記の2つが挙げられます。

    • 現在メタキーワードは高いSEO効果を持たない
    • meta情報(metaタグ)はあくまでも補助対策

SEOに直接影響はないmeta情報(metaタグ)ですが、間接的に影響を与える場合があるので、ポイントを抑えて正確に設定することが大切です。

1.現在メタキーワードは高いSEO効果を持たない

10年以上前にはSEO効果があると言われていた「メタキーワード」ですが、現在はSEO効果がありません。

理由は2つあります。1つ目はメタキーワードがSEO対策で悪用されていたこと2つ目はGoogleのクローラーがアップデートされ悪用を見抜けるようになったことです。

実際に10年以上前のGoogleのクローラーはメタキーワードに設定されたキーワードとページ内のキーワードの違いを見抜くことができませんでした。

しかし、Googleのクローラーは進化しメタキーワードの乱用を見抜けるようになっています。

また、Googleは「検索ランキングでメタキーワードを使用することはありますか?」という質問に対して、「使用していません。GoogleのWeb検索ではメタキーワードが完全に無視されます」と答えています。

このように現在の検索ランキングではメタキーワードは完全に無視されるので、SEOに影響することは考えられません。

もしメタキーワードの設定が残っているとしても、Googleはメタキーワードを認識していないので、メリットもデメリットもないと言えるでしょう。

しいて言えば、そのページで注力しているキーワードが競合に漏れてしまうことがデメリットと言えます。

引用元:Googleはウェブランキングにキーワードメタタグを使用しません|Googleセントラルブログ

2.meta情報(metaタグ)はあくまでも補助対策

meta情報(metaタグ)は、あくまで補助対策として考えるのがベターと言えます。なぜなら、先述したように直接的なSEOへの影響がないからです。

つまり、meta情報(metaタグ)の影響で検索順位が下がることはありません。

だからと言って疎かにしてしまうと、ユーザビリティが低下しクリック率が下がる可能性があります。

検索結果で上位に表示されてもクリックされなければ意味がないので、SEO効果がないとわかっていてもタグは正確に設定しましょう。

metaタグを生成するおすすめ2ツール

  • メタタグ(meta tag)作成ツール
  • メタタグ自動生成・メタタグ自動作成ツール

metaタグを生成するおすすめの2ツールを紹介します。

項目などが指定されているため、必要事項を書き込めばタグが自動生成されますので、書き忘れなども発生せずコピペすればすぐに利用できます。

1. メタタグ(meta tag)作成ツール

メタタグ(meta tag)作成ツール

画像引用:メタタグ(meta tag)作成ツール

メタタグ(meta tag)作成ツール​​は、必要事項を記入することで文字コード、サイトタイトル​​、説明文​​、検索エンジン制御でよく使われるmetaタグを生成してくれるツールです。

利用可能な項目は少ないですが、フォームに必要な項目を記入・チェックしていくだけで、簡単にDiscriptionタグや検索エンジンクローラーのロボット制御に関するmetaタグの記述を行えます。

設定できる項目はすくないのですが、手軽にmetaタグを生成したい場合におすすめです。

2. メタタグ自動生成・メタタグ自動作成ツール

メタタグ自動生成・メタタグ自動作成ツール

画像引用:メタタグ自動生成・メタタグ自動作成ツール

メタタグ自動生成・メタタグ自動作成ツールとは、ドキュメントタイプ・言語・説明文・OGPなど全てのメタタグの中から必要なものに情報を入力することでmetaタグの生成が可能なmetaタグ作成ツールです。

メタタグ(meta tag)作成ツールに比べて入力項目が多いので、一見使いにくそうに見えるかもしれません。しかし、設定が難しいmetaタグであっても必要な項目を記入し、選んでいくだけでメタタグを自動生成してくれるため、とても便利なツールと言えます。

より多くの項目を設定したい場合におすすめです。

まとめ

今回は、meta情報(metaタグ)の概要や書き方・SEOへの影響について解説しました。この記事で解説したようにmeta情報(metaタグ)にはSEO効果がないので、あくまでも補助対策の1つです。

しかし、サイトのユーザビリティやクリック率の向上には効果的な面もあります。Webサイトは、ユーザーにクリックされコンテンツを読んでもらわなければ、何の意味もありません。

HTMLの設定などは面倒くさいと思われがちですが、サイトを運営するうえでは重要なSEO対策の1つと考えて取り組むことをおすすめします。

SEO対策でビジネスを加速させる「SEO Dash! byGMO」
seo-dash!bygmo

SEO対策でこんな思い込みしていませんか?

  • 大きいキーワードボリュームが取れないと売上が上がらない・・
  • コンサルに頼んでもなかなか改善しない
  • SEOはコンテンツさえ良ければ上がる

大事なのは自社にあったビジネス設計です。
御社の課題解決に直結するSEO施策をご提案します

無料資料請求はこちら

プロフィール
大澤 健人(おおさわ けんと)
GMO TECH株式会社 大澤 健人(おおさわ けんと)大澤 健人(おおさわ けんと)のFacebook
2012年より一貫して検索エンジン領域のコンサルティング業務に従事。 2017年にGMO TECH社に参画。営業組織の構築、新商材開発、マーケティング部門立ち上げをおこなう。 現在、MEOコンサルティング、SEOコンサルティング、運用型広告などSEM領域全体を統括し、 お客様の期待を超える価値提供を行うため日々、組織運営・グロースに奔走している。
CONTACT US

デジタルマーケティングに関することならお気軽にご相談ください

メルマガ登録

メールマガジンはこちらからご登録ください。

デジタルマーケティングに関するホットな情報をお届けいたします。

フォームからのお問い合わせ

GMO TECHへの業務依頼、発注を希望される方はこちらよりご連絡ください。

Please click to see profile.
dark_typeA_115x57.png