schema.orgで構造化マークアップを導入してクリック率を上げたい-JSON編

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

構造化マークアップとは、テキスト情報をマークアップしてクローラーが理解できるようにタグ付けしたものを指します。
構造化マークアップをきちんと実装すると、副次的効果として検索結果の表示が変化することがあります。
商品のレビューやパンくずリストを検索結果に表示することができ、ページの内容が検索ユーザーに伝わりやすくなるため、クリック率が上がります。
こういった、検索結果で表示される情報(スニペット)の情報を豊か(リッチ)にすることをリッチスニペットといいます。
今回はJSON-LDでschema.orgの構造化データをしてみます。
HTMLで構造化サンプルはこちら

WebSite

TOPページに書きます。

<script type="application/ld+json">{ "@context": "http://schema.org", "@type": "WebSite", "url": "ウェブサイトURL", "name": "ウェブサイト名", "publisher": { "@type": "Organization", "name": "組織の名前", "url": "組織のURL", "logo": { "@type": "ImageObject", "url": "組織のロゴURL", "width": 横幅, "height":  }, "address": { "@type": "PostalAddress", "postalCode": "組織の郵便番号", "addressRegion": "組織の都道府県", "addressLocality": "組織の市町村", "streetAddress": "組織の住所その他" } }, "image": { "@type": "ImageObject", "url": "ウェブサイトのイメージ画像", "width": 横幅, "height":  }}</script>
JavaScript

パンくず

<script type="application/ld+json">{ "@context": "http://schema.org", "@type": "BreadcrumbList", "itemListElement": [ { "@type": "ListItem", "position": 1, "item": { "@id": "親ページのURL", "name": "親ページの名前" } }, { "@type": "ListItem", "position": 2, "item": { "@id": "2階層目のURL", "name": "2階層目の名前" } }, { "@type": "ListItem", "position": 3, "item": { "@id": "3階層目のURL", "name": "3階層目の名前" } } ]}</script>
JavaScript

Article、NewsArticle、BlogPosting

"@type":"Article"の中身を適当に変更してください。
基本的にはニュースサイトはArticleもしくは、NewsArticleになります。ブログの場合はBlogPostingを使用します。

<script type="application/ld+json">{ "@context":"http://schema.org", "@type":"Article", "mainEntityOfPage": { "@type": "WebPage", "@id": "記事のURL" }, "headline":"記事タイトル", "image":"記事のイメージ画像URL", "datePublished":"記事公開日", "dateModified":"記事更新日", "author":{ "@type":"Person", "name":"作者の名前" }, "publisher":{ "@type":"Organization", "name": "ウェブサイト名", "url": "ウェブサイトURL", "logo": { "@type": "ImageObject", "url": "ウェブサイトのイメージ画像URL", "width": 横幅, "height":  } }, "description":"記事の説明分"}</script>
JavaScript

read next