WordPressにスキーママークアップを実装するためのクイックガイド

公開: 2020-05-13

あなたは美しいルックスと素晴らしい機能を備えたウェブサイトを立ち上げました。 それで、次は何ですか？ 検索エンジンでコンテンツをランク付けしてオーガニックトラフィックをもたらすことをSEOに適したものにします。 消化しにくいものの、理解しなければならない技術的要素がたくさんあるので、少し難しい作業のように見えるかもしれません。 しかし、あなたがあなたのウェブサイトのSEOについて真剣に考えているなら、あなたはすべてのSEO関連のトピックの全体的な見方を持っている必要があるでしょう。 そのようなトピックの1つは、スキーママークアップの実装です。

スキームマークアップと構造化データは、SEOで長年にわたって優れた役割を果たしており、Google、Bing、Yahooなどの主要な検索エンジンがそれらを推奨しているようです。 しかし、スキーママークアップとは正確には何であり、それはサイトのSEOプロセスにどのように影響しますか？ この記事を読んだ後、それが何であるか、それがSEOと検索エンジンにどのように影響するか、より良いランキングを得るためにそれを正しく実装する方法を正確に知るでしょう。

目次

構造化データとスキーママークアップとは何ですか？

構造化データは、普遍的に理解できる情報形式です。 これには、検索エンジンがページの内容を簡単に判断できるようにするさまざまな要素が含まれています。

スキーママークアップは基本的にあなたのウェブサイトを検索エンジンに置くコードです。 その主な目的は、検索エンジンをユーザーにとってより有益なものにすることです。

コードの形式でWebページに追加して、日付、画像、営業時間などのさまざまな要素を定義できます。

SEOにおけるスキーママークアップの利点

SEOに関しては、スキーママークアップで表される構造化データは、検索エンジンの結果をより詳細で有益な方法で表示します。 それはウェブサイトをよりSEOフレンドリーにするだけでなく、ウェブサイトにより多くのトラフィックを引き付けるために豊富な結果を表示することもできます。

検索エンジンに表示されるさまざまな種類の豊富な結果

以前、検索エンジンで豊富な結果を表示するためのスキーママークアップの利点について説明しました。 スキーママークアップがWebサイトに実装されている場合、検索エンジンに表示される豊富な結果の一部を次に示します。

リッチスニペット

スキーママークアップの実装

リッチスニペットは、検索結果に表示されている間、評価、レビュー、画像などの追加情報を含む結果です。 これは、ユーザーがページ/投稿について詳しく知るのに役立ち、クリックスルーを取得する可能性が高くなります。

リッチカード

スキーママークアップの実装

リッチカードは、検索エンジンに結果を表示するための新しい形式です。 リッチスニペットと同様に、リッチカードはスキーママークアップを使用して、検索結果をより魅力的で視覚的に魅力的な形式で表示します。 より優れたモバイル検索エクスペリエンスの提供に重点を置いており、タッチ操作に適したスワイプオプションが付属しています。

知識グラフ

ナレッジグラフは、画像、場所、連絡先情報、説明、ソーシャルメディアプロファイルを表示することにより、情報をさらに詳細にするために検索エンジンで使用されるナレッジベースです。

注目のスニペット

スキーママークアップの実装

注目のスニペットは、ユーザーが質問に直接回答できるようにするための検索エンジン形式です。 リッチスニペットのような追加情報は含まれていませんが、特定の結果をクリックすることなく、ユーザーに簡潔な回答を提供します。

Webページにスキーママークアップの実装を開始するにはどうすればよいですか？

スキーママークアップはさまざまな方法で実装できます。 以下にそれらのいくつかを示します。

Microdataを使用してスキーマを追加します。

Microdataは、HTML5で導入されたタグのセットであり、機械可読タグでHTML要素に注釈を付ける簡単な方法を提供することを目的としています。 初心者が実装するのに適したマークアップを使用するのはかなり簡単です。 ただし、欠点は、Webページの本文内で各アイテムを個別にマークアップする必要があり、混乱する可能性があることです。

ただし、始める前に、Webページで定義されているアイテムタイプを確認する必要があります。 使用する必要のあるタグのタイプを判別するのに役立ちます。

ここでは、HashThemesというオンラインストアを所有していて、そのホームページは次のようになっていると想定します。 

 <div>
<h1> HashThemes </ h1>
<h2> WordPressテーマのベストセラー！</ h2>
<p>住所：</ p>
<p>ドビガット</p>
<p>ネパール、ラリトプル</ p>
<p>メール：[email protected] </ p>
<p> <a href="https://hashthemes.com/wordpress-theme/">ここをクリックして、最高のWordPressテーマを表示してください！</a> </ p>
<p>営業中：</ p>
<p>月曜から金曜の午前10時〜午後6時</ p>
</ div>

まず、Webページのセクションを特定する必要があります。 <div>タグの間のすべてです。 だから、私たちは追加します

 <div itemscope>

itemスコープタグを追加することで、between <div>タグブロックに含まれるHTMLを指定して、特定のアイテムを参照できます。

次に、item type属性を使用して、ページ上のアイテムのタイプを指定します。 

 <div itemscope itemtype = "http://schema.org/wordpressthemes">

次に、ホームページに移動して、WebページのWebサイトの名前が付いている部分にタグを付けます。 ここでは、アイテムのプロパティにラベルを付けるアイテムプロップタグを追加します。 

 <h1 itemprop = "name"> HashThemes </ h1>

先に進み、残りのページにもタグを追加します。

場合によっては、行全体にタグを付ける必要はないかもしれませんが、メールアドレス行のようにプロパティが参照される行の一部にタグを付ける必要があります。 

 <h2 itemprop = "description"> WordPressテーマのベストセラー！</ h2>
<p>住所：</ p>
<span itemprop = "address" itemscope itemtype = "http://schema.org/PostalAddress">
<p itemprop = "streetAddress"> Dhobighat </ p>
<p itemprop = "addressLocality">ネパール、ラリトプル</ p> </ span>
<p>メール：<span itemprop = "email"> [email protected] </ span> </ p>
<p> <a itemprop = "store" href = "https://hashthemes.com/wordpress-theme/">ここをクリックして、最高のWordPressテーマを表示してください！</a> </ p>
<p>営業中：</ p>
<pitemprop="openingHours">月曜から金曜の午前10時から午後6時</p>
</ div>

また、Google構造化データマークアップヘルパーを使用して、ウェブページにタグを付けるのを簡単にすることもできます。

RDFaを使用したマークアップの追加

属性のリソース記述フレームワーク（RDFa）は、構造化データのマークアップを支援するように設計されたHTML5の拡張機能です。 これはW3C勧告であり、複数の構造化データの語彙を組み合わせて、Schema.orgを超える構造化データを追加するために使用できます。

Schema.orgでMicrodataマークアップを使用する方法を知っている場合、RDFaも同じです。 コンテンツの本文に既存のHTMLを統合します。

上記のeコマースサイトを例として使用してみましょう。 

 <div>
<h1> HashThemes </ h1>
<h2> WordPressテーマのベストセラー！</ h2>
<p>住所：</ p>
<p>ドビガット</p>
<p>ネパール、ラリトプル</ p>
<p>メール：[email protected] </ p>
<p> <a href="https://hashthemes.com/wordpress-theme/">ここをクリックして、最高のWordPressテーマを表示してください！</a> </ p>
<p>営業中：</ p>
<p>月曜から金曜の午前10時〜午後6時</ p>
</ div>

ここでは、URLhttp://schema.org/とともにタグ語彙を指定します。 ページタイプは、タグのタイプによって定義されます。 

 <div vocab = "http://schema.org/" typeof = "store">

これで、ページの内容を検索エンジンに伝えました。 次に、プロパティ属性を使用してプロパティを定義します。 

 <h1property = "name"> HashThemes </ h1>

属性のタイプを使用して、PostalAddressを定義するようにプロパティをさらに定義することもできます。 

 <div property = "address" typeof = "PostalAddress">

属性のタイプはMicrodataのアイテムタイプと同等ですが、プロパティはアイテムプロップ属性と同等です。 

 <h2property = "description">ワードプレスのテーマのベストセラー！</ h2>
<p>住所：</ p>
<div property = "address" typeof = "PostalAddress">
<pproperty = "streetAddress"> Dhobighat </ p>
<pproperty = "addressLocality">ネパール、ラリトプール</ p>
</ div>
<p>メール：<span property = "email"> [email protected] </ span> </ p>
<p> <a property = "store" href = "https://hashthemes.com/wordpress-theme/">ここをクリックして、最高のWordPressテーマを表示してください！</a> </ p>
<p>営業中：</ p>
<pproperty="openingHours">月曜から金曜の午前10時から午後6時</p>
</ div>

JSON-LDを使用したマークアップWebページ

リンクトデータのJavaScriptオブジェクト表記（JSON-LD）は、JSONを使用したリンクトデータのエンコードです。 これはW3C勧告であり、2013年にSchema.orgの推奨形式として追加されました。

スキーママークアップにJSON-LDを使用する主な利点は、最も関連性の高いコードをページヘッダーに限定し、コンテンツの本文から余分なタグを除外することです。 これにより、コードがよりクリーンで読みやすくなります。

JSON – LD表記は、スクリプトブロック内に含まれています。 したがって、プロセスを開始するために、JSON-LD形式を使用していることを示すスクリプト行を入力します。 

 <script type = "application / ld + json">

JSON-LDコードも中括弧（中括弧）で囲む必要があります。そうしないと、ページに適用されたり、検索エンジンによって解析されたりしません。 これは、Javascriptではオブジェクト構造として知られています。 したがって、コードの概要は次のようになります。 

 <script type = "application / ld + json">
コードはここにあります
</ script>

ここで、Schema.orgにリンクされたデータへの語彙によって定義されたコンテキストを使用する必要があります。

コードの各行にもコンマを付ける必要があります。 

 "@context"： "http://schema.org"、

他のタイプのschema.org形式の場合、マークアップするコンテンツのタイプを定義する必要があります。 これは、Microdataの画像タイプ属性およびRDFaの属性タイプと同等です。

例として、上記の簡単なWebサイトを使用します。 

 "@type"： "ストア"、

次に、ストアの名前とその説明を定義します。 MicrodataまたはRDFaを使用してこれらの要素を定義している場合は、それらをWebサイトのホームページ自体に表示する必要があります。 ただし、JSON-LDの場合は、ページに存在しなくても要素を定義できます。 

 "名前"： "HashThemes"、
「説明」：「最高のWordPressテーマセラー！」、

次に、アドレスを定義します。 住所には、番地や地域など、さらに正確なプロパティが追加されます。 それで、それらを中括弧に入れます。 

 "住所"： {
"@type"： "PostalAddress"、
"addressLocality"： "ネパール、ラリトプール"、
"streetAddress"： "Dhobighat"、
}、

さて、店舗の営業時間を設定します。 営業時間を配列に保持し、2文字の組み合わせで曜日を指定します。 また、時刻は24時間制である必要があります。 

 "営業時間"： [
「月〜金10：00〜18：00」
]、

最後に、メールアドレスとテーマのURLを追加します。 どちらも非常に簡単です。 

 「メール」：「[email protected]」
"ストア"： "https://hashthemes.com/wordpress-theme/"
そして最後に、マークアップは次のようになります。
<script type = "application / ld + json">
{{
"@context"： "http://schema.org"、
"@type"： "ストア"、
"名前"： "HashThemes"、
「説明」：「最高のWordPressテーマセラー！」、
"住所"： {
"@type"： "PostalAddress"、
"addressLocality"： "ネパール、ラリトプール"、
"streetAddress"： "Dhobighat"、
}、
"営業時間"： [
「月〜金10：00〜18：00」
]、
「メール」：「[email protected]」
"ストア"： "https://hashthemes.com/wordpress-theme/"
}
</ script>

Googleの構造化データテストツールを使用して、構文にエラーがないか確認できます。

WordPress Webサイトにスキーママークアップを実装する方法は？

スキーママークアップの実装は、さまざまな方法で実行できます。 それらをフォローして、WebサイトをSEOに適したものにし、検索エンジンでのコンテンツのランキングを向上させることができます。 それらのいくつかを次に示します。

スキーママークアップとの統合が組み込まれたWordPressテーマの選択：

ご存知のように、WordPressは、魅力的なWebサイトを短時間で作成するための多数のテンプレートで構成される最も人気のあるプラットフォームです。 ただし、スキーママークアップコードと統合されているテーマはごくわずかです。 したがって、WordPressテーマを選択してWebプレゼンスを開始したり、既存のWebサイトをイメージチェンジしたりする場合は、テーマに少なくとも一般的なスキーマ機能が含まれているかどうかを確認してください。 共通のスキーマには、検索エンジンがWebサイトの構造を理解できるようにするためのヘッダー、フッター、およびナビゲーションオプションが含まれています。

WordPressプラグインで他のスキーマデータをマークアップする

上記のように、スキーママークアップコードと完全に統合されたWordPressテーマを見つけるのは難しいかもしれません。 そのため、別の方法として、Webサイトにスキーマ機能を追加するために使用できるWordPressプラグインを選択できます。 YoastSEOとSchemaProは、WebサイトにSchemaMarkUpを実装するのに役立ついくつかのプラグインです。

スキーママークアップを実装する際に覚えておくべきこと

WordPress Webサイトにスキーママークアップを実装する方法がわかったので、スキーママークアップを実装するときに覚えておくとよいことがいくつかあります。

スキーママークアップの統合は、良いランキングを保証しない可能性があります

スキーママークアップだけでは、Webコンテンツの適切なランキングは保証されません。 ランキングに影響を与えるコンテンツの権限、コンテンツの品質、キーワード分析、関連性などの他の多くの要因があります。 したがって、スキーママークアップは、コンテンツのランキングを上げるのに役立つ要素の1つにすぎないことに注意してください。

スキーママークアップが有効になるまでに時間がかかる

スキーママークアップがすぐに有効になるのではないかと思っているのなら、あなたは間違っています。 検索結果にリッチスニペットが表示されるまでに数か月かかります。

WordPressテーマで指定されたスキーママークアップを確認し、プラグインを使用して機能を強化します

WordPressテーマのほとんどは、ヘッダー、フッター、ナビゲーションなどの一般的なスキーマのみを使用します。 他のスキーマ関連の実装機能を備えたテンプレートがあるかもしれませんが。 Google構造化データテストツールにアクセスして、ウェブサイトのスキーマ実装を分析し、それに応じてプラグインを選択できます。