“メタディスクリプション”は、めちゃめちゃ大事だと思うよ

“メタディスクリプション”(meta description)とは、検索エンジンにページの概要・要約を端的に伝える説明文です。

HTMLの<head></head>要素に挟まれたページ情報のエリアで、読者の目に触れないロボット用の情報です。

具体的には、meta要素の中の、name属性で定義される、description(説明文)で、ページの概要・要約を示します。

<meta name="description" content="120文字程度の説明文"/>

ちょっと古いけど→W3C,Meta Element, HTML Attribute

ロボット用の情報と言っても、人が読める形で記述でき、そのまま検索結果に使われたりします。

当ブログの場合、使われたりしますどころではなく、こちらが準備した説明文をほぼ確実に検索結果の説明文(スニペット)に使ってくれています。

1万文字の超大作記事でも、100文字程度の軽い記事でも、読者がクリックするかどうかは、5行程度のスニペットを読んで決めるのです。

そしてそのスニペットは、メタディスクリプションが使われやすいのですから、大事に決まっているじゃないですか?

スニペットって何?

まずはじめに、スニペットって何よ?っという人は、↓下図オレンジ枠内↓です。

スニペットとは
スニペットとは

私は、ウェブ検索結果のスニペットを読んでクリックするかどうかを決めます。

タイトルは、どの記事も限られた文字数の中にキーワードを散りばめているため、似たり寄ったり。

どの記事が最も良さそうか?
スニペットを読まないと違いが分かりにくく、クリックするかどうか決められないのです。

タイトルとスニペットを読んでも欲しい情報が見つからない場合、検索用語を変更します。自分が個人的にクリックしないで、次へ進むことを選ぶので、当ブログでは丁寧に説明文を作っています。

もちろんタイトルに釣られることもありますケドね。

では、スニペットはどのように作られるのでしょうか?

スニペットはページのコンテンツとメタディスクリプションでつくられる

いやいや、コンテンツとメタディスクリプションじゃない部分の方が少ないから。

っと、ぶつくさ言いたくなってしまいますが…

サーチコンソールの検索アナリティクスで掲載順位が高かったページのスニペットを確認してみたら、ほとんどがメタディスクリプションから引用されていました。言い方を変えると、本文から拾った記述がみつかりませんでした。

作っておけば、使ってくれる。
そんな印象です。

メタディスクリプションにどんなことを書くの?

最もよく見かけるのはリード文です。導入の2-3行をそのまま説明文にすることで、「つかみ」ます。答えは書いていないので、読者としての私は簡単に釣られ、クリックしたくなります。ページを開いた後、まったく同じ文が出てくることで、ちょっとした安心感を感じたりします。

筆者としての私は、出来るだけ結論まで書くようにしています。スマホ版やAMP版では、そこまで表示されないのが残念ですが、本文の記述を使いながらも、ストーリーを網羅できるようにと心がけています。

検索されたキーワードと合致する文字列は太字で表示されますから、キーワードを散りばめるのも良いかもしれません。SEOプラグイン「Yoast」のアドバイスに従って、1記事1つのフォーカスキーワードを決めており、私自身は、メタディスクリプションでも1個だけですが…

あとは「招待状」のつもりでご案内を出すと気持ちがこもります。

Googleのmeta descriptionに対するスタンス

2017年6月5日に、下記の様な案内がありました↓

Googleのウェブマスター向け公式ブログ「ユーザーに役立つ検索スニペット

DMOZの終了にともない、GoogleもスニペットにDMOZのリスティングを使用することを停止しております。そのため、ウェブマスターの皆様から、ページにコンテンツを追加できない場合には、適切なメタディスクリプションを提供していただくことがより重要になりました。

この案内がくるまで、DMOZの何たるかを知らなかったわけですが、メタディスクリプションの手書きになれると他のモノの影響は最小限にしたくなるので、サービス停止は好都合でした。

メタデータ、メタタグって何?

HTMLの<head></head>要素の中は、ページタイトル、ページ言語、スタイルシートへのリンク、構造化データなどで構成されています。

title、base、link、style、script要素で定義されないものがmeta要素、いわゆるメタタグで定義されます。

メタタグのすべてが検索用の情報というわけでもなく、また逆に検索エンジンが全てのメタタグを参考にしているわけではありません。

サーチコンソールのヘルプGoogleがサポートしているメタタグに詳細がありますが、グーグルがサポートしているメタタグの中でも、メタディスクリプション(meta description)は、リストの最初の項目です。

大事、大事。

メタディスクリプション(meta description)の文字数

以前は100~120文字程度で、3行程度のスニペットが表示されたりしていましたが、最近は5-7行ぐらいのスニペットも見かけます。

Googleのウェブマスター向け公式ブログ「ユーザーに役立つ検索スニペット


メタディスクリプションに文字数制限はありますか?

メタディスクリプションの長さに制限はありません。ただし検索結果のスニペットは必要に応じて切り詰められます(端末の幅に合わせる場合など)。

私が使用しているSEOプラグイン「Yoast」では、(2018年2月3日更新)120文字~300文字がグリーン(推奨)です。300文字って、短い記事に相当するじゃん…

モバイルやAMPのスニペットはそれより短いので、なんだかだいっても最初の行が勝負どころですな。

メタディスクリプションってどこに書くの?

メタディスクリプションは、本文とは異なるものですから、記述場所が別に準備されていることが多いです。

私が使ったことがあるブログプラットホームでの記述場所をメモしておきます。ワードプレス、Blogger、Seesaa、FC2です。

ワードプレスのメタディスクリプション

ワードプレスは、標準ではmeta descriptionを吐き出す仕様になっていないようです。SEOプラグインを入れたり、採用するテーマに入っていたり、自分でカスタムフィールドを設定したり、いろいろみたいです。

私は、SEOプラグインYoastのmetaボックスを使っています。

Yoastでmeta description

Yoast, meta description
Yoast, meta description

プラグインを入れると、記事の編集画面に現れますから、ここに記述します。

全角ひらがなで、120~300文字がグリーン圏です。

Bloggerのmeta description

Bloggerでのメタタグ設定は、2ステップというか、2種類です。

ステップ1は、設定→検索設定→メタタグ→有効にする→保存で、「検索向け説明」を有効にすると、投稿編集ページに専用ボックスが現れます。

この設定画面で指定した説明はホームの説明に使われます。

Blogger meta description step-1 setting
Blogger meta description step-1 setting

ステップ2は、各ページごとの個別設定です。

記事ごとのmeta descriptionは、記事編集ページのサイドバーの「検索向け説明」で指定できます。

Blogger meta description step-2 articles
Blogger meta description step-2 articles

Seesaaブログのmeta description

Seesaaのmeta descriptionの標準設定は、記事タイトル+ブログ名+サイト説明文っぽいです。これでは記事ごとのスニペットを自由に変えられないので、下記の様なカスタマイズができます。(もう使っていないけど)

ステップ1、デザイン→デザイン設定→デザイン設定(変更したいデザインをクリック)→HTML編集で、メタディスクリプションを探します。

Seesaa meta description - step-1 setting
Seesaa meta description – step-1 setting

ステップ2、メタディスクリプションのコードをOGP用の説明文の抜粋に置き換える

<meta name="description" content="<% article.get_excerpt | nl2br | tag_strip | xml | inside_comment | text_summary(240) -%>" />

これはOGP用などとされていますが、240文字ぐらい入るっぽいので、meta descriptionにも転用しました。ソーシャル用と違う文を準備したい場合は、他の手を考える必要がありそうですけどね。

後は、記事を書くときに、「ページの記事概要」を書いておけばOK。

Seesaa meta description - step-2 articles
Seesaa meta description – step-2 articles

FC2のmeta description

FC2で出来るのは、記事の最初の200文字を要約文として使うことです。メタディスクリプション専用の記述はできません。

エリア変数を指定してすることで、記事ページでのみmeta descriptionを掃き出すようにしました。

私が使っているコードは下記のとおりです。
<head></head>のどこかに貼り付けます。

<!–permanent_area–><!–topentry–>
<meta name=”description” content=”<%topentry_description>” />
<!–/topentry–><!–/permanent_area–>

いや~。なんとも地味~な努力ですね。

コメントを残す

メールアドレスが公開されることはありません。