構造化マークアップとは
私たち人間がwebサイトに書かれたものを一目で認識できるのに対してGoogleの検索エンジンはこういった情報を一目で認識することはできないということです。
そして、webサイトに書かれた情報が何を指しているのか認識することができない検索エンジンに対して、それが何を指しているのかを明示するために構造化マークアップという手法が取られます。具体的な手法として、ページ内にメタデータを付与することで検索エンジンに情報を認識させます。下の一例を見て下さい。こちらは構造化マークアップされていないものです。
<div>私はユーザーAです </div>
上の文字列を構造化マークアップすると下のようになります。
<div itemscope itemtype=”http://person”> 私は<span itemprop=”name”>ユーザー</span> <span itemprop=”nickname”>A</span>です</div>
こちらの例では、ニックネームをAとするユーザーAさんに関して、検索エンジンがより詳しい情報を受け取れるように構造化マークアップを行っています。
こちらの例では名前とニックネームを認識させる方法について紹介しました。これを応用すれば、検索エンジンはその文字列が特定の人物なのか、または場所なのか、物なのか判別できるようになります。
では、構造化マークアップの書き方について少し紹介したいと思います。
構造化マークアップの方法について
構造化マークアップは下のプロパティを用いて各要素をマークアップしていきます。
・itemscope
・itemtype
・itemprop
企業のサイトをマークアップする場合、header部分に下のように記述を追加します。
<head prefix=”og: http://ogp.me/ns# fb: http://ogp.me/ns/fb# article: http://ogp.me/ns/article#” itemscope itemtype=”http://schema.org/○○”>
<meta itemprop=”name” content=”企業名前”>
<meta itemprop=”url” content=”会社のURL”>
<meta itemprop=”about” content=”トップページのDescription”>
<meta itemprop=”telephone” content=”電話番号”>
上の例では、マークアップしたタグが何を表しているのかについてitemscopeを追加し、更にitemtypeを追加することで何の情報を含んでいるのかを明示します。itemtypeは“https://schema.org/名前”の形で記述されます。そして名前の部分に記述された情報を検索エンジンは読み取り、要素の名前に対して何の情報を含んでいるのかを検出する仕組みになっています。
構造化マークアップから期待できることとしては下記の項目があげられます。
構造化マークアップから期待できること
構造化マークアップを利用するメリットは下の項目があげられます。
・リッチスニペットが表示できる
・ページ内のコンテンツがナレッジグラフに表示される
このように、リッチスニペットやナレッジグラフに表示される理由としては、構造化マークアップを行うことで地域名や場所などが検索エンジンに認識されやすくなった結果、それらの情報が読み込まれやすくなるからです。
しかし、デメリットとして、記述が長くなってしまうことがデメリットとしてあげられます。
多かれ少なかれ記述が多少複雑になってしまい、ファイルのサイズが大きくなってしまいます。さらには工数が必要となりメンテナンスも必要になってきます。
まとめ
今回は構造化マークアップの方法と期待できる効果について紹介しました。Schema.orgは構造化マークアップをするためのボキャブラリーとして使われ、ページ上の文字列が何なのか認識させる働きを持ちます。
検索エンジンに文字列を伝わりやすくした結果、リッチスニペットに表示されやすくなったりします。とはいえ、記述量が増えたりメンテナンスにかかる工数が増えたりするので、工数に見合う価値があるのか検討した上で行うのがよいのではないでしょうか。
記事の著者が提供するサービス
