2023/12/26
構造化マークアップでユーザーにより伝わる検索結果にしよう!
Google検索での構造化データのマークアップ(構造化マークアップ)をご存知でしょうか?構造化マークアップとは、Webページの構造を検索エンジンにより分かりやすく伝えるためにHTMLにマークアップする専用のコードのことです。構造化マークアップをすることでクローラーがコンテンツ内容を理解しやすくなり、その分Webページのインデックスが促進されます。つまり、Googleに評価されやすくなる見込みが出るということです。
構造化データとは?
構造化データとは、ページに関する情報を様々なサイトで活用できるように標準化したデータ形式のことを指します。
例えばレシピページであれば、材料、加熱時間と加熱温度などを詳細に提供できます。
構造化データをページに追加する理由
構造化データをページに記述することで以下のメリットが挙げられます。
- クローラーがコンテンツ内容を認識しやすくなる
- 検索結果にリッチリザルトが表示される
※リッチリザルトとは、検索結果画面上でより多くユーザーに情報を届けるためにGoogleが提供している機能のことです。
構造化データの記述方法について
構造化データは、あらかじめ「schema.org」で定義されてる複数のボキャブラリー(プロパティ/キー[属性]とバリュー[属性値])から選択して、用途に合わせながらマークアップします。「schema.org」は、構造化データを作成したり管理する公式の団体のことで、Googleがサポートをしています。
そして、マークアップできる構造化データの形式/仕様(シンタックス)は、基本的に「JSON-LD」「microdata」「RDFa」の3つがありますが、中でもGoogleは「JSON-LD」を推奨しています。
「JSON-LD」を使用した構造化データのマークアップ例が下記になります。
JSON-LDによる記述例
<html>
<head>
<title>Party Coffee Cake</title>
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Recipe",
"name": "Party Coffee Cake",
"author": {
"@type": "Person",
"name": "Mary Stone"
},
"datePublished": "2018-03-10",
"description": "This coffee cake is awesome and perfect for parties.",
"prepTime": "PT20M"
}
</script>
</head>
<body>
<h2>Party coffee cake recipe</h2>
<p>
<i>by Mary Stone, 2018-03-10</i>
</p>
<p>
This coffee cake is awesome and perfect for parties.
</p>
<p>
Preparation time: 20 minutes
</p>
</body>
</html>
HTMLファイルに直接マークアップする場合、「schema.org」であらかじめ定義されてるプロパティ(属性)とバリュー(属性値)以外、特別なタグなどはマークアップしません。ページやコンテンツのタイプを考慮して「ページのURL」「タイトル名」「画像ファイルのURL/サイズ」「公開日/更新日(日付)」「著者名」などのボキャブラリー(プロパティ/キー[属性]とバリュー[属性値])を用いながら、構造化データをマークアップしましょう。
構造化データに関するガイドラインについてはこちらから確認できます。
構造化データの有効性を確認する方法
構造化データの記述が完了したら、きちんと有効な記述になっているかツールを使用して確認をします。エラーが出ているとGoogleに正しく認識されないので、検証を忘れずに行うようにしましょう。
構造化データをテスト

まとめ
構造化マークアップをは検索順位の変動に直接影響を与えるものではありませんが、正確な情報をGoogleに伝えることで検索結果画面の表示を変えることができます。それによりユーザーのクリックアクションが増える可能性があるのでページへの流入増加を狙うにあたり重要な対策となります。
また上記で解説したように構造化データのマークアップを実装するには専門知識が必要となります。
サイトが古くまだ未実装だから入れたい!という場合にはお気軽にご相談ください!
コーディング業務のご依頼、ご相談の詳細についてはこちらから
最後までお読みいただき、ありがとうございました。
よろしければシェアしていただければ幸いです。
| 次の記事へ | 前の記事へ |
WEB業界ならqam!qam(カム)はWEB業界で働く人や興味がある人に役立つ情報サイトです。
マーケティングやデザイン、マークアップ(コーディング)、プログラム、トレンドなどの情報をqamライター陣が執筆。噛めば噛むほど(読めば読むほど)制作・開発や運営・運用、業界知識やノウハウを学ぶことができます。



