画像のリサイズと切り抜き

デジタル画像はピクセルのグリッドです——1920×1080の画像は200万以上の個別ピクセルを持ちます。リサイズはこのグリッドのピクセル数を変更します。ダウンスケーリングは複数のピクセルを少数にマージする必要があります。アップスケーリングは既存のピクセルから新しいピクセルを補間する必要があります。結果の品質はリサンプリングアルゴリズムに大きく依存します。

ブラウザのCanvas APIは組み込みの画像リサンプリングを使用します。バイリニア補間は4つの最近傍ピクセルの加重平均として各新しいピクセルを計算します。バイキュービック補間は4×4の近傍を使用し、より滑らかな結果を生成します。私たちのツールは最高品質のため'high'を使用します。

リサイズ時にはアスペクト比を維持することが重要です。アスペクト比をロックしないで寸法を変更すると、画像が引き伸ばされたり歪んだりします。私たちのツールはデフォルトでアスペクト比をロックします。

リサイズ、切り抜き、圧縮はよく混同される3つの異なる操作です。リサイズは画像の寸法（ピクセル数）を変更します。切り抜きは焦点を絞るためにエッジからピクセルを削除します。圧縮は寸法を変更せずにファイルサイズを削減します。

ウェブ最適化には通常3つすべてが必要です：目的のアスペクト比に切り抜き、ターゲット寸法にリサイズし、ファイルサイズを削減するために圧縮します。よくある間違いはリサイズせずに圧縮することです。ウェブ画像には常にリサイズと圧縮を両方行ってください。