• 2025.10.28
  • SEO

メタタグとは?SEO対策に役立つ正しい書き方と種類を解説

メタタグとは?SEO対策に役立つ正しい書き方と種類を解説

メタタグとは、Webページの情報を検索エンジンやブラウザに伝えるためのhtmlタグです。メタタグはWebページの<head>~</head>内に記述され、ユーザーには直接表示されませんが、ページの概要や検索エンジンへの指示など重要な役割を果たします。

たとえば<meta name=”description” content=”ページの概要”>のように、content属性で内容を決定します。

メタタグを正しく設定すれば、検索エンジンにWebページの内容が正確に伝わり、検索順位の向上やユーザーのクリック率アップなどSEO面で良い効果が期待できます。逆に設定を誤ったり不足していたりすると、ページ情報が正しく伝わらず評価を下げてしまいます。こうしたミスを防ぐ対策が必要です。

本記事では、メタタグの基本的な書き方や設置場所を解説し、なぜSEO対策において重要なのかを説明します。さらに、SEOで特に重要な主なメタタグの種類や、設定後の確認方法、注意点についても紹介します。SEO対策の効果を実感できるように丁寧に説明しますので、ぜひ最後までお読みください。

メタタグとは

メタタグは、サイト運営者が検索エンジンやブラウザに対してページの情報や指示を伝えるために用いるタグです。これらは通常、htmlの<head>部分に記述されます。

例えば検索エンジンに対して「このWebページを検索結果に表示しないでほしい」(インデックスしない指示)や「このページの概要は〇〇である」(コンテンツの要約)といった指示を出すことが可能です。また、ブラウザに対して「このページではUTF-8という文字コードを使う」「スマートフォンではページ幅を画面サイズに合わせて表示する」といった指定もメタタグで行います。

このようにメタタグで情報を記述することで、検索エンジンのクローラーはページ内容を正確に理解できるようになり、ユーザーには最適化されたWebページが表示されます。メタタグはWebページの裏側で動く小さなパーツですが、検索エンジンにページの内容を伝え、ブラウザに表示方法を指示する重要な役割を担っています。重要な役割を担い、SEO効果にも直結しています。SEO対策の基本要素のひとつといえます。これらを効果的に活用する方法を理解しておくことが重要です。

メタタグの設置場所

メタタグはWebページのhtmlソースコードの<head>内に設置します。<br>どのように記述・設定するか、その方法を確認しましょう。

htmlファイルに直接記述する場合

自分でWebページのhtmlファイルを編集する場合は、該当するページのhtmlソースコードをテキストエディタで開き、<head>と</head>タグの間にメタタグを記述します。以下は簡単な方法の例です。


    <html>
    <head>
      <!-- メタタグはこの位置に記述 -->
      <meta charset="UTF-8">
      <meta name="description" content="ページの簡潔な概要をここに記述します。">
      <meta name="robots" content="index, follow">
    </head>
    <body>
      <!-- ページの本文 -->
    </body>
    </html>
    

上記のように、htmlファイルの<head>セクション内に<meta>タグを追加すれば、そのページにメタタグを設置できます。編集後はファイルをサーバーにアップロードし、変更を反映させましょう。正しく設置できればSEO効果にもつながります。誤記を防ぐ対策として、必ず表示確認を行いましょう。

CMSで設定する場合

WordPressなどのCMSを利用している場合、管理画面からメタタグ(タイトルやディスクリプション等)を設定できます。多くのCMSではWebページの記事ごとのタイトルや説明文を入力する欄が用意されており、適切な項目に内容を入力するだけで、自動的にページの<head>内にメタタグが挿入されます。これは最も簡単な設定方法の一つです。CMSの入力欄に書いたテキストは、自動的にcontent属性として反映されます。必要に応じてSEO対策用のプラグインを導入し、各ページのメタタグ(meta descriptionやOGP情報、robots指示など)を細かく設定することも可能です。コーディングの知識がなくても、CMSの設定画面からメタタグを管理できるため便利です。誰でも簡単に扱えることはSEO効果を広げる要因となります。運用上のミスを減らす対策として、プラグインの利用も有効です。

メタタグの書き方

Webページにメタタグを記述する基本的な書き方を押さえておきましょう。メタタグは<meta>というタグ要素で記述し、属性と属性値の組み合わせで情報を指定します。メタタグで主に使用される属性には以下のとおりです。

  • name

    メタ情報の種類を決定します(例: “description”, “viewport”, “robots”など)。

  • content

    対象となるメタ情報の内容を記述します。name属性と対で使われ、具体的な説明文や値をここに書きます。

  • charset

    ページの文字エンコーディング(文字コード)を決定します(例: UTF-8)。

  • http-equiv

    HTTPヘッダーと同等の指示を出す際に使用します(例: “refresh”や”Content-Type”の指定など)。

  • property

    OGP(後述)など、name属性以外のメタ情報を決定する際に使用します。

通常、メタタグではページに必要な情報に応じてこれらの属性を組み合わせて記述します。例えば、ページの説明文(ディスクリプション)を設定する場合は以下のように書きます。

<meta name=”description” content=”このページの内容を簡潔に説明するテキスト。”>

また、OGP用のメタタグでタイトルを指定する場合は次のようになります。

<meta property=”og:title” content=”記事のタイトル”>

このように、metaタグの中で適切な属性に対して必要な値を決定し、ページのメタ情報を記述します。メタタグ自体は開始タグのみで終了タグを持たない自己閉じタグである点にも注意しましょう。正しい書式はSEO効果を高めるための基本です。

なお、メタタグを含め、htmlのタグ名や属性名はhtml上では大文字・小文字どちらでも機能しますが、一般的には小文字で記述するのが慣例です。そのため、メタタグを書く際もタグ名・属性名は小文字で統一しておくとよいでしょう。

メタタグがSEO対策で重要な理由

では、メタタグがなぜSEO対策において重要なのか、その理由と活用方法を見てみましょう。

  • 検索エンジンにページ内容を正しく伝えられる

    メタタグを使ってページの概要や方針を記述しておくと、検索エンジンのクローラーに内容を理解してもらいやすくなります。例えばメタディスクリプションがあればページのテーマを明確に伝えられますし、不要なページにはメタタグで「インデックス不要(noindex)」と決定して検索結果に表示させないよう制御できます。メタタグによりページの情報が正確に伝われば、検索エンジンからの評価も向上しやすくなります。評価向上というSEO効果を期待できます。

  • 検索結果でのクリック率を高められる

    メタタグの一つであるメタディスクリプションは、検索結果ページに表示されるスニペット(ページの説明文)として使われます。ユーザーは検索結果でWebページのタイトルと一緒にこの説明文を読み、興味を引かれればそのページをクリックします。魅力的に見せる記述方法によってクリック率は向上します。ここで設定するのも、実際にはcontent属性に入れるテキストです。クリック率が上がれば結果としてサイトへの訪問者増加が期待でき、SEO的にも有利になります。クリック率低下を防ぐ対策としても有効です。

  • Webページの表示を最適化しユーザー体験を向上できる

    メタタグにはWebページの表示や動作に関わる重要なものです。例えば文字エンコーディングのメタタグを正確に指定しておけば文字化けを防止でき、ページ内容が正しく表示されます。また、ビューポート(viewport)のメタタグを設定すればスマートフォンなどモバイル端末での表示レイアウトが最適化され、ユーザーは快適にページを閲覧できます。ページ表示が適切でユーザー体験が良好であれば、結果的にサイトの評価向上や検索順位の維持・改善にもつながります。ユーザー体験を高めるための表示調整方法を把握しておくことが欠かせません。

以上のように、メタタグは検索エンジンへの情報伝達とユーザー双方に効果を発揮するため、SEO対策において欠かせない要素となっています。

SEO対策で重要なメタタグの種類

数あるメタタグの中でも、特にSEO対策で重要な代表的メタタグを紹介します。

これらのタグはいずれもhtmlの<head>セクションに記述します。

自分のWebページに最低限以下の項目が適切に設定されているか確認してみましょう。

タイトルタグ(Title)

タイトルタグはWebページのタイトル(見出し)を指定するためのタグで、SEOにおいて最も重要な要素の一つです。html上では<title>タグとして<head>内に記述され、ページの内容を象徴するテキストを設定します。検索エンジンの検索結果ではタイトルタグの内容が青いリンク文字列として表示され、ユーザーが最初に目にする部分となります。適切なタイトルにはページ内容を端的に表すキーワードが含まれており、検索エンジンにもページ内容を伝える役割を果たします。また、魅力的なタイトルを書けばユーザーの関心を引きクリック率向上につながります。タイトルタグはページごとにユニークで分かりやすい内容を記述し、ページのテーマを正確に反映させましょう。なお、タイトルタグも広い意味ではメタタグの一種とされており、特にSEO効果の大きい重要な項目です。

メタディスクリプション(meta description)

メタディスクリプションは、ページの概要を短い文章で説明するためのメタタグです。htmlでは<meta name=”description” content=”説明文”>の形式で<head>内に記述し、そのページの要約テキストを設定します。検索エンジンはこの内容を検索結果でタイトル下の説明文(スニペット)として表示することが多いため、ユーザーにページ内容を伝える重要な役割があります。メタディスクリプションを記述しておくと、ユーザーの興味を引いてクリック率向上に寄与します。ただし、過度に長い説明は検索結果では途中で切れてしまうため、一般的には120字程度までの簡潔な文章にまとめると良いでしょう。文字数や言葉の選び方といった記述方法を工夫することがCTR改善のポイントです。また各ページで内容に合わせたユニークな説明文を設定し、同じメタディスクリプションを複数ページで使い回さないことも大切です。

文字エンコーディング(charset)

文字エンコーディングを定めるメタタグは、ページで使用する文字コードを検索エンジンやブラウザに伝える役割を持ちます。例えばHTML5では<meta charset=”UTF-8″>と書くことで、そのページはUTF-8で符号化されていることを示します。同様に、文字コードをHTTPヘッダー風に指定する場合は http-equivcontent を組み合わせて記述します。正確な文字コードを定めておかないと、ブラウザで文字化けが発生したり、検索エンジンがページ内容を正しく認識できなくなったりします。特にUTF-8は世界中の言語を包括できる標準的な文字コードで、現在のWebページではUTF-8を指定するのが一般的です。逆に古い文字コード(例: Shift-JISやEUC-JPなど)を使っていると、一部環境で文字化けするリスクがあるため注意が必要です。文字エンコーディングのメタタグを正しく設定しておけば、ページのテキスト情報が正しく表示・認識され、結果的にコンテンツの品質維持やSEO評価の向上という効果につながります。

ビューポート(viewport)タグ

ビューポートのメタタグは、モバイル端末でのページの表示領域(レイアウト)を決定するためのタグです。<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>のように記述し、ページをデバイスの画面幅に合わせて表示することなどを指示できます。この設定をしておくと、スマートフォンやタブレットで閲覧した際に文字や画像の大きさが適切に調整され、ユーザーが拡大・縮小しながら閲覧する手間が減ります。ビューポートを正しく指定してレスポンシブデザインに対応することは、ユーザビリティ向上だけでなくSEOの観点からも重要です。Googleはモバイルフレンドリーかどうかをランキング評価の一つにしており、ビューポート未設定でモバイル表示に最適化されていないページは検索順位に悪影響を受ける可能性があります。モバイルファーストの現在、「モバイルフレンドリーによるSEO効果を得るためにも、全てのページにビューポート定めて入れておきましょう。

OGPタグ(Open Graph Protocol)

OGPタグは、SNSでページがシェアされた際に適切な情報(タイトルや説明、画像など)を伝えるためのメタタグ群です。主にFacebookやTwitterなどのSNS向けに用いられ、ページを共有したときに表示されるプレビュー内容をコントロールします。これはOGPタグを使った設定方法でコントロールします。

たとえば<meta property=”og:title” content=”〇〇”><meta property=”og:description” content=”△△”>のように、OGP用のproperty属性でタイトルや説明文、サムネイル画像URLなどを指定します。SNSで表示される情報はすべて content 属性の値に基づいて決まります。OGPタグを適切に設定しておけば、ユーザーがあなたのWebページをSNS上で共有した際に魅力的な紹介文や画像が表示され、クリックされる率が高まります。

直接的に検索エンジンのランキング要因ではありませんが、SNS経由のアクセス増加やシェアによる被リンク獲得にもつながり、間接的にSEO対策にも良い影響を与える可能性があります。拡散効果やブランディング効果を高めるためにも、OGPタグは重要な要素と言えるでしょう。

Robotsメタタグ(noindex・nofollow)

robotsメタタグは、検索エンジンのクローラーに対してそのページのインデックス可否やリンク追跡可否を指示するタグです。代表的な値として「noindex(このページを検索エンジンにインデックスさせない)」「nofollow(このページ内のリンクを辿らせない)」があります。htmlでは<meta name=”robots” content=”noindex”>のように記述し、必要に応じて組み合わせて使用します(例: content=”noindex, nofollow”)。

  • noindex(ノーインデックス)

    検索エンジンに対し「このページを検索結果に表示しないでほしい」と伝える指定です。重複コンテンツページや公開したくないページ(例: テストページ、管理画面など)にnoindexを付与してインデックスさせないことで、不要なページが検索結果に出るのを防げます。ページごとに適切に指定する方法を理解すれば、より効率的に制御できます。サイト全体として不要ページをインデックスさせないことは、結果的に有用なページだけが検索エンジンに評価されることにつながり、SEO上プラスになります。

  • nofollow(ノーフォロー)

    検索エンジンに対し「このページ上のリンクを辿らないでほしい」と伝える指定です。ページ内にユーザー投稿の大量のリンクや評価したくない外部リンクがある場合に、nofollowを設定することでクローラーがそれらのリンク先へ移動しなくなります。これによりリンク先への評価伝達(リンクジュース)が遮断され、外部サイトへの不要な評価流出を防ぐ効果があります。ただし、通常は重要な内部リンクや信頼できる外部リンクにはnofollowを付けないのが一般的です。nofollowを付与・除外する判断方法を誤らないことが大切です。 nofollowは特定のケースで補助的に使うメタタグですが、適切に使えばサイト全体の評価を保つ一助となります。評価を保つ効果が期待できます。

メタタグの確認方法

確認する方法はいくつかありますが、まずはブラウザから簡単にチェックできます。以下の手順でメタタグの記述を確認してみましょう。

  • 対象のWebページをブラウザで開く。

    確認したい自分のサイトのページを普通にブラウザで表示します。

  • ブラウザでページのソースコードを表示する。

    ページ上で右クリックし、メニューから「ページのソースを表示」を選択します(またはブラウザによってはCtrl+Uキーでソース表示できます)。すると、そのページのhtmlソースコードが新しいタブやウィンドウで表示されます。

  • head内のメタタグ部分を探す。

    表示されたhtmlコードの上部に<head>〜</head>セクションが存在し、その中に<meta …>と書かれた行が並んでいるはずです。そこに複数のメタタグ(charsetやdescriptionなど)が記述されているのを確認できます。自分が設定した内容が正しく反映されているか、内容やスペルに誤りがないか確認しましょう。

    上記の方法で、ページごとにメタタグが正しく設定されているかを閲覧者目線でチェックできます。また、SEOツールやブラウザ拡張機能を使えばメタタグを一覧表示してくれるものもありますが、まずは手軽にブラウザのソース表示機能を活用して確認してみてください。こうした確認作業自体もSEO効果を維持するために重要です。

メタタグを設定する際の注意点

最後に、メタタグを扱う上で押さえておきたい注意点をいくつか紹介します。

  • メタタグの設定だけでSEO対策が完了するわけではない

    メタタグはSEO対策上重要な基本要素ですが、それだけで検索順位が劇的に上がるものではありません。メタタグを適切に設定することは土台として大切ですが、同時にコンテンツの質の向上や内部リンク構造の最適化、外部対策など総合的なSEO施策にも取り組む必要があります。メタタグを設定しただけで安心せず、サイト全体の改善を継続して行いましょう。

  • メタタグは必ず<head>内に正しく記述する

    メタタグを記述する場所はhtmlの<head>セクション内と決まっています。誤って<body>内に書いてしまうと検索エンジンはそのメタタグを認識できません。また、メタタグの属性名や値にスペルミスがあると効果が得られないため注意が必要です。例えば「description」を「descriptiom」と誤記すると正しく機能しません。メタタグは指定されたフォーマットどおりに、漏れや誤りのないよう記述しましょう。正確な記述がSEO効果を発揮させる前提になります。特に属性名や値の書き方方法を確認することが欠かせません。

  • メタキーワード(meta keywords)タグは設定しなくてもよい

    かつては<meta name=”keywords”>にページの関連キーワードを列挙する習慣がありましたが、現在では主要な検索エンジン(GoogleやYahoo!等)はmeta keywordsというメタタグをランキング評価に使用していません。そのため、無理にメタキーワードを設定する必要はありません。それよりもページ本文にユーザーのニーズに応える有益な内容を盛り込むことに注力しましょう。検索エンジンはページの実際の内容を重視して評価します。適切なコンテンツ作成が最もSEO効果をもたらします。

まとめ

メタタグはWebページの裏側で検索エンジンとユーザー双方に情報を伝える重要なパーツです。基本を理解してメタタグを適切に設定することで、SEO対策の土台をしっかり固めることができます。まだメタタグの設定が不十分な場合は、この機会に自身のサイトのメタタグを見直してみましょう。タイトルやディスクリプションなどのメタタグを正しく活用すれば、検索エンジンからの評価向上やユーザーからのクリック率改善に繋がります。地道な対策ですが、メタタグを正しく整備することがサイト全体のSEO対策の底上げにつながります。基本を疎かにせず、できるところから確実に施策を進め、Webページの価値を高めていきましょう。具体的な設定方法を理解しながら施策を進めることが大切です。確実に施策を進めることがSEO効果を長期的に発揮させる鍵です。

WRITER

複数メディアのSEO対策担当者を8年以上経験。SEO知識の他に、健康、脱毛、恋愛、コンプレックスなどのジャンルも得意。これまで500本以上のコンテンツ制作と上位表示実績を持つ。
キーワード選定からライティングまでを一貫して行うため検索意図を把握する能力が高い。

メタタグとは?SEO対策に役立つ正しい書き方と種類を解説

この記事が気に入ったら
いいね!しよう

TOP