『どうやったら意図したディスクリプションが表示されるの?』
こういった疑問に答えます。
本記事の内容
- ディスクリプションが書き換えられてしまうワケ
- data-nosnippet属性で、ある程度制御する
Webエンジニア歴2年1ヵ月
WordPressの運営&立ち上げ70サイト以上かかわっている
こういった私が解説していきます。
1. ディスクリプションが書き換えられてしまうワケ
- その①:googleがユーザーに最適なように書き換えるから
その①:googleがユーザーに最適なように書き換えるから
こちら側で設定をしていても、『ユーザーにとって最適ではない!』とgoogle側に判断され、書き換えられてしまうからです。
また、設定したディスクリプションが、ユーザーの検索意図や、サイトのコンテンツと合っていない場合に起きてしまうかもしれません。
そのため、適切なディスクリプションを設定する必要があります。
下記は実際に起きた事例です。
google検索にサイトのタイトルを入れた結果
ページのソースから見た結果
違っていることが分かりますね。。。
また、google検索で『site:』演算子を使って確認することもできます。
ディスクリプションは120文字までにしましょう。
PCで表示される最大幅が全角120文字までのためです。
120文字を超えると『…』になるので、文頭に狙いたいキーワードを含めるのがおすすめですね。
変更したらサイトマップ送信をしましょう。
※反映までに半日以上かかるので少し待ちましょう。
それでも改善されない場合は次のことを試しましょう!
2. data-nosnippet属性で、ある程度制御する
- data-nosnippet属性とは?
- 実際のコードに追加する
その①:data-nosnippet属性とは?
googleに説明があります
下記のように説明がありました。
サイトのスニペットが生成され、検索結果に表示されることがないようにしたり、スニペットの最大文字数を Google に指示したりすることも可能です。ページのスニペットが Google の検索結果に表示されないようにするには、nosnippet メタタグを使用します。スニペットの最大文字数を指定するには、max-snippet:[number] meta タグを使用します。また、data-nosnippet 属性を使用して、ページの特定の部分がスニペットに表示されないようにすることもできます。
スニペットとは検索結果の説明や要約部分のことをいいます。
ディスクリプションがサイトのコンテンツと合っていないと判断された際に、googleがサイトのコンテンツを要約してディスクリプションを書き換えます。
書き換えとして使ってほしくない部分のタグに『data-nosnippet』を入れることで防ぐことができるようです。
その②:実際のコードに追加する
下記のような感じで入れていきます。
1 2 3 |
<div data-nosnippet> <p>これがスニペットとして使いたくない文章です。</p> </div> |
googleには下記のように注意点があります。
data-nosnippet を使う必要がある場合は、div 要素、span 要素、section 要素でラップまたはレンダリングしてください。
今回はTOPページに実装していくので、front-page.phpの中に追加してみました。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
<main> <!-- key visual --> <div class="key"> ~キーの内容~ </div> <section data-nosnippet> ~コンテンツの内容~ </section> <section data-nosnippet> ~コンテンツの内容~ </section> <section data-nosnippet> ~コンテンツの内容~ </section> </main> |
また、再度サイトマップ送信して待ちます。(1日待ちました…)
無事にこちら側で設定したディスクリプションが反映されました!
以上、google検索結果に表示されたディスクリプションが違う場合の対処法をご紹介しました。
ではまた。