私は流動的なウェブサイトを開発しています。最高の画質と最小の画像読み込み時間を実現するために、解像度ごとに異なるスプライトを使用します (例: 1680+、1440+、1280+、1024+、800+、1680@2x (網膜用)、1440@2x など)。 @media クエリ経由。
私は10個の異なるスプライトを持つことになります。CSS (background-size または max-width) を使用して高解像度の画像を単純に縮小すると、品質が低下し (特にアイコンの場合)、画像ファイル サイズに不要なオーバーヘッドが発生します。
Photoshop で画像を 10 倍に縮小して微調整することは、良い方法ではありません (Imagemagick はここでは機能しません)。それを正しく行う方法は？