JSON-LDとは｜SEO効果やメリット、構造化マークアップについて具体例付きで解説
「JSON-LDはどう効果がある？」
「JSON-LDの記述の仕方がわからない」
JSON-LDは、Webページの情報を構造化し、検索エンジンが理解しやすくするためのデータ形式です。SEO対策でJSON-LDを検討はしてみても、構造化データの書き方、また、どう効果があるのか、わからない方も多いでしょう。
本記事では、JSON-LDの基本から、実際の記述方法に至るまで、具体的な例を挙げてわかりやすく解説しています。JSON-LDの使用で得られるメリットやSEOへの影響についても詳しく説明しています。
HTMLへの記述に慣れていない方でも、シンプルな構造のJSON-LDは使いやすいフォーマットです。ぜひ最後までご覧いただき、自社サイトの改善にお役立てください。
JSON-LDの基本概念
ウェブ上の情報を整えて、検索エンジンに伝える手段として「構造化データ」があります。このデータを記述する際のシンプルな形式が「JSON-LD (JavaScript Object Notation for Linked Data) 」です。読み方はジェイソンエルディーです。
本章では、JSON-LDと構造化データについてわかりやすく解説しています。
それでは、順番にみていきましょう。
JSON-LDとは？
JSON-LDとは、構造化データを記述するためのフォーマットの一つで、Googleからも推奨されています。構造化データとは、Webサイトのコンテンツに意味を与え、検索エンジンが内容を理解しやすくするものです。
JSON-LDは、JSONというデータ形式を使って、HTMLの中に<script>タグで記述します。JSON-LDのメリットは、コードがシンプルで見やすくなり、HTMLのどこにでも記述できる点です。
JSON-LDは、構造化データのボキャブラリーとしてschema.orgを使用しており、この2つは、セットで利用します。
JSON-LDを使うと、情報が正確に検索エンジンに伝わります。検索結果でわかりやすく表示されるため、インターネット上で情報を探している人たちが、簡単に正確な情報を見つけられるでしょう。
構造化データとは？
構造化データとは、Googleなどの検索エンジンにウェブページの内容をわかりやすく伝えるためのHTMLマークアップです。
HTMLのタグ付けは、検索エンジンに対して文字列が単なる記号でなく、具体的な意味を持つと伝えます。これにより、文章の内容を適切に解釈し、相違ない認識が可能になりました。
例えば、人名や日付をただの文字列と認識するのではなく「大阪 花子」という名前が人物である、「2023年11月7日」が日付であると検索エンジンが理解できるのです。
この方法を採用すると、リッチスニペット（※後述）によって検索結果が魅力的に表示されるため、クリック率の向上が期待できます。これは、SEOにおける大きな利点です。
構造化データは、単なる情報ではなく意味のある知識としてウェブ上に残り、検索エンジンにとって価値のあるコンテンツとして認識されます。
＼お気軽にLINEでweb集客無料相談実施中／
LINE登録後、いくつかの質問に入力頂ければ、担当者がご対応いたします。
チャットやzoomで相談を承っております！
構造化データと関連単語
構造化データは、ウェブページの情報を整理し、検索エンジンが内容を正確に理解しやすくします。
本章では、構造化データに必要な関連単語について解説します。
- htmlのmeta情報としてのJSON-LD
- schema.orgとの関係
- ボキャブラリ、シンタックス、W3Cの役割
順番にみていきましょう。
htmlのmeta情報としてのJSON-LD
JSON-LDはウェブページの内容を、検索エンジンへ正確に伝達するために使われる構造化データのフォーマットです。
このフォーマットは総称して「シンタックス」と呼ばれ、JSON-LDはその1つです。ほかにも「RDFa」や「Microdata」があります。シンタックスのなかで「JSON-LD」はGoogleから推奨されているため注目されてます。
さらに、JSON-LDは、HTML内のどこにでも簡単に挿入できるため大変使い勝手がよいです。構造化データをマークアップする際には頻繁に利用されてるフォーマットです。
schema.orgとの関係
JSON-LDは、構造化データをウェブページに埋め込む時のフォーマットの1つです。しかし、JSON-LDだけでは構造化マークアップは完成せず、必ず、言葉に意味を持たせる「ボキャブラリー」が必要となります。
「schema.org」は、Googleも推奨している最も一般的なボキャブラリーです。schema.orgとJSON-LDを組み合わせることで標準的なSEO対策となります。
実際にschema.orgとJSON-LDを使用したマークアップの例を紹介しましょう。
| <script type=”application/ld+json”>{ “@context”: “http://schema.org”, “@type”: “Organization”, “name”: “株式会社ABC”, “url”: “https://www.abc.com”, }}</script> |
上記のように記述すると、検索エンジンへは以下のように意味を伝えられます。
- @type：組織の話題
- name：会社名
- url：会社のURL
JSON-LDは、schema.orgのデータを簡単にコーディングできるようにする形式です。このおかげで、ウェブの情報が検索結果に正確に表示されるようになります。
ボキャブラリ、シンタックス、W3Cの役割
ウェブの構造化データとは、ウェブコンテンツに意味を与え、検索エンジンが内容を正しく理解しやすくするものです。構造化データを記述するには、ボキャブラリーとシンタックスという二つの要素が必要です。
- ボキャブラリ：
ウェブ情報に意味を割り当てる辞書の様な役割を果たします。例として「Schema.org」があり、名前なら”name”、住所なら”address”のように表現します。
- シンタックス：
この情報をどう整理するかというルールをの提供です。JSON-LDは、Googleが推奨するシンタックスで、構造化データの記述に適しています。
W3Cは、ウェブ標準を定める国際的な組織で、ウェブ上の情報が広く正しく共有されるための基盤を築いています。
JSON-LDを使った実際の記述
本章では、JSON-LDを使い記述する方法を、実際の記述例とともに3つ紹介します。
- schema.orgの記述例
- WEBサイト(TOPページ)の場合
- 商品ページ、イベント情報掲載ページの例
それでは、順番にみていきましょう。
schema.orgの記述例
JSON-LD (JavaScript Object Notation for Linked Data) は、データを構造化するための一般的なフォーマットの1つです。schema.orgとの組み合わせによる使用で、さまざまな種類のデータをウェブページに埋め込めます。
| <script type=”application/ld+json”>{ “@context”: “http://schema.org”, “@type”: “Organization”, “name”: “Your Company Name”, “url”: “https://your-company-website.com”, “logo”: “https://your-company-website.com/logo.png”, “contactPoint”: { “@type”: “ContactPoint”, “telephone”: “+1-123-456-7890”, “contactType”: “Customer Service” }}</script> |
WEBサイト(TOPページ)の場合
| <script type=”application/ld+json”>{ “@context”: “http://schema.org”, “@type”: “WebSite”, “name”: “Your Site Name”, “url”: “https://your-website.com”, “potentialAction”: { “@type”: “SearchAction”, “target”: “https://your-website.com/search?q={search_term_string}”, “query-input”: “required name=search_term_string” }}</script> |
商品ページ、イベント情報掲載ページの例
商品ページやイベント情報ページでは、具体的な商品やイベントに関する情報を詳細に記述します。これにより、ユーザーが検索結果で詳細情報をすぐに確認できるようになります。
商品ページのコードの例
| <script type=”application/ld+json”>{ “@context”: “http://schema.org”, “@type”: “Product”, “name”: “Product Name”, “image”: “https://your-website.com/product-image.jpg”, “description”: “Detailed product description.”, “brand”: { “@type”: “Brand”, “name”: “Brand Name” }, “offers”: { “@type”: “Offer”, “price”: “99.99”, “priceCurrency”: “USD” }}</script> |
イベントページのコードの例
| <script type=”application/ld+json”>{ “@context”: “http://schema.org”, “@type”: “Event”, “name”: “Event Name”, “startDate”: “2023-11-01T18:00”, “location”: { “@type”: “Place”, “name”: “Venue Name”, “address”: { “@type”: “PostalAddress”, “streetAddress”: “Street Address”, “addressLocality”: “City”, “postalCode”: “Zip Code”, “addressCountry”: “Country” } }}</script> |
JSON-LDを利用するメリットとSEOへの影響
JSON-LDを使うと、ウェブサイトのSEOを強化し、データ管理をシンプルにできます。以下にそのメリットを解説します。
- ウェブページの情報を構造化し、検索エンジンの理解を深める
- ページのどこにでも記述可能
- 既存のHTMLに影響を与えずにマークアップ可能
- HTML要素は不要
- 適切な知識があれば、簡単にデータを構造化できる
MicrodataやRDFaは特定箇所にコードが必要のためHTMLが複雑です。しかし、JSON-LDは場所を選ばず簡単にマークアップでき、HTMLの管理がしやすくなります。
構造化マークアップは、検索結果でのリッチスニペット（※後述）表示が期待できます。サイトへの滞在時間の増加やアクセス向上に繋がるため、効果的なSEO対策となるでしょう。
JSON-LDの活用方法
構造化データとは、検索エンジンが内容を理解しやすいようにウェブページの情報を整理する方法です。JSON-LD以外にも、MicrodataやRDFaといった構造化データのフォーマットが有名です。
JSON-LDはその中でも特に編集が簡単で、ウェブデザインへ与える影響を最小限に抑えられます。さらに、構造化データにより検索画面がリッチスニペットされ、検索結果の強化が可能です。
JSON-LDがリッチスニペットとどのように関連しているか、ウェブページが単一の情報に特化している場合のメリットを紹介しましょう。
リッチスニペットとの関係
リッチスニペットとは、検索結果で情報を目立たせる表示方法です。通常のスニペットは「タイトル、URL、説明文」の表示に限られます。一方、リッチスニペットでは「星評価、価格、在庫情報、画像など」の追加情報も表示されるのです。
画像や星評価などが加わると、ウェブページの内容が一目で理解しやすくなり、CTR向上が見込めます。ユーザーは、適切な情報に迅速にアクセスできるようになります。
JSON-LDは、このリッチスニペットを効率的に生成するフォーマットです。構造化データの提供により、検索エンジンが情報を解釈しやすくなります。結果として、ウェブサイトは目立つ検索結果を得られ、ユーザー増加に繋がるのです。
1ページ1情報の場合のメリット
1ページ1情報の場合、JSON-LDの活用は特に有効です。HTMLのコード内に複雑なmicrodataを埋め込む必要がなく、ページをスッキリさせるからです。そのため、メンテナンスもしやすくなります。
ただし、複数の情報が含まれるページでは、各項目に対してmicrodata形式を用いて、タグごとに構造化データを明記する必要があります。
ページ内容に合わせた構造化データ形式の選択が大切です。
まとめ
本記事では、検索エンジンがウェブページの情報をしっかりと把握できるよう、JSON-LDを使用したデータの整理方法を紹介しました。
JSON-LDはHTMLに影響を与えずに情報を整理するフォーマットです。単独での使用はできず、ボキャブラリのschema.orgと組み合わせて使用します。
Googleが推奨するJSON-LDとschema.orgを用いた構造化マークアップは、SEO対策にも効果的です。適切にマークアップされたデータは、リッチスニペットの生成に役立ち、ユーザーのクリック率を向上させる可能性があります。
JSON-LDの技術を身につけて、より魅力的なウェブページ作りを目指しましょう。
