BLOG

CMAブログ

株式会社シーエムエー ホームCMAブログ構造化マークアップ第2弾!Googleの検索結果画面をカスタムできる「HowTo (ハウツー) 」のご紹介

ホームページ制作 SEO対策 構造化マークアップ第2弾!Googleの検索結果画面をカスタムできる「HowTo (ハウツー) 」のご紹介

こんにちは。クリエイティブプランナーの深谷です。

今回は、構造化マークアップの第2弾として、スマートフォンの検索画面をカスタムできる構造化データ「HowTo (ハウツー) 」のご紹介をいたします。

【構造化マークアップ 第1弾】「構造化マークアップはSEO対策に効果があるのかやってみた」はこちら

HowToハウツーリッチリザルト

HowTo (ハウツー) とは?

HowTo (ハウツー) とは、「ホームページ制作の流れ」や「ホームページの集客方法」など、
ある一連の流れをGoogleで検索した際に、スマートフォンの検索結果画面をカスタムして、
ステップ毎にユーザーへ紹介するリッチリザルト(※1)のことです。

(※1)リッチリザルトとは
リッチリザルトは、通常の青色リンクよりも高度な機能を持つ、Google サービス(Google 検索など)での検索結果です。リッチリザルトには、カルーセル、画像などテキスト以外の要素を含めることができます。

HowTo (ハウツー) の表示例

標準的なハウツーのリッチリザルト

ステップごとの画像を含むハウツーのリッチリザルト

HowTo (ハウツー) の実装方法

以下のソースは弊社のページ(第二階層)を構造化マークアップしたものです。

<script type="application/ld+json">{
	{
		"@context": "http://schema.org",
		"@type": "HowTo",
		"name": "ホームページ制作の流れ",
		"description": "静岡・浜松のホームページ制作・Web制作は、株式会社シーエムエーにおまかせください。ホームページ制作実績1,000社以上のノウハウを元に、静岡の企業様のネットビジネス構築を様々な角度から支援いたします。",
		"image": {
			"@type": "ImageObject",
			"url": "https://www.akindo2000.net/website/img/pho_step_05.png"
		},
		"step": [
			{
				"@type": "HowToStep",
				"name": "事前の詳細なヒアリング",
				"text": "貴社の商品、ビジネスモデルの理解をし、貴社独自の売り(USP(Unique Selling Proposition))を一緒に見出だします。",
				"image": "https://www.akindo2000.net/website/img/pho_step_01.png",
				"url": "https://www.akindo2000.net/website/index.php#step1"
			}
		]
	}
}</script>

HowTo (ハウツー) の検証方法

構造化マークアップをしたら記述が正しいかどうか、以下のテストツールで検証します。
記述に誤りがある場合はエラーを返してくれたり、どのような構造としてクローラーに認識されているのかを確認することができます。


https://search.google.com/test/rich-results?hl=ja

また、リリース後はサーチコンソールでも構造化データの状態を確かめることができます。

まとめ

最後に実際にGoogleの検索結果画面でどのように表示されるかを見てみます。

この様に検索結果に大きく表示されました。

構造化マークアップはHowTo (ハウツー)以外も様々なリッチペットが用意されてます。

  • パンくずリスト
  • カルーセル
  • よくある質問
  • 求人情報
  • レビュー
  • 動画 など

https://developers.google.com/search/docs/data-types/how-to?hl=ja

構造化マークアップは、実装するとしないでは検索結果画面が大きく異なりますので、気になる方はぜひHowTo (ハウツー) の実装をお勧めいたします。

  • このエントリーをはてなブックマークに追加

人気の記事ランキング

  • posted on 2024/08/02Google広告がX(旧:Twitter)に表示されている!?~配信設定の方法もご紹介~

  • posted on 2023/02/082023年度版 Google PageSpeed Insights(ページスピードインサイト)を使って読み込み速度を改善したら、何点になるのかチャレンジしてみた

  • posted on 2024/10/02構造化マークアップはSEO対策に効果があるのかやってみた(2024年度版)

  • posted on 2022/10/21DockerでPHP環境を簡単に構築してみよう

  • posted on 2024/10/30Google検索がAVIFを正式にサポート!!次世代の画像圧縮フォーマットAVIFとは?

おすすめタグ