検索結果画面の最適化!YouTube動画を埋め込む時にも構造化データを適用しよう

Publish2021/08/06(金)

検索結果画面の最適化!YouTube動画を埋め込む時にも構造化データを適用しよう

今回は少し技術よりな話になりますが、構造化データフォーマットを活用して検索結果画面を思った形の表示に調整しようというお話です。
構造化データフォーマットの中でも、今回メインで取り扱いたいなと思っているのは動画の埋め込みについてです。

YouTubeの動画埋め込みにも構造化データは対応している

まず、制作や運用をしている人でも知らない人が結構いますが、YouTubeなどの動画を記事内に埋め込む場合でも、構造化データのVideoObjectを設定することで検索結果上での表示を意図した形での掲載にすることができます。
検索結果画面に表示された記事内に動画があるということがユーザーに分かると、「この記事ではわかりやすく説明が確認できるかも」という認識になり、クリック率や滞在時間が上がる可能性があるかと思うので、可能な限り対応するほうが好ましいかと思います。

VideoObjectの仕様については、こちらのリンクを確認しましょう。

VideoObject

実際の埋め込み方法や仕様などは検索セントラルのブログでも確認できます。
スキーマ マークアップを使用して Google に動画を表示させる

構造化データのサンプルと実際の導入について

仕様を確認すると、下記のようなサンプルコードが確認できます。
ある程度は見たらわかる感じのものですが、一通り説明はします。

<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "VideoObject",
"name": "動画タイトル",
"description": "動画説明文",
"thumbnailUrl": "サムネイル画像のURL",
"uploadDate": "2020-03-01T12:00Z",
"duration": "T4M26S",
"contentUrl": "YouTubeのURL",
"interactionCount": "51658"
}
</script>

必須プロパティ

まず、上記の中で追加時に必須のプロパティがあるので、そこはもれなく、忘れずに追加しましょう。
VideoObjectの必須プロパティは

・name(動画のタイトル)
・description(説明文)
・thumbnailUrl(サムネイル画像のURL)
・uploadDate(動画公開日)

の4つになります。
上3つはテキストでいいですが、uploadDateについてはサンプルの「2020-03-01T12:00Z」のように「ISO 8601 形式」のフォーマットに沿って記述することが必要ですので気を付けましょう。

推奨プロパティ

必須ではなく、推奨プロパティとしては上記のサンプルの場合は

・duration(動画の再生時間)
・contentUrl(YouTubeのURL)

になっているので、この2つもできる限り記載しましょう。
なお、durationについてはuploadDateと同様に「ISO 8601 形式」のフォーマットでの記載となります。

公式ドキュメントを見ると、その他の推奨プロパティがありますが、該当する項目がないケースもあるので、適時判断して対応しましょう。

運用時の対応方法について

今回紹介している構造化データフォーマットを実際のホームページに適用させる場合は、あらかじめ掲載するための枠を用意しておく必要があります。
というのも、構造化データフォーマットのJSON-LDを記載する箇所は「</head>」内に記載することが推奨されているので、記事編集画面などにJSON-LDのコードを埋め込む枠を用意しておく必要があるためです。
あと、可能であれば毎回項目を確認して入力するのは面倒なので、WordPressのカスタムフィールドのようにあらかじめ入力項目を決め打ちしておくのもよいかもしれません。
そこまでいかない場合でも、上記サンプルが初期で設定されていて、数値の変更だけで済ようになっていたりすると間違いも起きづらいかなと思います。
これらの機能を実装するにあたっては、メンテナンスを行っている会社にご確認いただくなどする必要はあるかと思います。

記事公開後の確認と処理

記事公開後には、記載した構造化データマークアップに問題がないかどうかを下記URLのリッチリザルトテストでURLを通して確認しましょう。

リッチリザルトテスト

ここで問題があった場合は、検索結果に表示されることもないので、間違いを修正して公開するように心がけましょう。

動画の埋め込み以外にも構造化データは使える

VideoObject以外にも、検索結果の表示で意図したものを表示させるための構造化データマークアップの種類はいくつかあります。
Q&Aや求人情報などもそのまま検索結果に反映させることも可能なので、どういう要素があるのかを確認して対応できるものは対応しましょう。
最近のもので対応する必要性が高そうなものでいえば、まだベータ版ではありますが、コロナ関連の構造化データもうまく利用することでユーザーの利便性は向上するかと思います。
COVID-19(新型コロナウイルス感染症)に関するお知らせに構造化データを追加する(ベータ版)

どういうふうに構造化データをマークアップすればいいのかわからない場合は、Googleが提供している下記URLを使用することである程度は作成可能です。

構造化データ マークアップ支援ツール

構造化データフォーマットをできる限り活用しよう

構造化データフォーマットは、最初見ただけだとどういう点にメリットがあるのか分かりづらいですし、効果も地味な感じがしてしまう(実際のところそんなところはないけど)、そもそもが技術よりすぎて難しいと思われがちなので対応しているところも少ないですが、対応することで検索結果画面の表示をある程度こちらでコントロールできるようになってくるというメリットはあります。
検索結果画面をコントロールできるようになるということは、検索結果画面でのクリック率を上げてホームページへの流入を増やしやすくなるというのはもちろんのこと、よりピンポイントな情報を最短手順でユーザーに提供できるというユーザー側のメリットも出てきます。
なので、運用を行う人であれば誰もが取り組むべき内容ではないかなと個人的には考えています。

ここがポイント検索結果画面に任意の情報を表示させたい場合は構造化データマークアップを利用する

記事の著者:ふにすでぐち

ふにすでぐち

1978年生まれ。企業のWeb活用をテーマに、Web運用を中心とした戦略的な企画立案、サポートやホームページ/Webサイトの構築などを行っています。
5年間のWeb制作会社勤務後、2年間のフリーランスで「フニス」として活動後に法人化し、2012年7月「ふにす株式会社」を設立。
Web運用の情報や考え方などを発信するブログ「ふにろぐ」を不定期で更新しています。
2015年11月より大阪府高槻市に「ふにすWeb相談所」を開設。
地域の方々に気軽にWebのことを相談できる場所として、より多くのWeb運用の問題解決をするために活動しています。
2021年1月よりYouTubeにてWeb運用のおっちゃん・ふにすチャンネルをはじめました。
Web運用の基礎情報やコツ、ポイントなどをお話ししております。
お問い合わせはこちら

LINEでWebに関する質問にお答えしています。

ふにすでは、LINEでWebに関するご質問にお答えしています。Webに関するあんなことやこんなこと、今さら聞けない疑問などなんでもご相談ください。LINEアプリでQRコードを読み取ると友達登録のリンクが表示されますので、試しに登録してみてください。

ふにろぐとは?

でぐち

ふにろぐは「ふにす株式会社」の「でぐち」が書いているブログです。
このブログでは主にホームページの運営をしている企業のご担当者様向けに、「ホームページ/Webサイトの運営に役立つTips」や「今更人に聞けないような初歩的なこと」を中心に情報を配信しています。

このブログについて

ふにす株式会社

ふにす株式会社は大阪の高槻にある「Webを起点に会社の成長を応援するパートナー」をモットーに、Webにまつわるいろいろな問題を解決する、サポートをする会社です。
ホームページでお問い合わせを増やしたい、もっとたくさんの人に見てもらいたいなど、ホームページ/Webサイトを活用したい方向けの活動を行っています。
また、ホームページの作成や、外部パートナーとしての運用サポートなど、幅広くWebにまつわる諸々のことをおこなっております。
どのようなことを頼めるのかをまとめてみましたので、ご確認ください。

ふにすにはどんな仕事が頼めるの?

ブログ内検索

サービス

ふにすWeb相談所

ホームページの運用お得情報

ホームページ/Webサイトの運用に関する記事のまとめです。ツールや運用ノウハウなど、知っていると便利になる情報ですので、まずはこちらをご覧ください。

Webサイトの運用に関する情報

お問い合わせ

ホームページを成功させたいとお考えの方はお気軽にご相談ください。
ご相談は、下記の中からお好きなものを選んでいただければ大丈夫です。

  • メールで問い合わせる
  • チャットワークで問い合わせる
  • Facebookで問い合わせる
  • Twitterで問い合わせる

LINE@でも相談を受け付けています。
QRコードから友達登録を行って、メッセージを送ってください。

LINE@

最新記事

カテゴリ別記事一覧

月別記事一覧