画像を縦横に伸ばさずリサイズする方法

画像が縦長や横長に変形する主な原因は、元画像と異なる比率で幅と高さを指定することです。リサイズはピクセル数を変える処理、切り抜きはフレーム内に残す範囲を決める処理です。この二つを分けて考えると、仕上がりを予測しやすくなります。

PolishToolsの画像リサイズ・切り抜きツールは、選択したファイルをブラウザ内で処理します。サーバーへのアップロードは行いません。ただし、書き出した画像は再エンコードされるため、元ファイルと同一ではありません。

最初に元画像の縦横比を確認する

縦横比は幅と高さの関係を表します。2400×1600の画像は3:2、1920×1080の画像は16:9です。比率を固定したまま幅を半分にすると、それぞれ1200×800、960×540になります。

基本は比率固定を有効にし、幅か高さのどちらか一方だけを変更します。掲載枠が元画像と異なる比率なら、固定を解除して押し込むのではなく、切り抜きで合わせます。

リサイズだけなら写真全体が残ります。ただし、掲載枠の比率が異なると余白が出たり、表示先のサイト側で一部が切れたりします。切り抜きは写真の一部を除き、決められた枠にぴったり合わせる処理です。

3:2の写真を正方形のサムネイルにするなら、先に1:1の範囲を選び、その後800×800へ縮小します。切り抜かずに幅と高さを800へ変更すると、顔や円形の物が不自然に変形します。

縮小では複数のピクセルをまとめて新しいピクセルを作れます。反対に400×300の画像を1600×1200へ拡大すると、ブラウザは元ファイルにない情報を補間することになります。ピクセル数は増えても、失われた細部や鮮明さは戻りません。

ロゴやイラストのSVG原稿があるなら、ビットマップを拡大せず、SVGから必要なサイズで書き出します。写真も、できるだけ出力サイズ以上の元画像を用意してください。

画面上のプレビューで確認できるのは切り抜き範囲です。JPEG・WebPの圧縮結果は、ダウンロードしたファイルを100%表示で開いて確認してください。品質設定を変えて再度ダウンロードし、どの設定から輪郭が崩れ始めるかを比較します。

ブラウザによって画像エンコーダーが異なるため、同じ形式と品質でも容量や細部にわずかな差が出る場合があります。容量制限が厳しい用途では、実際に使うブラウザで結果を確認してください。

書き出し画像はブラウザのキャンバスを通して新しく生成されます。その際、EXIFの撮影情報、位置情報、向き、一部のカラープロファイルなどが削除される場合があります。容量やプライバシーの面では利点もありますが、保存用の原本にはなりません。

GIFとアニメーションPNG・WebPは入力できません。動きを残す必要がある場合は、フレームを扱える専用ツールを使用してください。

カメラで撮影した6000×4000のJPEGを、Web記事の本文画像に使うケースを考えます。

元の3:2比率を保った1200×800の静止画像になります。メタデータや最大解像度が必要な元ファイルは別に保管してください。

幅と高さを好きな数字で指定してもよいですか？

二つの値が元画像と同じ比率なら問題ありません。比率が異なる場合は、画像を変形させず、先に目的の比率へ切り抜いてください。

画像を大きくすると画質も良くなりますか？

良くなりません。補間によってピクセル数は増えますが、元画像にない細部や失われた鮮明さは戻りません。

画像はPolishToolsのサーバーに保存されますか？

選択した画像はブラウザ内で処理され、サーバーへアップロードされません。共用パソコンでは、ダウンロードフォルダーに残った出力ファイルを自分で削除してください。