豊富なスニペットとSchema.orgの語彙で検索結果を改善する
構造化データ 検索結果を視覚的により魅力的で有益な方法で表示することができます。 Searchmetricsの調査によると、Webサイトに構造化データマークアップを追加すると、Googleの検索結果が36%増加します。.
構造化データマークアップは、Google、Bing、およびその他の検索エンジンで次のようにレンダリングされます。 リッチスニペット. リッチスニペットは 強化された検索結果 それを追加 追加情報, 写真、価格、ユーザー評価、その他の特性など、検索エンジンの断片に.
構造化データは、2つの主な理由でより良い検索結果につながります。
- 内容を作ることでHTMLのセマンティクスを拡張します 検索エンジンにとってより理解しやすい.
- 豊富なスニペット - 構造化データの検索エンジン表示 - には、 クリック率の向上 通常の情報より少ない検索結果より.
Schema.orgボキャブラリー
あなたがあなた自身のサイトのための豊富な断片を持ちたいならば、あなたはする必要があります HTMLマークアップに構造化データを追加する. 構造化データは schema.orgの語彙 それはあなたがあなたのコンテンツの性質について検索エンジンに知らせることを可能にします.
Schema.org 提供することを目的とするグーグル、ビング、ヤフーのイニシアチブです。 一連のスキーマ 検索エンジンが理解しやすいように、さまざまな種類のWebコンテンツを記述するため.
Schema.orgの語彙は、 2レベルの階層:
- タイプ: さまざまな種類のWebコンテンツが配置されている 自分の階層に
- プロパティ: 各タイプは一定数のプロパティを持っています
タイプの最初のレベル
こと です 最も一般的な項目 schema.orgの語彙では、他のすべてのタイプの先祖です.
第2レベルの型
の タイプの第2レベル もう少し具体的であり、含まれています イベント, の アクション, の 無形, の クリエイティブワーク, の 場所, の 組織, の 製品, そしてその 人 タイプ。 schema.orgの拡張として利用可能な別の第2レベルのThingもあります。それは 医療機関 タイプ.
タイプの第3レベル
各第2レベルタイプは含んでいます いくつかまたは多くの第三レベルタイプ, 例えばCreativeWorkのサブタイプの一つは 見直し タイプ。より具体的なタイプ(2番目と3番目のレベル)に注意してください。 親のプロパティを継承する (そして第3レベルの場合は祖父母).
下の画像は公式のスキーマブログに掲載されたもので、schema.orgの語彙の階層を視覚化したものです。.
必要なスキーマを探す
必要なスキーマを見つけるために語彙を閲覧してください。たとえば、レシピが豊富なスニペットの場合は、 レシピ CreativeWorkの子であるタイプ。それは、のような多くの特性を持っています 調理時間
, 調理方法
, レシピ成分
, そしてそれ以外にも、その親のプロパティ(CreativeWork)と祖父母のもの(Thing)も継承します。.
Schema.orgは コミュニティプロジェクト, 頻繁に拡張され、新しいバージョンが定期的にリリースされています。必要なスキーマが見つからない場合は、それをSchema.orgコミュニティに提案することができます。また、それらのGithubプロジェクトに貢献することもできます。.
マークアップに構造化データを追加する
それでは、フロントエンドコードにスキーマをどのように追加しますか。 Schema.orgは使用することができます 3つの異なるフォーマット. あなたはあなたのサイトに構造化データマークアップを追加するために一つを選ぶ必要があります。理論的には同じサイトで複数のフォーマットを使用することができますが、コードの読みやすさと保守性が損なわれるため、あまり良い方法ではありません。.
の 3つの主なフォーマット 構造化データマークアップの概要は次のとおりです。
- マイクロデータ: これはHTMLを次のように拡張するWeb標準です。 新しい属性を導入する といった
itemprop
. schema.orgの公式Webサイトには、microdataの使用方法に関する素晴らしいチュートリアルがあります。そのため、既にHTMLに精通している場合は、この形式を選択することをお勧めします。. - RDFa: RDFaの長い形式は 属性内のリソース記述フレームワーク, それは、一連の特定の属性を使用してHTML、XML、およびSVG文書を拡張するW3C勧告です。 FacebookのOpen Graph ProtocolもRDFaに基づいているので、おそらくあなたはすでにそれに遭遇しているでしょう。初心者のためのRDFa Liteバージョンと、精巧な方法で構造化データを扱うための多くのオプションを提供するフルバージョンもあります.
- JSON-LD: 他の2つのオプションはHTMLマークアップを拡張しますが、JSON-LDはHTMLマークアップを使用します。 JSON 構文。 JSON-LDの略 リンクデータのJavaScriptオブジェクト表記, 彼らの考えによれば、これはGoogle Developersが推奨するフォーマットです。「構造化データマークアップはJSON-LDフォーマットで表現するのが最も簡単です」。 JSONを使用するためにJavaScriptの専門家である必要はありません。名前と値のペアを使用する単純な表記法システムであるためです。.
あなたは簡単に便利なタブの助けを借りて3つのフォーマットを比較することができます それぞれのschema.org Typeページの一番下に.
例を詳しく調べることで、各フォーマットがどのように機能するのかを簡単に理解して、自分のサイトでそれらのうちの1つを使用することができます。.
コードに追加する必要がある構造化データマークアップは、 schema.orgの語彙に基づく. microdataまたはRDFaを選択した場合は、通常のHTMLタグに追加の属性を追加する必要があります。.
例えば マイクロデータ付き, を使用して、Typeの名前をコンテナに追加します。 アイテムスコープ
属性、および各プロパティの itemprop
属性。これはとても簡単な例です。
私のレシピ
レシピの説明
そして同じ例 RDFaを使う, ここで使用する必要があるさまざまな属性に注意を払う価値があります。
私のレシピ
レシピの説明
あなたが選択した場合 JSON-LDフォーマット, あなたのコードを配置する必要があります の中 頭の中のタグ HTMLページの上記の例は次のようになります。
構造化データを使用するためのヒント
構造化データマークアップをテストする
サイトに構造化データマークアップを追加する前に、GoogleのStructured Data Testing Toolを使用してそれをすばやくテストできます。こうすればあなたがあればすぐに問題を見つけることができます.
Google Knowledge Graph Cardsを活用する
Googleは、リッチスニペットに構造化データを使用するだけでなく、特定のコンテンツタイプに対する権限を持っている場合は、そのコンテンツも いずれかのナレッジグラフカードに表示されます 一部の検索エンジン結果ページの右側に表示されます。.
Googleにコンテンツのナレッジグラフカードを表示させることはできませんが、構造化データマークアップが適切に設定されていれば可能性があります。.
Googleリッチカードを利用する
2016年5月に、Googleは導入しました リッチカード それは「現在のRich Snippetsフォーマットのアップグレード」であり、魅力的なモバイル検索結果を提供します。 カルーセルで提示 左右にスクロールすると閲覧できます。 Google Rich Cardsは、構造化データマークアップとschema.orgの語彙も使用しています。.
電子メールに構造化データを追加する
構造化データマークアップを使用できます あなたのメールに 受信者のためにGoogle Now Cardsをトリガーするために、Google Developersはそれをする方法に関する素晴らしいチュートリアルを持っています.
構造化データを動的に生成する
Googleタグマネージャを使用して 構造化データを動的に生成する JSON-LDフォーマットで、Moz.comはそれを行う方法をあなたに教えます.