構造化データとは?記述例やSEOでのメリット、マークアップの手順を解説

Webサイトの検索結果において、自社ページを目立たせるためには、構造化データの活用が欠かせません。しかし、その実装には一定の手間や専門知識が必要です。この記事では、構造化データの例を交えながら、その重要性と具体的な実装方法や構造化データの重要性、メリットなどについてわかりやすく解説します。WebサイトのSEO強化に興味がある方は、必見の内容となっています。
執筆者

マーケティングサポート「バンソウ」のメディア管理人
株式会社クリエイティブバンクのマーケティングサポート「バンソウ」のメディア管理人。得意分野は、SEO全般・サイト分析・オウンドメディア・コンテンツマーケティング。バンソウはクライアント様のBtoBマーケティングをサポートするサービスです。詳しい内容はこちらをご覧ください。
構造化データとは
構造化データとは、セマンティックWebの理念にもとづいて、Webコンテンツをより詳細に理解しやすくするための形式です。これにより、検索結果で詳細な情報を表示し、ユーザーのニーズに合致した結果を提供できます。
例えば、FAQや商品情報、イベント情報などをリッチリザルト(検索結果にさまざまな情報を表示させる機能)として表示でき、サイトの評価とクリック率の向上が期待できます。構造化データによって情報の意味をコンピュータに伝えることで、よりユーザーにとって有益な情報を検索結果に反映させることができます。
次に、セマンティックWebと構造化データの仕組みをご紹介します。
セマンティックWebとは
セマンティックWebとは、Webページの情報に意味を与え、コンピュータがそれを理解しやすくする仕組みのことです。これにより、コンテンツが単なる文字列ではなく、意味を持つデータとして活用できます。構造化データがその実現に不可欠であり、Webの利便性を向上させます。
例えば、人物の名前や電話番号などのデータを構造化することで、検索結果の精度向上やユーザーの利便性が向上します。このような技術を用いることで、Webページの情報がより意味のあるかたちで活用されることが期待されます。
構造化データの仕組み
構造化データの仕組みを理解するためには、ボキャブラリーとシンタックスの概念が重要です。
ボキャブラリーとは、構造化データを設定する際に、何についての情報なのかを定義する規格です。例えば、人の名前や住所などの情報を指定することで、検索エンジンにその情報の意味を伝えます。現在、Googleがサポートしている主要なボキャブラリーは、Google、Yahoo!、Bingが共同で策定した「schema.org」です。
シンタックスは、実際にマークアップする際の仕様を指し、schema.orgではJSON-LD、Microdata、RDFa Liteの3つの形式でマークアップすることが定められています。特にGoogleはJSON-LDを推奨しており、これはHTML内のスクリプトで記述され、データを一元管理できる利点があります。
ボキャブラリーとシンタックスによって、検索エンジンは構造化データからコンテンツ内容を理解し、リッチリザルトとして表示させることが可能になります。
構造化データの記述例
構造化データには、約30種類のパターンが用意されており、パンくずリストや記事、Q&Aなどさまざまなコンテンツに対応しています。ここでは、代表的な構造化データの種類ごとに、記述方法をご紹介します。
記事(Article)
「記事」の構造化データは、GoogleニュースやGoogleアシスタント、そのほかのサービスなどで、Web上のページが記事であることを示すためのものです。これにより、検索結果画面でタイトルやテキスト、画像、日付情報を適切に表示できるようになります。具体的な記述方法は、JSON-LD形式で以下のようになります。
<html>
<head>
<title>Title of a News Article</title>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "NewsArticle",
"headline": "Title of a News Article",
"image": [
"https://example.com/photos/1x1/photo.jpg",
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"datePublished": "2024-01-05T08:00:00+08:00",
"dateModified": "2024-02-05T09:20:00+08:00",
"author": [{
"@type": "Person",
"name": "Jane Doe",
"url": "https://example.com/profile/janedoe123"
},{
"@type": "Person",
"name": "John Doe",
"url": "https://example.com/profile/johndoe123"
}]
}
</script>
</head>
<body>
</body>
</html>
Q&A
「Q&A」は、ユーザーからの質問とそれに対する回答をまとめたものであり、特定のトピックに関する情報を提供する際に効果的です。JSON-LD形式での構造化データでは、質問と回答を明確に示せます。
質問に関する情報には、質問のタイトルや内容、投票数、作成日時、質問者の名前が含まれます。また、最も優れた回答を示す「acceptedAnswer」プロパティを設定することで、ベストアンサーを強調できます。さらに、複数の回答がある場合は、「suggestedAnswer」プロパティを使用して一覧表示することが可能です。
<html>
<head>
<title>How many ounces are there in a pound?</title>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "QAPage",
"mainEntity": {
"@type": "Question",
"name": "How many ounces are there in a pound?",
"text": "I have taken up a new interest in baking and keep running across directions in ounces and pounds. I have to translate between them and was wondering how many ounces are in a pound?",
"answerCount": 3,
"upvoteCount": 26,
"datePublished": "2024-02-14T15:34-05:00",
"author": {
"@type": "Person",
"name": "Mary Stone",
"url": "https://example.com/profiles/mary-stone"
},
"acceptedAnswer": {
"@type": "Answer",
"text": "1 pound (lb) is equal to 16 ounces (oz).",
"image": "https://example.com/images/conversion-chart.jpg",
"upvoteCount": 1337,
"url": "https://example.com/question1#acceptedAnswer",
"datePublished": "2024-02-14T16:34-05:00",
"author": {
"@type": "Person",
"name": "Julius Fernandez",
"url": "https://example.com/profiles/julius-fernandez"
}
},
"suggestedAnswer": [
{
"@type": "Answer",
"text": "Are you looking for ounces or fluid ounces? If you are looking for fluid ounces there are 15.34 fluid ounces in a pound of water.",
"upvoteCount": 42,
"url": "https://example.com/question1#suggestedAnswer1",
"datePublished": "2024-02-14T15:39-05:00",
"author": {
"@type": "Person",
"name": "Kara Weber",
"url": "https://example.com/profiles/kara-weber"
},
"comment": {
"@type": "Comment",
"text": "I'm looking for ounces, not fluid ounces.",
"datePublished": "2024-02-14T15:40-05:00",
"author": {
"@type": "Person",
"name": "Mary Stone",
"url": "https://example.com/profiles/mary-stone"
}
}
}, {
"@type": "Answer",
"text": " I can't remember exactly, but I think 18 ounces in a lb. You might want to double check that.",
"upvoteCount": 0,
"url": "https://example.com/question1#suggestedAnswer2",
"datePublished": "2024-02-14T16:02-05:00",
"author": {
"@type": "Person",
"name": "Joe Cobb",
"url": "https://example.com/profiles/joe-cobb"
}
}
]
}
}
</script>
</head>
<body>
</body>
</html>
パンくずリスト
「パンくずリスト」は、検索結果画面に表示されているページがサイト内のどのカテゴリか、どの階層に位置するかを示す構造化データです。JSON-LD形式での記述例では、「position」プロパティを使用して各階層の位置を指定します。これにより、ユーザーは検索結果を見ている際に、サイトの構造やナビゲーションを把握しやすくなります。
<html>
<head>
<title>Award Winners</title>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "BreadcrumbList",
"itemListElement": [{
"@type": "ListItem",
"position": 1,
"name": "Books",
"item": "https://example.com/books"
},{
"@type": "ListItem",
"position": 2,
"name": "Science Fiction",
"item": "https://example.com/books/sciencefiction"
},{
"@type": "ListItem",
"position": 3,
"name": "Award Winners"
}]
}
</script>
</head>
<body>
</body>
</html>
レシピ・HowTo
「レシピ・HowTo」の構造化データは、料理の材料や作り方の手順をステップ式に表示したり、レビューをリッチリザルトで表示したりできます。
JSON-LD形式での記述例では、レシピの名前や投稿者、画像、説明、キーワード、材料、手順などの情報を指定します。手順はステップごとに詳細に記述され、手順の動画がある場合にはそれも含まれます。これにより、ユーザーは料理の難易度や所要時間、栄養情報などを簡単に把握できます。
<html>
<head>
<title>Non-Alcoholic Piña Colada</title>
<script type="application/ld+json">
{
"@context": "https://schema.org/",
"@type": "Recipe",
"name": "Non-Alcoholic Piña Colada",
"image": [
"https://example.com/photos/1x1/photo.jpg",
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"author": {
"@type": "Person",
"name": "Mary Stone"
},
"datePublished": "2024-03-10",
"description": "This non-alcoholic pina colada is everyone's favorite!",
"recipeCuisine": "American",
"prepTime": "PT1M",
"cookTime": "PT2M",
"totalTime": "PT3M",
"keywords": "non-alcoholic",
"recipeYield": "4 servings",
"recipeCategory": "Drink",
"nutrition": {
"@type": "NutritionInformation",
"calories": "120 calories"
},
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "5",
"ratingCount": "18"
},
"recipeIngredient": [
"400ml of pineapple juice",
"100ml cream of coconut",
"ice"
],
"recipeInstructions": [
{
"@type": "HowToStep",
"name": "Blend",
"text": "Blend 400ml of pineapple juice and 100ml cream of coconut until smooth.",
"url": "https://example.com/non-alcoholic-pina-colada#step1",
"image": "https://example.com/photos/non-alcoholic-pina-colada/step1.jpg"
},
{
"@type": "HowToStep",
"name": "Fill",
"text": "Fill a glass with ice.",
"url": "https://example.com/non-alcoholic-pina-colada#step2",
"image": "https://example.com/photos/non-alcoholic-pina-colada/step2.jpg"
},
{
"@type": "HowToStep",
"name": "Pour",
"text": "Pour the pineapple juice and coconut mixture over ice.",
"url": "https://example.com/non-alcoholic-pina-colada#step3",
"image": "https://example.com/photos/non-alcoholic-pina-colada/step3.jpg"
}
],
"video": {
"@type": "VideoObject",
"name": "How to Make a Non-Alcoholic Piña Colada",
"description": "This is how you make a non-alcoholic piña colada.",
"thumbnailUrl": [
"https://example.com/photos/1x1/photo.jpg",
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"contentUrl": "https://www.example.com/video123.mp4",
"embedUrl": "https://www.example.com/videoplayer?video=123",
"uploadDate": "2024-02-05T08:00:00+08:00",
"duration": "PT1M33S",
"interactionStatistic": {
"@type": "InteractionCounter",
"interactionType": { "@type": "WatchAction" },
"userInteractionCount": 2347
},
"expires": "2024-02-05T08:00:00+08:00"
}
}
</script>
</head>
<body>
</body>
</html>
ソフトウェア アプリ
Webページの本文内で「ソフトウェア アプリ」の情報をマークアップすることにより、そのアプリの詳細をGoogle検索結果によりわかりやすく表示できます。構造化データを使用することで、アプリの名称やカテゴリ、評価、ダウンロード数などの重要な情報が検索結果に表示され、ユーザーは一目でアプリの特長や信頼性を把握できます。
<html>
<head>
<title>Angry Birds</title>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "SoftwareApplication",
"name": "Angry Birds",
"operatingSystem": "ANDROID",
"applicationCategory": "GameApplication",
"aggregateRating": {
"@type": "AggregateRating",
"ratingValue": "4.6",
"ratingCount": "8864"
},
"offers": {
"@type": "Offer",
"price": "1.00",
"priceCurrency": "USD"
}
}
</script>
</head>
<body>
</body>
</html>
動画
「動画」の構造化データは、動画に関する詳細情報を示します。この情報は、動画が検索結果にリストされた際に、サムネイル画像や再生時間などとともに表示されます。ユーザーは、説明文や評価、視聴回数などの情報を確認し、動画の内容や人気度を把握できます。
<html>
<head>
<title>Introducing the self-driving bicycle in the Netherlands</title>
<script type="application/ld+json">
{
"@context": "https://schema.org",
"@type": "VideoObject",
"name": "Introducing the self-driving bicycle in the Netherlands",
"description": "This spring, Google is introducing the self-driving bicycle in Amsterdam, the world's premier cycling city. The Dutch cycle more than any other nation in the world, almost 900 kilometres per year per person, amounting to over 15 billion kilometres annually. The self-driving bicycle enables safe navigation through the city for Amsterdam residents, and furthers Google's ambition to improve urban mobility with technology. Google Netherlands takes enormous pride in the fact that a Dutch team worked on this innovation that will have great impact in their home country.",
"thumbnailUrl": [
"https://example.com/photos/1x1/photo.jpg",
"https://example.com/photos/4x3/photo.jpg",
"https://example.com/photos/16x9/photo.jpg"
],
"uploadDate": "2024-03-31T08:00:00+08:00",
"duration": "PT1M54S",
"contentUrl": "https://www.example.com/video/123/file.mp4",
"embedUrl": "https://www.example.com/embed/123",
"interactionStatistic": {
"@type": "InteractionCounter",
"interactionType": { "@type": "WatchAction" },
"userInteractionCount": 5647018
},
"regionsAllowed": "US,NL"
}
</script>
</head>
<body>
</body>
</html>引用:動画(VideoObject、Clip、BroadcastEvent)スキーマ マークアップ | Google 検索セントラル
構造化データをマークアップする手順
ここでは、Q&A(FAQ)の構造化マークアップの手順についてご紹介します。
ここで使用しているツールはスキーマ マークアップ ジェネレーター (JSON-LD) | TechnicalSEO.comになります。
ツールは英語表記ですが、Google翻訳などの翻訳アプリを使いながら行うと、コードも翻訳されてしまうため、翻訳は使わないようにしましょう。
まずは、「Which Schema.org markup would you like to create?」と表記されている部分をクリックし、行いたいマークアップを選択します。今回は、Q&A(FAQ)のマークアップを行うため、「FAQ Page」を選択します。
「FAQ Page」を選択すると、質問と答えを入力する欄が出てくるので、それぞれを入力します。2つ以上FAQを用意したい場合は「+ ADD QUESTION」ボタンをクリックすることで増やせます。
質問と答えを入力すると、右側にマークアップのコードが作成されます。また、右側にある青いボタンからコードをコピーすることが可能です。
コピーボタンの左にある「G」の赤いボタンをクリックするとTestを行えます。今回は「Rich Result Test」をクリックし、Googleのリッチリザルトテストツールからテストを行います。
遷移先の画面でコードが表示されていることを確認し、「コードをテスト」ボタンをクリックします。
テストが完了すると、「検出された構造化データ」に「よくある質問」が検出され、構造化データが有効になっていることが確認できます。また、「結果をプレビュー」からリッチリザルトのプレビューが行えます。
構造化データの確認方法
構造化データはページの公開前後で確認できます。ここでは、構造化データの確認方法を3つご紹介します。
スキーママークアップ検証ツール
スキーママークアップ検証ツールは、Webページに組み込まれたすべての構造化データを確認できます。リッチリザルトに表示されない構造化データも含まれるため、詳細なテストが可能です。ページURLを入力し、「テストを実行」をクリックすると、数秒で検証結果が表示されるので、エラーや警告がないかを確認しましょう。このツールを使用することで、構造化データの正確性を確認し、SEO対策やユーザーエクスペリエンスの向上に役立ちます。
リッチリザルト テスト
リッチリザルト テストは、スキーママークアップ検証ツールとは異なり、リッチリザルトの対象となるアイテムのみを検出します。リッチリザルトの状況を詳細に確認したい場合に便利です。スキーママークアップ検証ツールとリッチリザルト テストは、目的に応じて使い分けましょう。
URLを入力してテストを開始すると、リッチリザルトの対象となっているアイテムについて検出結果が表示されます。これにより、リッチリザルトの正確性や表示状況を確認し、ユーザーに最適な情報を提供できるよう施策を進められます。
Google Search Console
Google Search Consoleでのテストは、一般的な構造化データチェックツールとは異なり、ページを公開した後に構造化データを確認するためのものです。例えば、「パンくずリスト」のマークアップを確認したい場合は、「拡張」>「パンくずリスト」をクリックします。問題のあるページを特定するために、「無効」と判断されているページをチェックします。
ほかの構造化データを確認したい場合は、「拡張」>「解析不能な構造化データ」を選択し、同様の手順でチェックします。ページに問題がある場合は、理由が表示されるので、それにしたがって修正します。これにより、公開後のサイトの構造化データの正確性を確認し、修正が必要な場合は迅速に対処できます。
構造化データのメリット
ここでは、構造化データをマークアップすることで得られるメリットをご紹介します。
検索エンジンにWebページの内容を伝えられる
構造化データをマークアップすることで、検索エンジンにWebページの内容を正確に伝えられます。これは、検索エンジンによるインデックス(検索エンジンに認識されること)が早く促進されることを意味します。具体的には、Googleなどの検索エンジンは、適切な構造化データを見つけることで、Webページがどのような内容を持っているかを迅速かつ正確に理解できます。
構造化データはSEOの基本的な対策の一つであり、検索エンジンのアルゴリズムにより、検索結果でのページのランキングに影響を与えます。したがって、構造化データの実装は、Webページの内容を検索エンジンに理解しやすくするための重要な手法となります。
検索結果にリッチリザルトが表示されやすくなる
構造化データのマークアップにより、検索結果にリッチリザルトが表示される可能性が高まります。リッチリザルトが表示されると、ユーザーのクリック率が高まることが調査で示されており、ユーザーは求める情報を迅速に見つけることがでます。
構造化データのデメリット
ここでは、構造化データのマークアップにおいてデメリットとなる点をご紹介します。
専門的な知識が求められる
構造化データの実装には、専門的な知識が必要です。構造化データは、JSON-LD形式だけでなくmicrodata、RDFaなどの形式も存在し、それぞれ異なる記述方法を要します。さらに、構造化データには複数のボキャブラリーがあり、新しいボキャブラリーも定期的に追加されます。そのため、構造化データの正確な記述方法を習得し、新しいボキャブラリーについても理解しておく必要があります。
時間と労力がかかる
構造化データの実装には、時間と労力などのリソースが必要です。正確なマークアップを行うためには、細心の注意が必要であり、ミスがあると意図しない構造になってしまうこともあります。そのため、正確なマークアップを行った後、Google Search Consoleなどのツールで検証する必要があります。
デメリットの対処には、自動生成ツールの利用や既存のHTMLを応用する方法が有効です。自動生成ツールを使用することで、手動でHTMLを記述する手間を省けます。また、Google公式ブログなどで紹介されている既存のHTMLをベースにして部分的に改変することで、工数を削減できます。また、構造化データの実装には時間と労力がかかる一方で、慣れればスムーズな実装が可能です。
構造化データを使用してWeb集客数をUPしよう!
この記事では、構造化データの重要性や利点、そして実装における手間や専門知識の必要性について解説しました。構造化データの例や、Googleのリッチリザルト、検索エンジンのインデックスへの効果的な反映方法も紹介しました。構造化データはWebサイトのSEOやユーザー体験の向上に役立つため、正確な実装と定期的な確認が大切です。
クリエイティブバンクではさまざまなマーケティングを支援しています。集客にお悩みの方は、ぜひお気軽に下記のフォームからご相談ください。