公開日:

Webサイト全体をWebP対応する最低限の方法

Authors
  • author image
    Name
    代表取締役 宮永

こちらのブログでもアクセスの多いテーマがGoogleの提唱する画像の新フォーマットのWebPです。

WebPってなに?Googleが作った新しい画像フォーマットは、軽くてアルファチャンネルもサポート!表示高速化するなら検討してみよう!

ふと「サイト全体のWebP対応って簡単なシェルスクリプトだけで最低限はできるんじゃない?」と思いつき、簡単なスクリプトを作ってみました。

3ファイルでできるサイト全体の自動的なWebP対応

今ご覧のこのブログサイトと、コーポレートサイトで早速試験運用中ですが、特に問題はなさそうです。

成果はどうか

どのくらいのファイルサイズ削減に繋がったかは、また詳しく報告します。

PageSpeed InsightsLighthouseのスコアはちょっとだけ上がりました。

画像ファイルサイズに関する監査項目があり、WebPにすると高確率でパスできます(同じGoogle主体のプロジェクトなので笑)。

画像ファイルが多いサイトでは、もしかしたら検索エンジンのスコアリングにも影響があるかもですね。

以上、小規模サイト向けの簡単なスクリプトですが、参考になりましたら幸いです。