ウェッピーは作るのが面倒だけど、大き目の画像でも容量が小さくなります。

今日はサイトに使う画像について
画像の種類を変えたら表示速度が爆上げしました。

ウェブサイトの表示速度がSEOに影響を及ぼすと言われています。

正確には表示速度が遅すぎると、検索順位を落とすらしいです。
スピードを落とす最大の要因は容量の大きな画像です。

画像の容量ですけども…
なかなか悩ましい問題です。




画像を圧縮すれば、必然的に荒くなります。
また画像に書かれた文字なども、読みづらくなってしまいます。

画像が汚いとユーザビリティにも悪影響を及ぼすリスクがあります。
なのでサイトにアップする画像は一定以上のクオリティが必要です。






先日にWebP (ウェッピー)という拡張子の存在を知りました。
一般的なJPEGと比べると、25％から35％程度、容量が小さくて奇麗な画像になるとか。

欠点はWebPの書き出しが面倒なこと。
(WebP 変換　で検索すれば変換サイトが数件ヒットします。)

もう一つはiPhoneなどアップル系のブラウザだと表示されないリスクがあります。

リスクはあるけども…
表示速度の上昇は魅力的だと思い、現在作成中の建設業許可サイトでWebPを導入してみました。


画像をJPEGからWebPに変えた建設業許可のサイト


取り合えずトップページの画像をWebPにしてみました。
私が使っているCMS（シリウス）はWebP対応では無いので、一部はJPEG画像のままです。

まずJPEG画像の時です。
モバイルの速度スコアは59と微妙です。




Wordpressよりは速いかなという程度です。
（私の所有するWordpressのスコアは40でした）

次に画像をWebPに変えたものがこちらになります。




スコアが86まで上昇しました。
自分のスマホで確認するとパパっと表示が切り替わる様に。

全然表示速度が違います。
スピードが速いと気持ちが良い物です。

今回の実験はトップページだけなので、順番に個別記事の画像もWebPに変えていこうと思います。