PR

【HTML】meta description（メタディスクリプション）とは？設定方法、書き方、文字数等を解説！

WEB制作技術系
2023.06.03

meta description（メタディスクリプション）は、検索エンジンでページタイトルとともに表示され、クリック率に大きく影響する重要な要素です。

今回の記事では、meta descriptionの設定方法や書き方、文字数を解説します。また、テンプレートや反映されない場合の対処方法も併せてご紹介します。

本記事を読む事で、正しく設定できるようになるはずです。

meta description（メタディスクリプション）とは？

meta description（メタディスクリプション）とは、そのページについての概要文を書く部分です。

覚えておいてほしいポイントとしては、下記の通りです。

・表示される文字数はPCだと120文字、スマホだと70文字前後
・SEOに大きく影響しない
・クリック率に影響大
・検索したキーワード部分が太字になる

表示される文字数は、PCだと120文字、スマホだと70文字前後です。SEOには大きく影響しないと言われていますが、目に入る部分なので、「読んでみたい！」と思わせるような概要文を設定する事で、クリック率に影響が出ます。また、検索したキーワードが太字で表示されるのも特徴です。

お助け猫
お助け猫

「クリック率に影響が出る」というのが注目ポイントです！

下記画像では「メタディスクリプション 書き方」で検索をした結果です。

検索結果イメージ画像

赤枠で囲まれている部分が、meta descriptionで設定された部分になります。

※ちなみに設定しなかった場合、ページ冒頭のテキストの一部が抜粋され、検索結果に表示されます。

meta descriptionの設定方法

meta descriptionの設定方法をご紹介します。今回は、使用するケースが多いであろう、HTMLファイルに直接書く場合と、 WordPressテーマの「Cocoon」の場合の設定方法のご紹介です。

HTMLファイルに直接書く場合

HTMLファイルに直接書く場合は、headタグ内に記述します。

<head>
  <meta charset="utf-8">
  <!-- ↓これ -->
  <meta name="description" content="ページの説明が入ります">
  <title>練習用ページ</title>
</head>

metaタグと一緒に、name属性とcontent属性を使って書きます。name属性の値には「description」を、content属性の値には「ページの概要」を入力します。

Cocoonの場合

WordPressテーマの「Cocoon」を使用している方は、ページの編集画面の下の方に、「メタディスクリプション」という項目がありますので、そこに概要文を入力してください。

cocoonの場合のmeta description設定画面

書き方と文字数について

冒頭でも、meta descriptionの概要文次第で「クリック率に影響する」と紹介しました。

概要文を作る際の、書き方と文字数のポイントは下記の通りです。

概要文を作る際のポイント

・キーワードを入れる
・文字数は100〜120文字前後
・全ての各ページに個別に設定する

キーワードを入れる

検索結果上に検索されたキーワードが太字で表示されるため、ユーザーからの視認性が上がります。

また、検索したキーワードが概要文の中に入っていれば「悩みを解決できる記事かも！」と認識され、サイトを訪れるきっかけにもなるでしょう。

文字数は100〜120文字前後

表示される文字数はPCだと120文字、スマホだと70文字前後になるので、「100〜120文字」が妥当です。

全ての各ページに個別に設定する

Googleでは、すべてのページに個別のメタディスクリプションを設定することを推奨しています。

サイトのすべてのページについて同じ説明または類似する説明をしても、個々のページが検索結果に表示されたときに役に立ちません。個々のページを正確に表す説明を記述してください。

Google検索セントラルより引用

やはり、視覚の面で有効のため、Googleも推奨しているのかもしれませんね。

テンプレートのご紹介

お悩みさん
お悩みさん

毎回、概要文考えるの大変だな。テンプレートないかな？

そんな方のために、筆者オリジナルのテンプレートをご紹介します。

本記事では、〇〇について解説しています。〇〇な方や、〇〇でお悩みの方は、必見です。

当然、内容によって大きく変える場合もありますが、基本の形はこれです。

「何が書かれているのか」「どういう方向けの記事なのか」「行動を促す」。この3点を意識して、筆者は設定しています。

反映されない場合

meta descriptionを設定したにも関わらず、上手く反映されない場合は、下記を確認してみてください。

反映されない場合

・Googleが内容を不適切と判断している
・テーマ、プラグインを確認する

Googleが内容を不適切と判断している

実は、Googleは、最も適切と判断したページ概要を表示する場合もあり、設定したmeta descriptionが必ず表示されるわけではありません。

しっかりと表示させたい場合は、ページとmeta descriptionの内容が合っているかや、文字数（120文字前後）は適切かを確認する必要があります。

テーマ、プラグインを確認する

実は、筆者もmeta descriptionを設定したのにも関わらず、上手く反映されない時期がありました。

原因を探していたところ、テーマとプラグインの相性が原因でした。筆者の場合、「Cocoon」というWordPressテーマと「All in One SEO」というプラグインの相性が良くないのが原因でした。

テーマの方にも、プラグインの方にも、meta descriptionの設定機能が備わっている場合、設定が重複してしまって、上手く反映されない場合があります。

対処法としては、All in One SEOを削除してテーマの機能を活用するか、WordPressテーマのメタディスクリプションタグを削除することで対応できます。

まとめ

今回は、meta description（メタディスクリプション）について解説しました。

クリック率にも大きく影響が出る大事な部分ですので、ぜひポイントを押さえていただければ幸いです。

コメント

タイトルとURLをコピーしました