タグ

Googleと画像に関するkenyuyのブックマーク (2)

  • グーグルが開発した画像圧縮ツールSquoosh。フロント開発向けにNode.jsで扱う方法まとめ - ICS MEDIA

    グーグルが開発した画像圧縮ツールSquoosh。フロント開発向けにNode.jsで扱う方法まとめ 『Squooshスクーシュ』というGoogleが開発した画像圧縮ウェブアプリがあります。ブラウザで変換結果を見ながら圧縮設定ができるので、画像圧縮の難しい知識を持たない方でも使いやすいことが特徴です。圧縮だけでなく、WebPなどの各種フォーマットへの変換・リサイズといったこともできる便利ツールです。 このSquooshをNode.jsで扱える『libSquoosh』が存在します。libSquooshは大量の画像を一括で圧縮、WebPへの変換、リサイズなどの処理をこれ1つで完結できるのがポイントです。昨今のウェブはページの読み込み時間が重視される傾向があります。画像のファイルサイズは読み込み時間に大きく影響するため、画像圧縮は重要なテクニックです。libSquooshをwebpack・Viteと

    グーグルが開発した画像圧縮ツールSquoosh。フロント開発向けにNode.jsで扱う方法まとめ - ICS MEDIA
  • そろそろWebPに切り替えよう。変換方法や対応ブラウザ、使い方を解説! | Web Design Trends

    WebP(ウェッピー)は、Googleが開発している次世代画像フォーマットです。PNGやJPEGと比べてファイルサイズを抑えることができ、トラフィックの削減やページ表示速度の向上を実現することができます。 今回は、WebP(ウェッピー)の基と、メリットやデメリット、変換方法、対応ブラウザなどをご紹介したいと思います。 WebP(ウェッピー)とは? WebP(ウェッピー)は、Googleが開発している次世代画像フォーマットで、拡張子は「.webp」です。 WebPは、JPEGやPNGと比べ、同程度の画質の画像をより小さなファイルサイズで保存することができます。Googleの発表では、PNGよりも26%、JPEGよりも25%〜34%程度ファイルサイズを抑えることができると言われています。 また、WebPは背景透過(アルファチャンネル)や、アニメーションにも対応しています。つまり、JPEGのよ

    そろそろWebPに切り替えよう。変換方法や対応ブラウザ、使い方を解説! | Web Design Trends
  • 1