【イラスト付き】構造化データとは？正しくマークアップして流入アップを狙おう！

ブルーちゃん教えてー

構造化データがよくわからないんだ

構造化データとは、WebサイトのHTMLに専用のコードをマークアップしてWebページの内容を検索エンジンに伝える手法だよ

あらかじめプロパティのキーやバリューが決まっていて、用途に合わせながらマークアップしていくんだよ

構造化データの形式には3種類あるけど、Googleは中でも「JSON-LD」を推奨しているんだ

構造化データはガイドラインに準拠することが非常に重要なんだよ

HTMLを構造化データとしてマークアップするには2つ方法があるよ

それぞれ紹介していくね

1つ目に紹介する構造化データをマークアップする方法は、Microdataだよ

Microdataは、HTMLに直接、構造化データをマークアップする手法なんだよね

実際の書き方を、このサイトを事例にして紹介すると、

上記のようなパンくずリストがあるとするでしょ？

これをHTMLで書くと、

こんな感じになっているんだけど、

Microdata方式で、直接このコードに構造化データを盛り込むと、

こんな感じになるんだよ

itempropの中にitemListElementがあって、itemtypeの中にURLが入ってることで、構造化データとしてGoogleが認識してくれるようになるんだよ！

2つ目の構造化データのマークアップ方法は、JSON-LD方式だね

JSON-LD方式は、HTMLのhead内に構造化データをマークアップする方法だよ

例えば、このサイトで言うと、

上画像のようなパンくずリストがあるとして、

これをJSON-LD方式で構造化データをマークアップしてあげると、、、

っていうコードを、HTMLに入れればマークアップ完了だよ

itemListElementの中に、パンくずリストの数だけListItemを入れるんだよねー

JSON-LD方式の方が、Microdataよりも見やすいから、一般的になってるね！

なんのためにわざわざHTMLをマークアップして構造化データにするんだと思う？

HTMLを構造化データにするメリットを解説するね

Webサイトが正しくマークアップされて構造化データになっていると、検索エンジンにどんなWebサイトか理解してもらいやすくなるんだ

WebサイトにはブログやLPやECサイトなど用途や目的に合わせていろいろな種類があるよね

そのWebサイトがどんな種類のサイトなのか検索エンジンに理解されることは、ターゲットユーザーの検索流入を増やすためにもとても重要なんだよ

決められた属性でマークアップしておくと、検索結果にリッチリザルトが表示される確率が高くなるよ

パンくずとか価格とかレビューとか、Webサイトにはさまざまな要素があるよね

この部分にはこんな内容が書いてありますよーと検索エンジンに伝えることで、検索結果に採用されやすくなるんだ

結果的にユーザーにとってもわかりやすくて、より魅力的なWebサイトにはなっていくんだよ！

構造化データにはデメリットもあるんだよね

どんなデメリットか説明するね

HTMLを正しくマークアップして構造化データにするには専門知識が必要だよ

多くは「JSON-LD」という形式で記述するけど、「microdata」「RDFa」っていう種類もあってそれぞれ記述方法が微妙に違うんだ

マークアップしていくキーとバリューもどんどん増えていくから、常に最新情報をチェックしておかないといけないんだよね

構造化データに対応するには、工数と時間がかかるんだよね

さっきも挙げたけど実装自体が特殊で難しいから調べる必要があるし、HTMLが正しくマークアップできているか確認したりだとか、時間がかかっちゃうんだ

しかも、エラーがあると構造化データとして意味をなさないだけじゃなく、スパムと認識されることもあるんだよね...

エラーを解消して正しい状態に持っていくのは大変な作業なんだけど、慣れてくればスピードもあがって効率よくマークアップできるようになるよ！

最後に構造化データについてまとめておくね

わかってもらえてよかったよー