画像リサイズ
特定の寸法に画像をリサイズする
画像をリサイズするのはいつ?
スマートフォンのカメラは12〜48メガピクセルで撮影されます — ほとんどの用途には必要以上に大きいです。アップロード前にリサイズすると、面積の縮小に比例してファイルサイズが小さくなります(50%小さい側 = 面積の25% = 約25%のファイルサイズ)。ウェブページは、レティナで表示されるサイズの1〜2倍でレンダリングされます。それ以上は無駄な帯域幅です。
画像を引き伸ばしたり潰したりしたい場合を除き、常にアスペクト比を保ってください。このツールはデフォルトでアスペクト比を固定します:一方の寸法を変更すると、もう一方もそれに合わせて変わります。アルゴリズム的には、ブラウザはデフォルトでバイキュービック補間を使用します — ダウンスケーリングには十分にシャープですが、元のサイズを超えてアップスケーリングすると柔らかくなります(詳細を創造することはできません)。
一般的な使用例
- 4032×3024のスマートフォン写真を1920×1440にリサイズしてウェブサイトのヒーロー画像にする — ファイルサイズが約5MBから約600KBに縮小されます。
- ポートレートから正方形のサムネイルを作成 — 両方の寸法を400pxに設定し、中央のクロップを受け入れます。
- フォーラム投稿に1MBの画像制限がある場合に合わせてスクリーンショットをリサイズします。
- アイコンサイズを生成 — 256, 128, 64, 32 — アスペクト比を固定して繰り返します。
よくある質問
リサイズすると品質は低下しますか?
ダウンスケーリング(小さくすること)は、アルゴリズムが良ければ品質を保ちます — ブラウザで使用されるバイキュービックは問題ありません。元のサイズを超えてアップスケーリングすると常に柔らかくなります;ソースにない詳細を回復するツールはありません。
圧縮の前にリサイズすべきですか、それとも後に?
最初にリサイズし、その後に圧縮します。大きな画像を圧縮してからリサイズすると、圧縮の労力が無駄になります。
アスペクト比を保つにはどうすればよいですか?
アスペクト比のトグルを固定します(デフォルトはオン)。一方の寸法を変更すると、ツールが他方を元の比率に合わせて計算します。
最大サイズはどれくらいですか?
ブラウザのキャンバスサイズによって制限されます — 通常は約16384×16384ピクセルまでです。より大きなサイズの場合は、ImageMagickなどのデスクトップツールを使用してください。
私の画像はアップロードされていますか?
いいえ。リサイズはブラウザのCanvas APIを使用します;何もデバイスから離れません。
