SEOに効果あり！最低限抑えておきたいJSON-LDテンプレートまとめ

JSON-LDとは

ページに関する情報（構造化データ）を検索エンジンなど外部に知らせるための共通フォーマットです。

構造化というと、これまではHTMLコンテンツ内にルールに沿ってマークアップするのが主流でしたが、ここ数年でGoogleがJSON-LDを推奨するなど、主流になりつつあります。

JSON-LDはこれまでのHTML内でのマークアップと違い、

HTML構造に依存せずに構造化データを配信できる
ドキュメントとは別になっているので、管理が用意
JSON形式なので見やすい

といったメリットがあります。

構造化データは、Goolgeのリッチリザルトに採用される可能性が高いため、SEO的にも大きな効果が見込めます。

最低限抑えておきたいJSON-LDのテンプレート

JSON-LDは、JSONデータなのでscriptとしてHTML上で記述します。

<script type="application/ld+json">
// JSONデータ
</script>

という形式です。

中身のJSONデータは、

@context
@type
詳細データ

という構造で、@contextと@typeは必須パラメータです。

詳細データは情報によってフォーマットが定められているので、フォーマットに沿って記述します。

また、JSON-LDによる構造化データはサイト単位ではなく、ページ単位で設定し、1ページに複数のJSON-LDデータを記述できます。

サイト情報のJSON-LD

サイトに関する情報です。

<script type="application/ld+json">
{
    "@context": "http://schema.org",
    "@type": "WebSite",
    "name": "WEBZINNE",  
    "url": "https://www.webzinne.com/"
}
</script>

Webサイトなら必ず使うデータで、かつシンプルなので、JSON-LDを覚えるのに最適です。

記事（Article）情報のJSON-LD

記事情報に関するJSON-LDです。@type的には「NewsArticle（ニュース記事）」となっていますが、いわゆる新聞社などが配信するニュース記事だけでなく、ブログやお知らせ記事などにも使えます。

ただし、レビュー記事やレシピ記事など、他のフォーマットが定められている場合は、そちらを使うようにしましょう。

{
  "@context": "https://schema.org",
  "@type": "NewsArticle",
  "mainEntityOfPage": {
    "@type": "WebPage",
    "@id": "https://www.webzinne.com/topics/onh5d2/"
  },
  "headline": "SEOに効果あり！最低限抑えておきたいJSON-LDテンプレートまとめ",
  "image": [
    "/imgs/categories/site-content-hd.png"
   ],
  "datePublished": "2020-03-23T08:00:00+09:00",
  "dateModified": "2020-03-23T08:30:00+09:00",
  "author": {
    "@type": "Person",
    "name": "山田太郎"
  },
   "publisher": {
    "@type": "Organization",
    "name": "WEBZINNE",
    "logo": {
      "@type": "ImageObject",
      "url": "https://www.webzinne.com/amp-logo.png"
    }
  },
  "description": "SEOに効果がある、ページに関する情報（構造化データ）の配信フォーマットJSON-LD。SEO対策として最低限抑えておきたい、JSON-LDのテンプレートをまとめました。"
}
</script>

一気に情報量が増えました。

データを見ていくと、大体が検索結果が使われるようなデータばかりなので、理解しやすいかと思います。

パンくずリストのJSON-LD

パンくずリスト（コンテンツの階層データ）に関するJSON-LDです。検索結果上で、URLを階層的に表示させることができます。

<script type="application/ld+json">
{
  "@context": "http://schema.org",
  "@type": "BreadcrumbList",
  "itemListElement": [{
        "@type": "ListItem",
        "position": 1,
        "item": {
          "@id": "https://www.webzinne.com/",
          "name": "home"
        }
    },{
        "@type": "ListItem",
        "position": 2,
        "item": {
          "@id": "https://www.webzinne.com/topics/",
          "name": "トピックス"
        }
    },{
        "@type": "ListItem",
        "position": 3,
        "item": {
          "@id": "https://www.webzinne.com/topics/onh5d2/",
          "name": "SEOに効果あり！よく使うJSON-LDテンプレートまとめ"
        }
    }]
}
</script>

これまでのデータとは異なり、「itemListElement」パートが、