2020年夏のウェブ技術の見直しシリーズ第2段（第1段はこちら）として見直していたWebPの情報ですが、2022年2月にPhotoshopデスクトップ版でWebPがネイティブサポートされました。macOS Big Sur / iOS 14以降のSafariを含む最新のブラウザではWebPがサポートされています。導入しやすくなったいま、もう一度特徴をおさらいしておくと良さそうですね。 ということで、以下はWebPについてのまとめです。2020年7月の情報を2022年2月に更新しました。 なんでもかんでもWebPでいいわけではない 試しにUnsplash でランダムに10枚の写真を選んで、ImageOptimとcwebpコマンドラインツールでjpgとwebpに書き出してみました。結果、WebPのファイルサイズが小さくなる画像もあれば、JPEGのほうが小さくなる画像もありました。たまたまだと思い
WebPとJPEGを利用しつつ何も考えなくて良い方法「Chrome Dev Summitで披露された高速化のテクニックの数々（所感を含む）」を見てみると <picture> <source type="image/webp" src="image.webp"> <img src="image.jpg"> </picture> WebP対応ブラウザならWebP、WebP未対応ならJPEGという書き方ができるらしい。 テスト用のJPEG画像を用意してSquooshで圧縮とフォーマット変更してWebP画像とJPEG画像を用意 これを参考にHTMLを書いてみた。 <picture> <source type="image/webp" srcset="https://cdn.barasu.org/2018/11/2018112301-WebP.webp"> <img src="https://cdn
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
