公式サイト内の画像をWEBP・AVIFに変更しました

当サイトで使用する画像の形式について、JPEGやPNG形式のものを、全てWEBP・AVIF形式に切り替えました。
比較的新しい画像の規格なので、以下に挙げるような古い環境では画像が正常に表示されない可能性があります。何卒ご了承ください。

・windows8 以前
・macOS Catalina 以前（2013年発売のiMacや2012年発売のMacBook Pro以前）
・Ubuntu 16.04 LTS 以前
・Android 3.2 以前
・iPhone6 以前

連絡事項としては以上となります。
ここからは、なぜ画像の形式を変更したか、どう変更したかについて、少し詳しくご説明いたします。

画像の形式を変更した理由について

基本的に、スマートフォンのデフォルトカメラアプリで撮影した画像や、SNSやサイトにアップロードされている画像は、色のデータを「圧縮」されています。
情報を圧縮して減らすことで、サイトを見に来た人に送るデータ量を少なくして素早く画像を表示したり、たくさん画像を保管できるといったメリットがあります。

圧縮するための方式は昔から色々考えられてきました。有名なものでは、JPEG（1992年リリース）や、PNG（1996年リリース）といった方式が挙げられます。これらは対応していない環境がほとんど存在せず、古いデバイスでも安定して表示できることから、現在でも多くの場面で利用されています。

しかし、技術は日進月歩。最近ではJPEGやPNGよりも、綺麗に効率よく圧縮できる方式が生み出されています。
Googleが提供するWEBサイトのパフォーマンス測定ツール「PageSpeed Insights」においても、スムーズにページを表示するために、新しい圧縮方式の画像を採用することが推奨されています。

これらの状況を鑑みて、キスメ様をより効率的に広めるためにも、当サイトの画像の圧縮方式をWEBPとAVIFに変更しました。

WEBP・AVIFとはなにか、どのように使い分けているのか

WEBPはgoogleによって2010年に公表された圧縮方式です。画像の圧縮というのは、人が軽く見ただけでは気が付かないような細かい部分を削っていく作業がメインになりますが、WEBPでは従来の圧縮方式よりも効率的な方法を使うことで、より綺麗に・よりデータ量が少なくなるようにしています。公表から16年が経過した現在では、対応していない環境もかなり減って使いやすい規格になっています。

AVIFは2019年に公表され、徐々に対応が進められている圧縮方式です。画像にノイズが発生しにくく、WEBP以上の圧縮効率を誇る……とされていますが、かなり新しいせいでアプリの対応が追いついていないことがあるという欠点を抱えています。
AVIFを表示できない環境を使っている人も割といらっしゃいますし、イラストの出力ソフトでもWEBPには対応しているがAVIFには非対応というものが多いため、画像を作る側としても扱いにくいです。
また、画像の内容によってはAVIFよりもWEBPの方が効率的に圧縮できる場合もあり、特に透過画像の表示は閲覧する環境によっては安定しません。このため、完全にAVIF一本に絞るのは難しいと判断しました。

そこで、当サイトでは「基本的にAVIF画像を表示する。AVIFよりもデータ量が抑えられる場合や、AVIFを表示できない古い環境・透過画像ではWEBP画像を表示する」という形式にしました。表示の安定性と効率を両立するための設定として、当面はこの体制で進めようと思います。将来的には全てAVIF、あるいは更に新しい方式の画像に置き換えることになるかもしれませんね。

ここまで長々と書いてきましたが、サイトを見ている方に意識してもらう必要があることは特にありません。引き続き当サイトをご覧ください。