[レベル: 上級]
Google 検索向けの構造化データで指定する画像フォーマットに、webp を使わないほうがよさそうです。
認識されないかもしれません。
ドキュメントで指示されている、.jpg
、.png
、.gif
のいずれかの形式の画像を指定することが推奨されます。
高速化には WebP が有効だけれど
ページの読み込み時間を高速化するために WebP フォーマットは有効な策の 1 つです。
サポートするブラウザも増えてきました。
高速化に焦点を当てると WebP 画像の利用が推奨されます。
ところが、構造化データに目を向けてると事情が変わってきます。
Google 検索においては、構造化データで指定する画像は次の 3 種類のうちのいずれかのフォーマットが指示されています。
.jpg
.png
.gif
たとえば、記事構造化データの技術ドキュメントの image プロパティの説明には次のように書かれています。
画像の形式は、
.jpg
、.png
、.gif
のいずれかである必要があります。
ロゴの構造化データの技術ドキュメントには次のように書かれています。
.jpg
、.png
、.gif
のいずれかの形式の画像を指定する必要があります。
.webp
が含まれていません。
構造化データの画像はガイドラインに従うことを推奨
構造化データで指定する画像フォーマットに WebP は使えないのでしょうか?
Google の John Mueller(ジョン・ミューラー)氏は、リッチリザルト用の構造化データにはガイドラインで指示された画像フォーマット、つまり .jpg
、.png
、.gif
を使うことを推奨しています。
You can specify multiple formats on the page using the picture tag & srcset attribute. For rich results, I'd recommend marking up the images as documented.
— 🍌 John 🍌 (@JohnMu) February 28, 2020
Google 検索の、特にリッチリザルト向けに追加する構造化データには WebP 画像は今のところ使用しないほうが安心です。
ガイドラインに従って .jpg
、.png
、.gif
を使いましょう(Google 検索に限っての話。構造化データ内の画像で .webp
を指定することは何ら問題ない)。
WebP 非対応ブラウザ向けに JPG や PNG を提供しているはず
WebP が幅広くサポートされるようになってきたとは言え、すべてのブラウザがサポートしているわけではありません。
したがって、WebP 画像を使う場合でも、通常は非サポートブラウザへの対応として、JPG 画像や PNG 画像も準備しているはずです。
なので、構造化データに JPG や PNG を設定するのは困らないはずです。
picture
タグを使えば、WebP 形式をサポートしているかしていないかによって、読み込ませる画像を切り替えることができますね(ミューラー氏も言及している)。
<picture>
<source type="image/webp" srcset="flowwer.webp"> ⬅ WebP
<source type="image/jpeg" srcset="flowwer.jpg"> ⬅ JPG
<img src="flower.jpg">
</picture>