JSON-LD構造化データを実装するためのガイド
公開: 2021-07-19Webサイトでスキーママークアップを使用してリッチスニペットを有効にし、SERPでの存在感を高めることは新しい戦略ではありません。 ただし、一般的に、新しいクライアントは以前に実装を控えていたか、時間やリソースの不足のために苦労していた可能性があります。
しかし、インラインマイクロデータを実装する際の頭痛の種は過去のものです。 Googleはサポートしているだけでなく、JSON-LD(リンクトデータのJavaScriptオブジェクト表記)を使用することをお勧めします
構造化データの場合、これは大きな前進です。 つまり、インラインのマイクロデータをハードコーディングする代わりに、GoogleはJavaScriptをクロールして構造化データにアクセスするようになります。
これは素晴らしいことです。JSON-LDは操作が簡単で、気になる場合は読み取りと書き込みが簡単だからです。 さらに、構造化データを実装する方法がこれまでになく増えています。
「しかし、JavaScriptの書き方がわからない場合はどうなりますか?」
良い知らせはこれだけではありません。 この投稿では、構造化データを実装するための最も簡単な方法のいくつかを紹介し、JSON-LDについて学習するための非常に役立つリソースをいくつかリストします。
Googleのデータハイライターツール
まず、Google検索コンソールの蛍光ペンツールを使用するオプションがあります。このツールを使用すると、コードを1行も表示せずに構造化データを実装できます。
記事、イベント、製品、地域のビジネス情報など、さまざまなデータのスキーマを追加できます。 ツールはページのプレビューを提供するので、特定のコンテンツを直接強調表示して、次のようにマークアップを追加できます。

これは、構造化データをWebサイトに追加するための最も簡単で迅速な方法です。 では、なぜわざわざそれを難しい方法で行うのでしょうか。
さて、問題は、グーグルのデータハイライターがグーグルとしか話さないということです。 したがって、開始するのに最適な場所ですが、そこで停止するべきではありません。
Googleが構造化データを使用する方法は継続的に発展しています。 ごく最近、モバイルでのリッチカードの発表がありました。

Googleだけに限らず、ソーシャルメディアの巨人がこのデータを活用する方法を見つけました。 たとえば、Pinterestを使用すると、Rich Pinsで商品、レシピ、場所などに関するデータを取得できます。
Googleの蛍光ペンツールではできない、スキーママークアップでできるクールなことがたくさんあります。 たとえば、ASOSが以下に示すように、ソーシャルメディアプロファイルをナレッジパネルに追加してみませんか。

おそらく、BuzzFeedのようなサイトリンク検索バーを以下に追加して、SERP内からWebサイト内を検索できるようにする必要があります(これはメタです)。

上記のすべての理由から、Googleのデータハイライターツールを短期的なソリューションとして使用することを強くお勧めします。また、将来の証拠となるソリューションとして、Webページにスキーママークアップをコーディングすることをお勧めします。 これにより、構造化データの完全な所有権と管理が可能になります。 また、Bingやその他の小規模な検索エンジンでもメリットがあります。
スキーママークアップを追加する簡単な方法
WebサイトがWordPress上にある場合は、RavenのSchemaCreatorなどのプラグインを利用できます。 この便利なツールは、プロセスをガイドし、作成するスキーマごとにショートコードを作成して、後で編集できるようにします。

WordPressを使用せずに、JSON-LD構造化データを手動でコーディングしたい場合、または主題について詳しく知りたい場合は、ここでGoogle TagManagerが役立ちます。
Googleタグマネージャーを使用して構造化データをプッシュする
JSON-LDをサポートする検索エンジンのエキサイティングな点は、Google Tag Managerなどのタグ管理システムによって動的に挿入された場合でも、HTMLの任意の場所で取得されることです。
JSON-LDでグリップを取得する
始める前に、JSON-LDに慣れるために時間を費やす必要があります。 幸いなことに、オンラインで役立つリソースをたくさん見つけることができますが、それでも自信がない場合は、JSON-LDの使用経験がある開発者またはマーケティングの専門家に相談する必要があります。
開始するためのリンクは次のとおりです。
- タイプ別にリストされたSchema.orgのドキュメント。
- JSON Playgroundは、上記のリンクにある情報を試してみるのに最適な場所であり、開始するのに役立つ例がいくつかあります。
- 開発者JamesFlynnによるJSON-LDジェネレーター。非常に使いやすく、大変な作業を行います。
- 検索エンジンニュースの実際の構造化データガイド。実際のリッチスニペットの例が含まれています。
ステップバイステップガイド
次に、タグマネージャーを使用してJSON-LS構造化データをプッシュして開始する簡単な例を見てみましょう。 注:マーケティングタグと分析タグの展開と管理にGTMをまだ使用していない場合は、この簡単なセットアップとインストールのガイドをお読みください。

ステップ1–タグを追加する
まず、新しいタグを追加します。 
ステップ2–タグに名前を付ける
タグに意味のある名前を付けます。 この例では、組織スキーママークアップの追加に集中します。 
ステップ3–カスタムHTMLタグを選択する
独自のJSON-LDマークアップを使用しているため、カスタムHTMLタグオプションを選択して、続行を押す必要があります。

ステップ4–JSON-LDマークアップを入力します
次に、HTMLボックスにマークアップを入力する必要があります。 この例では、ここにある組織にJSON-LD形式を使用しました。
ステップ5–タグをいつ起動するかを選択します
この特定の設定では、すべてのページでfireを選択します。これは、「Organization」マークアップであり、サイト全体であるためです。 これを行うには、タグを保存する前に「すべてのページ」を選択するだけです。 これで私の実装は完了です。 
特定のページまたはページのグループに固有のスキーマを追加する場合は、「一部のページ」オプションを使用して特定のページを指定できます。

連絡先ページにローカルビジネス情報を追加する場合、またはマークアップするビジネスの場所が複数ある場合は、これを行うことをお勧めします。
ヒント:ページのグループを指定する場合は、ページURLの「含む」操作またはRegEx(正規表現)操作を使用できます。
別のヒント:構造化データ(コード)を単一のカスタムHTMLタグまたはタグの論理グループに結合して、コンテナー内のタグの数を減らすことができます。
ステップ6–テスト
Googleタグマネージャーのプレビューモードとデバッグモードを使用して、タグが起動されているかどうかをテストできますが、タグマネージャープラットフォームの外部で機能していることを確認する必要もあります。

GoogleとBingはどちらも、構造化データをテストし、すべてが正常に機能することを確認するための便利なツールを備えています。 最初にタグマネージャーでコンテナーバージョンを公開することを忘れないでください。
- Googleの構造化データテストツール
- Bingのマークアップバリデーター

プラグイン、タグマネージャーを使用したか、スキーマをハードコーディングしたかに関係なく、実装をテストするときは、これらの無料ツールを使用してください。 Googleは最近、ツールにいくつかの改善を加え、ハイライト、検索と置換、オートコンプリートなどの機能を改良しました。
このメソッドを使用すると、JSON-LDスニペットを1つまたは複数のページに問題なく挿入できます。 ただし、より技術的になり、タグマネージャーを使用してスニペットを動的に生成する場合、たとえば{{page URL}}を使用する場合は、機能しません。 Chris Goddardは最近、この問題の回避策を含むすばらしい投稿をMozブログに書きました。
結論
過去数年間の最近の開発により、Webサイトでのスキーママークアップの実装がはるかに簡単になりました。 Google独自のデータハイライターツールは、Googleの利益のためにスキーマをすばやく追加する簡単な方法ですが、プラグイン、Googleタグマネージャーを使用するか、手動でスキーマをコーディングすることをお勧めします。
JSON-LD構造化データの実装は、スキーママークアップをフォーマットするための最も広く受け入れられ、推奨される方法です。 検索結果にリッチスニペットまたはリッチカードが表示されることを保証するものではありませんが、正しく実装されていれば、検索エンジンに可能な限り最高のデータを提供することを妨げるものではありません。
Webサイトに構造化データを実装する際にサポートが必要な場合は、ご連絡ください。
ご不明な点がございましたら、お気軽にお問い合わせください。
