構造化データ「JSON-LD」

構造化データ「JSON-LD」↓これについて。

<script type="application/ld+json">
  {
    "@context": "http://schema.org",
    "@type": "NewsArticle",
    "headline": "Open-source framework for publishing content",
    "datePublished": "2015-10-07T12:02:41Z",
    "image": [
      "logo.jpg"
    ]
  }
</script>

構造化データ と JSON-LD の簡単な説明

構造化データ

検索エンジンやその他のクローラーへWebサイトのコンテンツを構造的に把握できるように提示したもの。
構造化データを記述することにより、検索結果がより最適化される可能性がある。
Choose a structured data feature  |  Search  |  Google Developers

構造化データの記述方法（シンタックス）には、以下3タイプある。

• Microdata
• RDFa
• JSON-LD（Google推奨）

また大きな違いは、記述する場所にあると思う。（HTML要素毎 or データ形式）
参考：schema.org

JSON-LD

「JavaScript Object Notation - Linked Data」の略。2014年1月16日に正式にW3C勧告。 JSONは、文字列に意味を持たせる機能を持っていなかったが、JSON-LDによって文字列に意味を持たせることが可能となった。

---

📝参考資料
JSON-LDでschema.orgの構造化データ導入をより簡単に

JSON-LD のメリット・デメリット

Google推奨 というのが大きなメリットだが、他のシンタックスと比べたときのメリットとデメリットを考えてみた。

メリット

• HTML内のどこにでも記述できるため、マークアップを汚染しない。
• マークアップの構造が変わっても影響が出ない。
• データ形式で記述するため、完結明瞭で視認性があがる。

デメリット

• HTML本文 と JSON-LD で同じ内容を2回書くことになり、テキスト修正などが入った場合に修正漏れのリスクがある。
• 誤った内容を記述するとスパムと思われたり、ランクが下がったりなど、検索結果に影響する事もあるので要注意！
• JSON-LD の記述分、HTMLが長くなり、パフォーマンスに影響があるかも。

---

😇デメリットの解決方法（個人的な意見）

• 同一テキストを2回書くことについて
  テンプレートエンジンを駆使して、一箇所に入力したテキストを流用するできるようにすれば、同じことを2回書かなくて済むと思った。

• パフォーマンスについて
  </body> の直前に記述したり、視認性は悪くなるが最悪圧縮したりすれば、表示速度への影響は少ないかと思う。

Googleでの構造化データの扱い方

1. Google 構造化データに関するガイドラインを読む
   Understand how structured data works  |  Search  |  Google Developers

   💡重要: 構造化データが検索結果に表示されるとは限りません。

2. 機能を選んで書いてみる
   Choose a structured data feature  |  Search  |  Google Developers

3. コードが書けたらテストする
   構造化データ テストツール

4. 公開後、エラー率を定期的に監視する
   Rich result status reports - Search Console Help

---

😇参考までに

• JSON-LD の書き方がわかりやすく記載されてた。 qiita.com

まとめ

コーポレートサイトやECサイトなど、まずは、パンくずリストから始めよう。ただし、必ずしも検索結果に表示されるわけではないので、時間があるときなど、状況に合わせて使用を試みるといいかなと思う。

JSON-LD を追加したパンくずリスト を作ってみた。
ぱんくずリスト（JSON-LD + WAI-ARIA） · GitHub