Webサイト運営者であれば、「構造化マークアップ」という言葉を一度は耳にしたことがあるのではないでしょうか。しかし、その意味や設定方法、SEOにどのような影響があるのかを詳しく理解している方は少ないのではないでしょうか。
今回は、構造化マークアップについて解説します。構造化マークアップを正しく理解できれば検索エンジンからの評価を高め、より多くのユーザーに効率的に情報を届けられる可能性が高まります。ぜひ最後までお読みいただき、構造化マークアップについての理解を深めていただければ幸いです。
構造化マークアップについて
構造化マークアップとは一体何なのでしょうか。まずは、その基本的な概念と、なぜWebサイトにとって重要なのかを解説していきます。
構造化マークアップとは
構造化マークアップとは、Webページのコンテンツ（テキスト、画像、動画など）に対して、その意味や種類を検索エンジンなどのクローラーに明確に伝えるために構造化データを記述することです。具体的には、HTMLのコードに特定のルールに従った情報を追加することで実現されます。
クローラーは、HTMLやJavaScriptなどで記述されたテキストをただの文字列として認識します。人間のようにその意味を深く理解することはできないので構造化データを使用することで、クローラーの理解を手助けすることができます。
構造化データの使用例
構造化データ（JSON-LD形式）を使用している場合と使用していない場合のソースコードの違いについて、わかりやすい例を仮の商品ページで紹介します。
・構造化データを使用していない場合
<!DOCTYPE html>
<html>
<head>
<title>最新ワイヤレスイヤホン</title>
</head>
<body>
<h1>最新ワイヤレスイヤホン</h1>
<img src=”images/earphone.jpg” alt=”ワイヤレスイヤホンの画像” width=”300″>
<p>高音質ノイズキャンセリング機能搭載の最新ワイヤレスイヤホンです。</p>
<p>価格：15,800円（税込）</p>
<p>ブランド：〇〇株式会社</p>
<a href=”/buy/earphone”>購入はこちら</a>
</body>
</html>
上記では、商品のタイトル、画像、説明、価格などのあらゆる情報がHTMLの要素で記述されていますが、検索エンジンはこれらの情報が「商品」に関するものであるという理解ができません。
・構造化データを使用している場合（JSON-LD形式）
<!DOCTYPE html>
<html>
<head>
<title>最新ワイヤレスイヤホン</title>
<script type=”application/ld+json”>
{
“@context”: “https://schema.org”,
“@type”: “Product”,
“name”: “最新ワイヤレスイヤホン”,
“image”: “https://example.com/images/earphone.jpg”,
“description”: “高音質ノイズキャンセリング機能搭載の最新ワイヤレスイヤホンです。”,
“brand”: {
“@type”: “Brand”,
“name”: “〇〇株式会社”
},
“offers”: {
“@type”: “Offer”,
“priceCurrency”: “JPY”,
“price”: “15800”,
“availability”: “https://schema.org/InStock”,
“url”: “https://example.com/buy/earphone”
}
}
</script>
</head>
<body>
<h1>最新ワイヤレスイヤホン</h1>
<img src=”images/earphone.jpg” alt=”ワイヤレスイヤホンの画像” width=”300″>
<p>高音質ノイズキャンセリング機能搭載の最新ワイヤレスイヤホンです。</p>
<p>価格：15,800円（税込）</p>
<p>ブランド：〇〇株式会社</p>
<a href=”/buy/earphone”>購入はこちら</a>
</body>
</html>
上記では、<head>タグ内にJSON-LD形式で構造化データが追加されています。
詳しい説明は控えますが、これが商品に関する情報であり、価格は15,800円（税込）で、〇〇株式会社のブランドで、 購入ページのURLは https://example.com/buy/earphoneだ！
などの詳細な情報をクローラーに伝えることができます。
このようにクローラーが文字列の意味を理解できるようなサイト作りをしよう！というのが「セマンティックWeb」の考え方で、これらを実行する技術が「構造化データ」です。
構造化マークアップの目的4選
ここまで構造化マークアップの意味や使用例について解説してきました。
ここからは構造化マークアップを行う目的について大きく◯つに分けて解説していきます。
①リッチリザルトの表示
1つ目の目的は検索結果に「リッチリザルト」を表示させることです。
通常の検索結果はURL・タイトル・説明文の表示ですが、
リッチリザルトはパンくずリストや口コミ、レシピ、FAQ、商品情報などの情報も表示されます。
このように表示項目が増えるのでユーザーの目を引き、ユーザーの求める情報を提供できるようになり、クリック率向上にも期待できるでしょう。
②ナレッジパネルに情報が表示
2つ目の目的はナレッジパネルへの情報掲載です。
Googleはナレッジパネルの情報構築において、構造化マークアップを重要な情報源の一つとして活用しています。
ナレッジパネルに表示される情報はエンティティの種類によって異なりますが、一般的に以下のような構造化マークアップが関連します。
Person： 人物に関する情報（名前、生年月日、職業、肩書、関連ウェブサイト、ソーシャルメディアなど）
Organization： 組織に関する情報（組織名、所在地、設立日、ロゴ、連絡先、ウェブサイト、ソーシャルメディアなど）
LocalBusiness： 地域ビジネスに関する情報（店舗名、所在地、営業時間、電話番号、ウェブサイト、レビューなど）
Product： 製品に関する情報（製品名、ブランド、価格、レビュー、画像など）
Event: イベントに関する情報（イベント名、開催日時、場所、出演者など）
※構造化マークアップを行っても必ずナレッジパネルに表示されるわけではないので注意しましょう。
③検索エンジンの理解を助ける
3つ目の目的は検索エンジンの理解を助けることです。
検索エンジンは、高度な自然言語処理能力を持っていますが、Webページのコンテンツの意味を完全に理解するには限界があります。構造化マークアップは、検索エンジンに対して「手がかり」を与えてあげることで、ページ内容を分かりやすくし、コンテンツの理解を深め、より高い評価をもらえるように手助けをしています。
④音声検索やAIアシスタントへの対応
4つ目の目的は音声検索やAIアシスタントの対応です。
音声検索やAIアシスタントは、ユーザーの質問に対して適切な回答を行うために、テキストだけでなく、その「意味」や「構造」を把握し理解する必要があります。
構造化マークアップは、まさにこの「意味」や「構造」を検索エンジンやAIアシスタントに伝えるための仕組みになります。
例えば、「この近くのイタリアンの営業時間を教えて？」と音声検索した場合も、構造化マークアップされた店舗情報があれば、AIアシスタントは的確に営業時間やその他の情報について回答することができます。
押さえておきたい構造化データ9選
Googleがサポートする構造化データは33個あります。
参考：Google 検索がサポートする構造化データ マークアップ
その中から押さえておきたい構造化データを9つピックアップしてご紹介します。
それぞれ見ていきましょう。
記事（Article、NewsArticle、BlogPosting）
ニュース、ブログ、スポーツ記事にArticle構造化データをページに追加することで、Googleはそのウェブページの詳細な内容をしっかりと理解し、Google検索はもちろん、Googleニュースや Googleアシスタントといった他サービスで、記事のタイトル、テキスト、日付情報を表示してくれるようになります。そのサイトのコンテンツがどのような記事なのか（ニュース・ブログ・スポーツ記事かなどの判断）、誰が書いたものか、タイトルは何なのかといった情報をGoogleにきちんと伝えることができるようになります。
Article構造化データを追加することで、より効果的に情報を伝えられるでしょう。
パンくずリスト（BreadcrumbList）
パンくずリストとは、ページ上部に「ホーム > カテゴリ > 現在のページ」のような内部リンクのことです。パンくずリストは自分が今見ているページが、サイト全体のどの階層にいるのか教えてくれます。一つ上の階層に戻りたい場合もパンくずリストから遷移できます。
下記の画像の赤枠部分がページ内のパンくずリストです。
SERPsでは下記のように表示されます。検索結果上でもパンくずリストがあることでユーザーにとってもわかりやすく見えると思います。
よくある質問（FAQPage、Question、Answer）
政府機関または保健衛生関連のウェブサイトにおいて、サイト内で質問とその回答を掲載している場合、FAQPage構造化データを実装することで、Googleの検索エンジンに見つけてもらいやすくなります。
よくある質問ページを適切にマークアップすることで、リッチリザルトの表示、Googleアシスタントの対応も期待できます。
ローカル ビジネス（LocalBusiness）
実店舗がある場合は、LocalBusiness構造化データをマークアップしましょう。
ナレッジパネルが表示されることがあります。ナレッジパネルには営業時間や所在地、電話番号、口コミなども表示できます。
飲食のサービスは「メニュー」もマークアップできますので
実際にサイトを見ずに、ナレッジパネルから予約をしたり、マップ検索で来店に至るケースもあります。ユーザーの利便性が向上しているといえるでしょう。
商品（Product）
商品ページに構造化データを追加することで、Googleの検索結果で価格、在庫状況、レビューの評価、配送情報なども検索結果確認できるようになり、ユーザーエクスペリエンスの向上とGoogle検索における商品の露出度向上に大きく貢献します。
クリック前に商品の詳細情報を把握できるため、購入意欲の高いユーザーのアクセスを促し、コンバージョン率の向上にも期待できます。
Q&A（QAPage）
Q&Aページの構造化データを追加することで、検索結果ページにリッチリザルトを表示できるようになります。主にFAQ ページや製品サポートページなどのコンテンツに有効です。
QAPage構造化データを適切に実装することで、サイト内のコンテンツが検索結果やGoogle アシスタントでより効果的に活用され、ユーザーエクスペリエンスの向上にも期待できます。
レシピ（Recipe）
レシピの構造化データを追加することで、料理名、調理時間、カロリー、レビュー、材料、写真、動画などのレシピに関する詳細な内容がリッチリザルトで表示されることがあります。
レシピに関するコンテンツを掲載しているサイトは、Recipe構造化データを追加することで、トラフィックの増加、ユーザーエンゲージメントの向上を目指しましょう。
クチコミ抜粋（Review、AggregateRating）
クチコミ抜粋の構造化データを追加することで、商品やサービスの平均評価 、評価数、個別のクチコミがリッチリザルトで表示できるようになります。
実際のお客様の声は、購入やサービスの利用を検討しているユーザーにとって背中を押してくれる要素です。適切にマークアップを行いユーザーにアピールしましょう。
構造化マークアップの設定方法
構造化データをHTMLで記述する場合、ボキャブラリー（値）とシンタックス（記述のルール）を使用してマークアップを行うのですが初心者の方には推奨できません。
筆者が推奨する方法はGoogleが提供している構造化データマークアップ支援ツールを使用して記述する方法です。手順は非常に簡単です。
①マークアップしたい項目を選択
②URLを入力し「タグ付けを開始」をクリック
完了後、以下の画像のページに遷移します。
画像の赤枠部分の項目を埋めるために、左側の自身のサイトの該当部分を選択し、タグを設定し「HTMLを作成」をクリックします。
クリック後は以下の画面に遷移します。
JSON-LD形式でマークアップされたHTMLが表示されていますので、赤枠部分を自身のページのbody部分に適用して作業は完了となります。
構造化マークアップの検証方法
構造化データのマークアップが完了したら、正しくマークアップ出来ているか確認を行います。
ここでは「リッチリザルトテスト」と「スキーマ マークアップ検証ツール」の２つのテストツールをご紹介します。
リッチリザルトテスト
リッチリザルトテストはページ単位で構造化データが有効になっているかどうかを確認できます。対象のページ毎に構造化マークアップが有効になっているか確認しましょう。
注意点：リッチリザルトテストはGoogleがサポートしているリッチリザルトの検証のみ可能です。
リッチリザルトテストの使い方
①リッチリザルトテストにログインします。
②対象のURLを入力し、スマートフォンかパソコンを選択し、「URLをテスト」をクリックします。
「URLをテスト」をクリック後は以下のページに遷移します。
構造化データが有効になっている場合は、項目ごとに「有効なアイテムを検出しました」と表示されます。
まとめ
構造化マークアップは、Webページの情報を検索エンジンに正確に伝え、リッチリザルト表示やナレッジパネルへの掲載、音声検索への対応などを可能にする重要な施策です。
この記事では、構造化マークアップの基本的な概念から、設定方法について解説しました。
本記事を参考に構造化マークアップを適切に実装いただければ幸いです。
コメント