構造化マークアップはSEOを強化し、検索エンジンに追加のデータを提供するだけでなく、ソーシャルメディアプラットフォームやGoogleのナレッジパネルなどの他のツールをより効果的に活用することにつながります。

このマークアップをサイトに追加するには、プラグインをインストールする方法と、適切なコードを手動で追加する方法があります。

今回の記事では、構造化マークアップとは何かをご説明し、その利点をいくつか扱い、そして、例も取り上げます。また、WordPressサイトに構造化マークアップを追加する方法もご紹介します。

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

構造化マークアップは一種のメタデータ(マイクロデータと呼ばれる)であり、サイトに追加することで、検索エンジンにより詳細な情報を提供します。以前はHTMLタグを使用して、この種の情報を検索エンジンに提供していました。

タイトルタグメタディスクリプションメタキーワード(今では意味なし)などはすべて、サイトの内容を検索エンジンに伝える役割を果たしてきました。

しかし、それだけでは、検索エンジンが、サイトの内容やどんなユーザーにぴったりなのか完全に理解するために必要なすべての情報を提供できるわけではありません。そこで、WordPressに構造化マークアップを追加できます。

サイトのページ内のHTMLに構造化マークアップを追加します。すると個々の要素に、そこに含まれる情報の種類や文脈などのプロパティが盛り込まれます。

たとえば、ページに次のようなものが表示されることがあります。

<div itemscope itemtype ="http://schema.org/Movie">
  <h1 itemprop="name">Avatar</h1>
  <span>Director: <span itemprop="director">James Cameron</span> (born August 16, 1954)</span>
  <span itemprop="genre">Science fiction</span>
  <a href="../movies/avatar-theatrical-trailer.html" itemprop="trailer">Trailer</a>
</div>

構造化マークアップは、コンテンツに補足のデータを加えます。具体的にはそれが組織、人、場所、または映画に関するものであるということを検索エンジンに伝えます。

これにより、ユーザーが検索をする時に、正確な情報が得られる可能性が高くなります。そして、あなたのページが検索結果に表示されることにもつながり、Googleで正確なナレッジパネルが表示され、ソーシャルメディアアカウントがウェブサイトに効果的にリンクされ、検索ランキングが向上する可能性すら高くなります。

構造化マークアップの使用方法と、マークアップが具体的に提供する情報の例を扱うことで理解が進むと思いますが、これについては後述することにします。

Is your WordPress site tagged with Schema markup? If not, here's an in-depth guide on what it is, why it's important, and several ways to add it properly! 📈🦾Click to Tweet

WordPressサイトに構造化マークアップを追加するメリット

WordPressサイトに構造化マークアップを追加する方法を学ぶ前に、まずはこれのメリットを確認しましょう。

主なメリットはSEOです。検索エンジンにコンテキストデータ(文脈としての追加情報)を提供することにより、WordPressサイトがSERPで上位にランクされる可能性が高くなります。2020年に検索エンジンはさらに正確な情報の表示に焦点を当てます。検索結果には、あなたのサイトのより正確な内容が反映されるようになるでしょう。

したがって、 個人のブログといった自分のサイトを運営している場合には、そのサイトが人を表し、その人が誰であるかを検索エンジンに伝えることができます。構造化マークアップのおかげで、サイトを個々のソーシャルメディアアカウントにリンクすることもできます。

一方、サイトが組織を表す場合には、検索エンジンに別のことを伝えることになります。

場所に関係したSEOという意味でもメリットがあります。構造化マークアップを使用して、ウェブサイトの場所や、ウェブサイトが表す組織の場所を検索エンジンに伝えることができます。ユーザーが近所で特定の業種を探している場合には、検索結果のランキングが高くなります。

SEOと同様に、構造化マークアップはGoogleのナレッジパネルも支えます。ナレッジパネルとは、検索結果の右側に表示される情報エリアです。検索語句に関連したさまざまなソースからの情報量の豊富なテーブルが表示されます。

たとえば「Matt Mullenweg」を検索すると、ナレッジパネルから、この人物を窺い知ることができます。

Matt Mullenwegのナレッジパネル

Matt Mullenwegのナレッジパネル

WordPressサイトに構造化マークアップを追加すると、Googleはサイトが個人を表すのか組織を表すのか、そして、ページにどのような種類のコンテンツがあるのかを認識できるようになります。それを使用してナレッジパネルにデータが入力され、ソーシャルメディアアカウントなどのさまざまなソースからの(より正確で)より多くの情報が組み込まれます。

構造化マークアップは、リッチスニペットやサイトリンクにも貢献します。これらはちなみに、検索エンジンの検索結果にトップページだけでなく、サイトのコンテンツやサイト内のサブページのリストといった追加の情報が表示される仕組みです。つまるところ、構造化マークアップは、検索エンジンが関連する情報を取得してSERPに追加するのを支援します。このように検索結果に深みを出すことにより、平均クリック率が向上することが証明されています。

ランキング上位サイトは、検索からの大量のトラフィックを処理するためにKinstaを選んでいます。Kinstaを無料でお試しください。

構造化マークアップは、サイトをソーシャルメディアアカウントにリンクする上でも大事な役割を果たします。サイトに追加できるマイクロデータの一例として、 FacebookTwitterなどのソーシャルメディアアカウントへのリンクがあります。あなたについて誰かが検索をした際には、上記のソースから検索エンジンがあなたの情報を取得して提供することが可能になります。

構造化マークアップの例

これで、WordPressサイトに構造化マークアップを追加することの意味がお分かり頂けたと思います。次のステップとして、追加できるマークアップの種類とサポートされているデータタイプを知っておきましょう。

schema.orgからデータタイプの一覧を確認できますが、最も一般的に使用されるのは次のとおりです。

これは、利用できるデータタイプのほんの一部にすぎません。数百とまではいかなくても数十種類があります。

さらに、現在進行形で新しいものが追加されています。たとえば、構造化バージョン6.0では、MediaGallery、SportsEvent、FloorPlanなどの新しいデータタイプと、JobPostingというプロパティが追加されました。

また、最近のコロナウイルス関連の事態の変化に伴い、Schema.orgには、特別なお知らせ、新型コロナウィルス検査施設なども含まれるようになりました。

構造化マークアップを使用してポッドキャストにフラグを付けることのメリット

Amazon EchoやGoogleアシスタントなどの音声アシスタントの普及に伴い、コンテンツがポッドキャストであることを示すフラグの重要性が高まっています。実際、Googleは現在、検索結果にオーディオソースを含めており、Android、そのアプリ、そしてそのウェブページを使用するデバイスの検索結果については、オーディオ形式の優先度を高め始めています。

データタイプの使用

あなたがレストランの公式サイトを運営しているとしましょう。これを検索エンジンに伝えるには、構造化マークアップ、特にOrganizationとRestaurantのデータタイプを使用して、この情報をページに追加する必要があります。

これらに加えて、レストランに関連したアクセス(場所についての)ページやイベントのページも必要になるかもしれません。その場合には、Eventを使用して、検索エンジンにその情報を提供しましょう。

このような単純な例から、複数のデータタイプが1つの特定のサイトやページに関係し得ることがわかります。

この記事の後半では、プラグインを使用してschema.orgの定めるマイクロデータをWordPressサイトのさまざまなページに追加する方法をご説明します。

まずは、構造化マークアップの実際の例をいくつか見てみ

ましょう。

構造化マークアップの例:Kinsta.com

Kinstaのウェブサイトから始めましょう。

Kinstaを検索すると、ウェブサイトのリンクだけでなく、ユーザーがKinstaを検索するのに使用している他の検索語句や、サイトで最も頻繁に検索されているページも検索結果に表示されます。

Kinstaの検索結果

Kinstaの検索結果

Googleの構造化データテストツールでKinstaのサイトを調べると、サイトにはさらに多くのマイクロデータが含まれていることがわかります。

Kinstaの構造化データ

Kinstaの構造化データ

(ロゴが表示されています。その他のちょっとした情報も視覚的に表現されている点にもご注目ください!)

データテストツールの結果を調べると、使用されている構造化マークアップデータの種類がわかります。

これは、Kinstaに関するマイクロデータのサンプルにすぎません。全体はGoogle構造化データテストツールでご確認ください。

構造化マークアップの例:Yoast.com

サイトで使用されている構造化マークアップの別の例を見てみましょう。構造化マークアップ機能を搭載したSEOプラグインの開発元であるYoastです。

Yoastを検索すると、サイトリンク(Kinstaと同様)があり、さらにYoastとそのソーシャルメディアアカウントに関する情報が掲載されたナレッジパネルも表示されます。

Yoastのナレッジパネル

Yoastのナレッジパネル

Yoastのサイトを構造化データテストツールで調べると、(予想した通り)構造化マークアップを使用してこの情報が提供されていることがわかります。

Yoastの構造化データを調べる

Yoastの構造化データを調べる

構造化マークアップは、主に企業や技術に精通した組織に使用されてきました。これは、サイトに構造化マークアップを追加することが容易ではなかったためです。しかし、WordPressサイトの所有者にとってこれは難しいことではありません。プラグインを使用して情報を追加できます。

それでは、その方法を見てみましょう。

WordPressサイトに構造化マークアップを追加する方法

schema.orgの構造化マークアップを追加する方法はいくつかあります。その全てをご紹介します!

テーマを介して構造化マークアップを追加する

WordPressサイトに構造化マークアップを追加する方法の1つが、構造化マークアップがすでに含まれているテーマをインストールすること。WordPressテーマディレクトリで「schema」と検索するといくつもの結果が表示されます。

「Schema」のテーマを検索した結果

「Schema」のテーマを検索した結果

該当するテーマをいくつかチェックしてみましょう。

The Schema

テーマ「The Schema」

テーマ「The Schema」

無料のテーマThe Schemaは、SEO強化を重要視して設計されています。コードにすでに構造化データが含まれており、これが検索エンジンのランキング向上に貢献するのがウリだとされています。また、ビルトインのパフォーマンス拡張機能もあります。

Schema Lite

テーマ「Schema Lite」

テーマ「Schema Lite」

Schema Liteは、有料のテーマであるSchemaの無料バージョンです。有料テーマのすべての機能が含まれているわけではありませんが、試しに使ってみてテーマがうまく機能するかどうか確認するには便利でしょう。

Schema

テーマ「Schema」

テーマ「Schema」

有料のテーマSchemaはSchema Liteに似たデザインですが、SEOを強化する機能が追加されています。これには、サイトに関する情報を追加できるオプションページ(構造化マークアップとして統合される)があります。

専用のWordPressプラグインを使って構造化マークアップを追加する

すでにお使いのサイトにおなじみのテーマがあるはずです。構造化マークアップのためだけにテーマを変更したいとは思わないでしょう。WordPressサイトに構造化マークアップを追加するためにプラグインも利用できます

いくつかの選択肢を見てみましょう。

Schemaプラグイン

Schemaプラグインを使用すると、WordPressに構造化マークアップを簡単に追加できます。カテゴリーごとまたは投稿タイプごとに特定の構造化タイプを有効にする、などの便利な機能があり、カスタム投稿タイプとの互換性もあります。また、SEO系プラグインなど、インストール済みの他のプラグインと連携することで、すでに使用しているマークアップを活用することができます。

このプラグインはJSON-LD(軽量のLinked Data:Googleが推奨するもので、Bingもサポート)を使用しています。このプラグインのコアの部分にはレビューマークアップ機能は含まれていませんのでご注意ください。この機能を利用するには、同じく無料のSchema Reviewプラグインをインストールすることができます。

Schemaプラグインの設定方法を見てみましょう。

「プラグイン」>「新規追加」に移動し、「Schema」と検索して、 通常の方法でインストールします。「インストール」と「有効化」をクリックしてください。

Schemaプラグインのインストール方法

Schemaプラグインのインストール方法

プラグインをインストールして有効化したら、「Schema」>「Settings」に移動して、構造化マークアップをサイトに追加します。ロゴの追加とともに、概要ページ、連絡先ページの位置情報などの基本情報を入力します。

次に、「Quick Configuration Wizard」ボタンをクリックして、設定を開始します。

Schemaの 「Quick Configuration Wizard」

Schemaの 「Quick Configuration Wizard」

ウィザードの手順に従って、サイトとソーシャルメディアのプロフィールに関する情報を入力し、最後にあるボタンをクリックして、カスタム投稿タイプを編集します。

 構造化データの種類を編集

構造化データの種類を編集

サイトにある追加のカスタム投稿タイプをリストに追加するには「Add New」ボタンをクリックして詳細を入力します。この画面を使用して、構造化マークアップをカテゴリーに追加することもできます。より高度な機能については、 プラグインのドキュメントをご確認ください。

設定をさらに微調整する場合は、「Settings」タブに移動します。「Schema」>「Extensions」に移動して、拡張機能を追加することもできます。ここでは、WooCommerceなどのプラグインを追加できます。次の機能を含むSchemaプラグインのプレミアム(有料)バージョンをインストールすることもできます。

Schemaの有料版

Schemaの有料版

サイトで高度な構造化マークアップが必要なら、料金を支払ってこれを利用するだけの価値はあるかもしれません。

Schema Proプラグイン

WordPressサイトに高度な構造化マークアップを追加することのできる別の有料プラグインとして、Schema Proプラグインもあります。

Schema Proプラグイン

Schema Proプラグイン

機能は以下の通りです。

  1. 幅広いデータタイプをサポート
  2. 構造化データが新規/既存の投稿とページに追加されるように完全自動化
  3. カスタム投稿タイプ、タクソノミー、アーカイブをサポート
  4. カスタムフィールドをサポート
  5. 拡張により、さらに多くのマークアップを追加

ランキング上位サイトは、検索からの大量のトラフィックを処理するためにKinstaを選んでいます。Kinstaを無料でお試しください。

その他のプラグイン

Schema.orgマークアップをサイトに追加するプラグインはSchemaとSchema Proだけではありません。その他の選択肢には以下のようなものがあります。

Yoast SEOプラグインを使って構造化マークアップを追加する

WordPressサイトですでにSEOの用途にYoastプラグインを使用している場合、これを使用して構造化マークアップを追加できます。上記の有料プラグインほどマークアップは追加されず、構造化マークアップ専用ではありませんが、すでに利用している人にとっては(追加のプラグインが必要にならず)便利な選択肢でしょう。

早速、これがどのように機能するか見てみましょう。

Yoastをインストールすると、サイト所有者やソーシャルメディアリンクなどの情報を入力する画面が表示されます。これは、サイトへの構造化マークアップ追加の一環です。

まず、サイトを所有する組織の種類が尋ねられます。

Yoastウィザード画面:サイトの種類

Yoastウィザード画面:サイトの種類

次に、人物または組織の名前が尋ねられます。組織の場合は、ロゴもアップロードする必要があります。下のスクリーンショットでは、個人を選択しました。個人の情報を変更する場合は、プロフィールページから操作できます。

サイト代表者となるユーザーの指定

サイト代表者となるユーザーの指定

サイトの所有者がユーザーアカウントを所有していない場合には、2つの選択肢があります。「法人」オプションを選択し、個人が法人であるかのように詳細情報を入力するか、自分のエイリアスであるメールアドレスでユーザーアカウントを設定して、クライアントがシステムからのメールの受信をしないように(あなたがクライアントのためにサイトを管理している場合)します。

ウェブサイト所有者のタイプを更新したい時には「SEO」>「Search Appearance」に移動し「全般」タブを選択します。下にスクロールして「Knowledge Graph & Schema.org」の項目に移動し情報を入力します。

サイト所有者が個人であれば、ドロップダウンメニューからユーザーを選択すると、そのユーザーのプロフィールから情報が取得されます。あなた自身がサイト所有者であれば、自分の名前とソーシャルメディアアカウントに関する情報をユーザープロフィールに入力してください。

Yoastでschema.orgマークアップを編集する

Yoastでschema.orgマークアップを編集する

サイトが法人、またはユーザーアカウントを持たない個人のものであれば、ユーザーを選択する代わりに、その個人または法人に関する情報を入力するだけでOKです。これを行うには、「SEO」>「ソーシャル」に移動します。

ウェブサイトのタイプを設定すると、Yoastは自動的にWordPressサイトにデータタイプと構造化マークアップを追加してくれます。

Yoastは実際には次のようにして、WordPressサイトに構造化マークアップを追加します。

興味深い機能に、Yoast構造化データブロックがあります。これを使用し、FAQ(よくある質問) やハウツーを投稿やページに追加できます。関連する構造化マークアップを使用して、検索エンジンにその役割を伝えられます。

Yoastの構造化データブロック

Yoastの構造化データブロック

Yoastアドオンを使用してさらに多くの構造化マークアップを追加することもできます。たとえば、ローカルSEOアドオンを使用した位置データや、ニュースSEOアドオンを使用したニュースデータなどがあります。

構造化マークアップをWooCommerceストアに追加する方法

WooCommerceストアには、構造化マークアップを実装することでさらに多くのメリットがもたらされます。ショップが販売する商品とその主な市場が何なのかを検索エンジンに完全に理解してもらうことで、希望する種類の訪問者にショップが表示される可能性が高まります。したがって、SEO強化のためにWooCommerceストアに構造化マークアップを追加することには大きな意味があります。

構造化マークアップをストアに追加する理由

ストアに構造化マークアップを追加すると、2つの重要な点をユーザーに知らせることができます。

1つ目はブランドです。Organizationタイプとそのサブタイプを設定することで、サイトがどのストアにより運営されているのか、どんな種類の小売業者なのかを検索エンジンに伝えることができます。ローカルビジネスのデータタイプで、地域に根ざした関連性を確保することも可能です。

2つ目として、構造化マークアップを使用して投稿タイプをマークアップすることもできます。これを設定することで、検索エンジンはあなたが製品を販売しているのだと認識します。結果的に、検索結果の「ショッピング」の項目に表示される可能性が高まります。

専用のWordPressプラグインを使ってWooCommerceストアに構造化マークアップを追加する

構造化マークアップをWooCommerceストアに追加できるプラグインはいくつかあります。

WordPressに構造化マークアップを手動で追加する方法

WordPressサイトに構造化マークアップを追加する最後の方法は、プラグインなしでの手動操作です。これには余分なコードが介在しないというメリットがありますが、より多くの作業が必要になります。

これを行うには、テーマのテンプレートファイルを編集します。

たとえば、投稿を出力するloop-single.phpファイルがある場合、次のようなコードで構成されることが予想されます。

<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>>

 <h2 class="entry-title"><?php the_title(); ?></h2>

 <?php if ( has_post_thumbnail() ) { ?>                            
  <?php the_post_thumbnail( medium, array(
   'class' => 'left',
   'alt'      => get_the_title()
  ) );
 ?>                  
 <?php } ?>

 <section class="entry-content">
  <?php the_content(); ?>
 </section><!-- .entry-content -->

</article>

このコードを次のように編集して構造化マークアップを含めることができます。

<article itemscope itemtype ="http://schema.org/Article" id="post-<?php the_ID(); ?>" <?php post_class(); ?>>
  
 <h2 itemprop="name" class="entry-title"><?php the_title(); ?></h2>

 <?php if ( has_post_thumbnail() ) { ?>                            
  <?php the_post_thumbnail( medium, array(
   'class' => 'left',
   'alt'      => get_the_title()
  ) );
  ?>                  
  <?php } ?>

 <section itemprop=”articleBody”>class="entry-content">
  <?php the_content(); ?>
 </section><!-- .entry-content -->

</article>

たとえば、アイキャッチ画像やメタデータにさらに追加することもできます。Schema.orgの公式サイトで、コンテンツに適用できるタイプとプロパティをご確認ください。

そして、利用するマークアップを各テンプレートファイルに追加するか、header.phpなどのファイルをテーマ内に含めます。

この操作を終えると、テンプレートファイルを介して対象となる各ページに自動的にマークアップが追加されます。階層の上位にあるファイルを使用する投稿タイプのために、別のテンプレートファイルを用意する必要性が生じることもあります。そんな場合であっても、通常、既存のファイルをコピー、名前を変更して、構造化マークアップを追加するだけで問題ありません。

構造化マークアップをテストする

WordPressサイトに構造化マークアップを追加したら(比較のために追加前にも)テストをしておくのが得策です。

Google構造化データテストツールを使用します。

ウェブブラウザでツールを開き、サイトのURLを入力します。一部のプラグインでは、WordPressダッシュボードからボタンを押すだけで直接ここに移動できます。

Googleのテストツールからは、構造化マークアップのどの部分がサイトに存在し、どの部分が抜け落ちているのかが確認できます。必要なマークアップが欠落している場合には、プラグインの設定を微調整するか、それを手動で追加しましょう。

Schema markup and SEO go hand in hand 🤝 Learn how you can improve your site's ranking with this in-depth guide 🚀Click to Tweet

まとめ

WordPressサイトに構造化マークアップを追加すると、SEOが向上します。これは、検索エンジンにサイトとその存在するコンテキストについての詳細を伝えるためです。関連する情報を検索エンジンのリストページに直接表示することで、セールを行うかどうかが異なります。 。

ほとんどのサイトで、いまだに構造化マークアップが使用されていないのが現状です。今のうちに素早く実装するだけで、すぐに競合他社よりも優位に立つことができます。手動で行うか、YoastなどのSEOプラグインを使用するか、専用の構造化プラグインをお使いください。

さて、あなたは自分のサイトで構造化マークアップを利用していますか?コメント欄からお聞かせください!


この記事が面白いと思った方は、KinstaのWordPressホスティングプラットフォームも大好きでしょう。ウェブサイトをスピードアップし、当社のベテランのWordPressチームからの24時間365日のサポートを是非ご利用ください。Google Cloudを使用したインフラストラクチャは、自動スケーリング、パフォーマンス、およびセキュリティに重点を置いています。Kinstaの魅力をご案内させてください。当社のプランをご確認ください。