構造化マークアップとは、サイトのコンテンツ内容を検索エンジンにわかりやすく認識させるための記述方法です。構造化マークアップを設定すると、検索結果でリッチリザルトが表示されるなどのSEO効果を得られる可能性が高まります。

この記事では、構造化マークアップの基本的な概念から、通常のマークアップとの違い、設定方法5種・リッチリザルト例・検証ツールまでを体系的に解説します。構造化マークアップを活用して自社のSEO対策を強化したい方は、ぜひ参考にしてください。

構造化マークアップとは？

構造化マークアップとは、Google検索エンジンのクローラーにサイトのコンテンツが何を示しているか理解させる記述方法のことです。

GoogleはWebサイトのコンテンツを収集し、ランキング化して検索結果に表示させます。しかし、Googleはコンテンツの中身を人間と同様の形では理解できません。そこで、Googleではメタデータを追加し検索エンジンにページ内のコンテンツを理解させる「セマンティック·ウェブ」という理論を導入しました。このセマンティック·ウェブにより、検索エンジンがさまざまな言葉の意味や文脈を理解できます。

構造化マークアップは、検索エンジンへの「情報の説明書」として機能します。適切に設定することで、クローラーがコンテンツの文脈を正確に把握できるようになり、リッチリザルト表示やSEO効果につながります。

通常のマークアップとの違い

通常のマークアップと構造化マークアップとの違いは、テキストに意味を持たせるかどうかという点にあります。

通常のマークアップでは、クローラーはテキストを単なる文字列として認識します。その通常のHTMLに構造化マークアップを用いると、マークアップしたテキストに「会社名」や「住所」などの意味を持たせることができ、クローラーにコンテンツの中身を正しく認識させることができます。

例えば、「パンタグラフ」という言葉を通常のHTMLで記述した場合、クローラーにはただの文字列として認識されます。そこに構造化マークアップの記述を入れ、「パンタグラフ」という言葉に「社名」を紐づけると、その文字列が社名であることをクローラーに認識させることができます。

つまり、構造化マークアップは「文字列に意味のラベルを貼る」作業です。この一手間が、検索エンジンの理解精度を高め、リッチリザルトへの掲載チャンスを広げることになります。

マークアップの記述例

ここでは「通常マークアップ」と「構造化マークアップ」の記述例を紹介します。

 

【通常マークアップの記述例】

<div>株式会社パンタグラフ</div>

上記のように通常マークアップで記述すると、クローラーは「株式会社パンタグラフ」という単語を単なる文字列として認識します。

 

【構造化マークアップの記述例】

<div itemscope itemtype=”http://schema.org/Corporation”> <span itemprop=”name”>株式会社パンタグラフ</span> </div>

上記のように構造化マークアップのタグを追加で記述すると、文字列に「株式会社パンタグラフ＝社名」と意味を持たせることができるため、クローラーが正しく情報を認識します。

 

構造化マークアップのメリットとデメリット

構造化マークアップには、SEOへのプラス効果というメリットがある一方で、設定に知識と工数が必要というデメリットもあります。導入前に両面を理解しておくことが重要です。

以下の表で、メリットとデメリットを整理しておきましょう。

観点	内容
メリット	・検索エンジンがコンテンツを正確に認識しやすくなる ・リッチリザルトとして表示される可能性がある ・特定キーワードでの優先表示・アクセス増加が期待できる
デメリット	・構造化マークアップに関する知識の習得が必要 ・設定にある程度の工数がかかる ・初めて取り組む場合は作業が長引く可能性がある

メリット：SEOに良い効果がある

構造化マークアップのメリットは、SEOに良い効果があることです。

特に以下の2点で効果を期待できます。

• 検索エンジンがコンテンツの情報を正確に認識しやすくなる
• 検索結果にリッチリザルトとして表示される可能性がある

構造化マークアップによって文字列に意味を与えると、検索エンジンのクローラーはコンテンツの情報を正確に認識しやすくなります。

その分、構造化マークアップしたサイトは特定の検索キーワードに対して優先表示されやすくなり、アクセス増加が期待できるでしょう。

また、構造化マークアップによって検索エンジンに意味情報が認識されたコンテンツは、検索結果にリッチリザルトとして表示される可能性があります。リッチリザルトとは、以下のような視覚的機能を用いて表示される検索結果のことです。

 

このようにリッチリザルトとして表示されれば、自社コンテンツがユーザーの目に留まりやすくなるため、アクセス数増加が期待できます。このように、構造化マークアップを利用することはSEO上のメリットがあるといえます。

SEOへの効果を最大化するには、コンテンツの内容とマークアップの種類を適切に対応させることが重要です。誤ったタイプのマークアップは効果がないどころか、Googleのガイドライン違反になる場合もあるため、正確な設定を心がけてください。

SEOについて詳しく知りたい場合は「SEOとは？初心者にわかりやすく解説！検索順位が上がる仕組みと対策法」をご覧ください。

デメリット：知識が必要で工数がかかる

構造化マークアップのデメリットは、以下の2点です。

• サイトやページに構造化マークアップの設定をする必要がある
• 構造化マークアップの知識が必要

構造化マークアップの設定には、構造化マークアップに関する知識の習得が必要で、設定にはある程度の工数もかかります。知識の習得や設定には多くの時間がかかり、特に初めて取り組む場合はなかなか作業が進まないケースも出てきます。

自社Webサイトの目的を明確にして、かけたコストに対してメリットが上回るか慎重に検討しましょう。

ただし、後述するGoogleの支援ツール（構造化データマークアップ支援ツール・データハイライター）を活用することで、専門知識が少なくても設定が可能です。まずはツールを使って試してみることをおすすめします。

 

構造化マークアップの設定方法を5つ紹介

構造化マークアップを設定する方法は以下の5つがあり、HTMLに直接記述する方法とツールを使う方法に大別されます。

【HTMLに直接記述する方法】

• Microdataで記述
• RDFaで記述
• JSON-LDで記述

【ツールを使用して設定する方法】

• 構造化データマークアップ支援ツールを使って設定
• データハイライター使って設定

HTMLに直接記述する際は、「ボキャブラリー」と「シンタックス」の知識が必要です。それぞれの意味は以下の通りです。

• ボキャブラリー：構造化データ設定の際、何の情報かを定義する規格。代表的なものとして「schema.org」があります。
• シンタックス：ボキャブラリーをHTMLに記述するルールを定めた規格。代表的なものはMicrodata・RDFa・JSON-LDの3種類です。

3種類のシンタックスを比較すると、以下のようになります。現在はGoogle推奨のJSON-LDを選択するケースがほとんどです。

シンタックス	記述場所	主なメリット	推奨度
Microdata	HTML該当箇所付近	HTMLと構造が一致しやすい	△（W3C勧告が2013年停止）
RDFa	HTML該当箇所付近	XML等の幅広い言語に対応	△（管理コスト大）
JSON-LD	HTML内どこでも可	Google推奨・埋め込みが容易	◎（Google推奨）

 

Microdata（マイクロデータ）で記述

Microdataは、HTML5でのみマークアップ可能なシンタックスで、HTML内の該当箇所付近に記述します。

例えば、芥川龍之介著作の「蜘蛛の糸」を表示させるには、以下のように記述します。

<div itemscope itemtype=”https://schema.org/Book”>     <h2 itemprop=”name”>蜘蛛の糸</h2>     <p itemprop=”author”>芥川龍之介</p>     <p itemporp=”genre”>中編小説</p>     <p itemprop=”datePublished”>1918年</p> </div>

Microdataでは以下の3要素で構造を定義します。

• itemscope：タグの間にあるHTMLがMicrodataを含んだものであることを伝える。
• itemtype：利用するボキャブラリーのタイプを表すURLを指定する。上記では本を紹介しているため、schema.orgの「Book」を指定している。
• itemprop：タイプ内のプロパティのラベルを指定する。上記では「name（名前）」「author（著者）」「genre（分野）」「datePublished（刊行日）」を指定している。

Microdataは、HTMLタグやHRML属性を使い定義するので、構造化データとHTMLが一致しやすいメリットがあります。しかし、HTML属性が多くHTMLコードが煩雑になりやすいため、管理コストがかかる点がデメリットです。

さらに、W3Cの勧告が2013年10月で止まっているため、基本的にMicrodataの使用は推奨されておらず、利用されるケースも少なくなっています。

現在新規で構造化マークアップを導入する場合は、後述するJSON-LDを選択することを強くおすすめします。

RDFa（アールディーエフエー）で記述

RDFaは、HTML内の該当箇所の近くに記述するため、Microdataと近い形で記述可能です。一方で環境制限はなく、XMLでも使用できるなど幅広い言語でマークアップできます。

RDFaで記述した場合、以下のコード形式となります。

<div vocab=”http://schema.org/” typeof=”Corporation”> <span property=”name”>株式会社パンタグラフ</span> <span property=”address” typeof=”PostalAddress”> <span property=”postalCode”>150-0021</span> <span property=”addressRegion”>東京都</span> <span property=”addressLocality”>渋谷区</span> <span property=”streetAddress”>恵比寿西2丁目17-6代官山ウェスト1階</span></span> </div>

なお、RDFaは以下3要素を用いて構造が定義されます。

• vocab：構造化マークアップのボキャブラリーの規格を定義する。
• typeof：利用するボキャブラリー内のタイプを定義する。上記では「Corporation（会社）」「PostalAddress（宛先）」を指定している。
• property：タイプ内のプロパティのラベルを指定する。上記では「name（会社名）」「address（所在地）」などを指定している。

RDFaは、機能的に優れているものの、Microdata同様HTMLコードが煩雑になり管理コストがかかる点がデメリットです。

RDFaは既存のXMLベースのシステムと連携する場合などに有効ですが、新規サイトへの導入であればJSON-LDの方が管理のしやすさの面で優れています。

JSON-LD（ジェイソン　エルディー）で記述

JSON-LDは、他のシンタックスとは記述場所が異なり、HTML内であればどこにマークアップしても問題ありません。Googleが推奨しており、現在最も広く利用されている記述方法です。

JSON-LDは、script typeで JSON-LDを利用することを宣言後、keyとvalueの組み合わせで記述します。keyはボキャブラリーで定義されているプロパティ（属性）のことで、valueは値を指します。

具体的には、以下の形式で記述します。

<script type=”application/ld+json”> { “@context”: “http://schema.org”, “@type”: “Corporation”, “name”: “株式会社パンタグラフ”, “address”: { “@type”: “PostalAddress”, “postalCode”: “150-0021”, “addressRegion”: “東京都”, “addressLocality”: “渋谷区”, “streetAddress”: “恵比寿西2丁目17-6代官山ウェスト1階” }, } </script>

なお、JSON-LDでは以下の3要素で構造を定義しています。

• context：構造化マークアップのボキャブラリーの規格を定義する。
• type：利用するボキャブラリー内のタイプを定義する。上記では「Corporation（会社）」「PostalAddress（宛先）」を指定している。
• タイプ内のプロパティ：タイプ内で、さらに細かいプロパティを指定する。上記では「name（会社名）」「address（所在地）」などを指定している。

JSON-LDは、スタイルシート（CSS）の影響を受けることが少なく、既存のページに埋め込みやすい点がメリットです。また、各システムでデータの取得・分析がしやすく、マーケティングの施策改善などにも役立ちます。Google推奨でもあり、現在多くのユーザーに利用されている記述方法です。

一方で、外部ファイル化できないため、HTML内に直接記述する必要があります。

WordPressを利用している場合は、プラグイン（例：Schema & Structured Data for WP & AMP）を活用することで、コードを直接記述しなくてもJSON-LDを設定できます。まずはプラグインから試してみることをおすすめします。

構造化データマークアップ支援ツールを使って設定

これまで紹介したのはhtml上に直接記述する方法でした。ここからは方法以外でも、支援ツールを使って構造化マークアップができます。

構造化データマークアップ支援ツールはGoogleが提供しており、Googleサーチコンソールと連携したWebサイトで利用可能です。画面上の操作だけでWebサイト（ページ）に合わせたマークアップができるため、非常に便利です。

設定手順は以下の通りとなります。

1. まず、ツールにアクセスすると下記画面が表示されます。
2. マークアップするデータタイプを選択し、マークアップするページのURLもしくはHTMLソースを貼り付け、「タグ付けを開始」を押します。
3. タグを追加したい箇所をクリックし、タグの種類を選択。
4. 右端に「ダウンロード」「完了」というボタンが表示されます。
5. 「ダウンロード」を押すと構造化データのソースをダウンロードでき、「完了」を押すとページ内に構造化データが反映され、マークアップ完了です。

このツールを使うと、コードの知識がなくてもGUIの操作だけで構造化マークアップを設定できます。ただし、生成されるコードはMicrodata形式であるため、JSON-LDに変換して使用することを推奨します。

なお、Googleサーチコンソールの使い方については「Googleサーチコンソールの使い方・設定を初心者に分かりやすく解説！」で詳しく説明しているので、併せてご覧ください。

データハイライター使って設定

データハイライターもGoogleが提供しているツールであり、構造化データマークアップ支援ツールと同様にGoogleサーチコンソールとの連携が必要です。

データハイライターは、HTMLの記述を変更するのではなく、構造化データの代わりにGoogleに情報を伝えるツールです。

データハイライターの設定手順は以下の通りです。

1. サーチコンソール内「以前のツールとレポート」にある「詳細」をクリック
2. 「データハイライターツール」をクリック
3. 移遷先のページで設定したいサイトのプロパティを選択し、「ハイライト表示を開始」をクリック
4. タグ付けしたいページとハイライトする情報を選択
5. 移遷後のページでタグ付けしたいテキストを選択し、「完了」を押す

上記手順でデータハイライトによるタグ付けが完了し、Googleに設定した情報を伝えられます。

データハイライターはHTMLを変更せずに済むため、サイトのソースコードにアクセスできない場合でも設定できるのが利点です。ただし、Googleへの情報提供に限定されるため、構造化マークアップの完全な代替にはなりません。補助的な手段として活用しましょう。

 

構造化マークアップで表示されるリッチリザルト例

リッチリザルトは種類によって表示される情報が異なります。以下の表で主要な種類と効果を確認してください。

種類	表示される主な情報	効果
パンくずリスト	サイト階層のパス	ページ構造をユーザーに伝える
イベント	日時・場所・チケット情報	イベント関心ユーザーへの訴求
求人情報	職種・給与・勤務地など	サイト訪問前に情報提供しCTR向上
レシピ	材料・調理時間・評価	料理系サイトへのアクセス増加
FAQ	質問と回答のリスト	疑問解決コンテンツへの誘導
Product（製品）	価格・評価・在庫状況	EC・商品ページへの集客強化

リッチリザルトとは検索結果画面に表示される情報のこと

リッチリザルトとは、検索結果画面に表示される視覚的な情報のことです。通常のリンクよりも高度な機能を持ち、画像やカルーセルなどの要素を含めることが可能です。それにより、視覚性や操作性の面でよりユーザーの要望に応えやすくなっています。

リッチリザルトには、パンくずリスト·イベント·求人情報·レシピ·FAQ·製品情報など、あらかじめ定義された種類があり、それに合わせて構造化マークアップをすることで、リッチリザルトが表示される可能性が高まります。

リッチリザルトが表示されればユーザーの目に留まりやすくなるため、サイトへのアクセス向上も期待できます。

なお、リッチリザルトはリッチスニペットとも呼ばれます。リッチリザルト（リッチスニペット）と強調スニペットの違いなどについては、「スニペットとは？SEO効果や種類、表示方法をわかりやすく解説」をご覧ください。

パンくずリスト

下記の赤枠のように、サイトの階層を示すパンくずリストが表示されています。

パンくずリストが表示されれば、どんなページなのかユーザーに情報が伝わりやすく、ユーザーの利便性が向上します。

サイトの階層構造が明確なコーポレートサイトやメディアサイトでは、パンくずリストの構造化マークアップを設定しておくことを強くおすすめします。

 

イベント

「東京 イベント」で検索すると、下記の赤枠のようにWebサイトのイベント枠が検索結果上に表示されます。

イベント関連を扱うサイトではユーザーにすぐ情報を伝えられるため、ユーザーの関心を惹きつけやすいといえるでしょう。

イベントのリッチリザルトには、開始日時・場所・チケット購入リンクなどを含めることができます。イベント集客を目的とするサイトでは特に効果が大きいです。

 

求人情報

Googleで「求人」で検索すると、下記の形式で求人情報が表示されます。

Webサイトを開くことなく求人情報を伝えられるため、ユーザーからクリックされる確率が高まります。

求人情報のリッチリザルトに対応するには、JobPosting型の構造化マークアップが必要です。採用ページを持つ企業サイトでは積極的に設定しましょう。

 

レシピ

「オムライス」と検索すると、レシピ情報が画像・調理時間・評価などと合わせて一覧で表示されます。

レシピを掲載しているWebサイトであれば、アクセス増加が見込めます。

レシピのリッチリザルトには、材料・調理時間・カロリー・評価（レーティング）などを含めることができます。料理系コンテンツを発信しているサイトでは設定することで大きなCTR改善が期待できます。

FAQ

「自動車　おすすめ」と検索すると、下記赤枠のようにWebサイト内の関連するよくある質問と回答が検索結果上に表示されます。

ユーザーは疑問を持って検索をかけるため、その疑問を解決できる回答が上記の形式で表示されれば、Webサイトへのアクセス増加が見込めます。

FAQページが存在するサイトや、記事内にQ&Aセクションを設けているブログでは、FAQSchema型のマークアップを追加するだけで表示対象になります。比較的設定が簡単なタイプですので、まず試してみることをおすすめします。

 

Product（製品）

「急速充電 PD対応」などの商品名や製品スペックで検索すると、価格・評価・在庫状況などの商品詳細が検索結果上に直接表示されます。

ユーザーの欲しい情報をWebサイトを開くことなく把握できるため、ユーザーの興味を惹きつけアクセスを促せます。

ECサイトや製品紹介ページを持つ企業では、Product型のマークアップを設定することで商品への直接流入が増加する可能性があります。価格変動がある場合は定期的に情報を更新することが重要です。

「ダイソン空気清浄機」と検索すると、上記のように商品の詳細が検索結果上で表示されます。

ユーザーの欲しい情報をWebサイトを開くことなく把握できるため、ユーザーの興味を惹きつけアクセスを促せます。

 

構造化マークアップを検証する方法

構造化マークアップを設定したら、必ず以下のツールで正しく反映されているかを確認してください。

各ツールの特徴と確認できる範囲をまとめると、以下の通りです。

ツール名	特徴	確認できる範囲
構造化データテストツール	schema.org提供。URLを入力してエラーを確認	1URLごとの詳細エラー確認
Google Search Console	サイト全体の構造化データを一覧化	サイト全体の一括確認
リッチリザルトテスト	Google提供。URLまたはコードで検証	リッチリザルト適用可否の確認

構造化データテストツールで確認

schema.orgが提供する構造化データテストツールで構造化マークアップの検証ができます。

利用方法は以下の通りです。

1. 構造化データテストツールにアクセス
2. 該当するURLを入力し「テストを実行」をクリック

構造化マークアップが正しく反映されていれば「エラーなし」や「警告なし」と表示されます。一方、エラーが発生している場合は警告表示が出るため、該当箇所修正する必要があります。

このツールは1URLずつの確認に最適です。実装後の最初の動作確認として利用するのが効果的です。

サーチコンソールで確認

Google Search Console（グーグルサーチコンソール）から構造化マークアップの検証も可能です。

先ほどの構造化データテストツールは1つのURLしか検証できませんが、Google Search Consoleではサイト内の構造データを一覧にして検証できます。

具体的な手順は以下の通りです。

1. Google Search Consoleにアクセス
2. 「検索での見え方」より「構造化データ」を選択

上記の方法で、実際に記述した構造化マークアップが検索結果上で反映されているかが確認できます。

サイト全体を運用している場合は、Search Consoleで定期的にエラーがないかモニタリングする習慣をつけましょう。新しいページを追加したタイミングで確認するのが効果的です。

Google Search Consoleでは、他にもたくさんのデータを取得できます。詳しくは「Googleサーチコンソールの使い方·設定を初心者に分かりやすく解説！」をご覧ください。

リッチリザルトテストで確認

Googleが提供するリッチリザルトテストでも確認できます。

リッチリザルトテストも構造化データテストツールと同様に、検証したいURLを入力して簡単に検証できるツールです。また、こちらのツールではコードを貼り付けることでも検証できます。

具体的には以下の手順で利用します。

1. リッチリザルトテストにアクセス
2. 該当するURLまたはコードを入力
3. 「テスト実行」をクリック

構造化マークアップが正しく反映されていれば、「このページはリッチリザルトの対象です」と表示されます。一方、正しく反映されていない場合やエラーがあった場合は、「このテストによって判明したリッチリザルトの対象外のページ」と表示され、テストの詳細が表示されます。対象外ページと表示された場合は、テスト詳細を見てサイトを修正しましょう。

コードを貼り付けてテストを実行した場合、画面左に貼り付けたコードが表示され、コードを修正しながら検証を継続できるため、デバッグ作業に非常に便利です。3つの検証ツールの中で最もリッチリザルトへの適用可否を直接確認できるため、公開前の最終チェックに活用してください。

 

構造化マークアップを設定して効果的なSEO対策を

構造化マークアップは、専門的な知識や作業の手間を要するというデメリットはありますが、自社コンテンツがリッチリザルトとして表示されるなど、SEOにおいて大きなメリットがあります。

構造化マークアップは、一度設定して終わりではありません。コンテンツの追加や更新に合わせて継続的にメンテナンスすることで、SEO効果を維持・向上させることができます。また、Googleのガイドラインは定期的に更新されるため、schema.orgやGoogle公式ドキュメントを定期的に確認する習慣も大切です。

Googleが提供する構造化データマークアップ支援ツールやデータハイライターを使えば手軽に構造化マークアップできるため、積極的に利用しましょう。

もし、構造化マークアップの設定にお困りの場合は、ぜひパンタグラフにご相談ください。

パンタグラフでは、インターネット事業を中心とした戦略立案に向けて、課題抽出から企画提案まであらゆるサポートを実施しています。

相談は無料ですので、お気軽にお問い合わせください。

お問い合わせはこちら