無料画像リサイザーオンライン

画像のリサイズ方法

1. 上記で画像ファイルを選択またはドロップします。
2. プリセットサイズを選ぶか、幅と高さをピクセル単位で入力します。
3. ロックアイコンを切り替えて、元の縦横比を維持または無視します。
4. 「画像をリサイズ」をクリックして、ブラウザ内で画像を処理します。
5. リサイズされた画像をすぐにダウンロードします。

リサイズが実際にピクセルに行うこと

画像のリサイズは、切り抜きや圧縮と同じ操作ではありません。切り抜きは端のピクセルを破棄し、残りを変更しないままにします。圧縮はすべてのピクセルを保持しますが、それらをよりきつくエンコードします。リサイズは文字通りピクセル数を変更します: 4000x3000のソース画像を1920x1440にリスケールするには、そのほとんどのピクセルを捨て、同じシーンを4分の1の解像度で表現するために新しいものを選ぶ必要があります。どの新しいピクセルを書くかを決定する数学的な操作はリサンプリングと呼ばれ、リスケールの品質はほぼ完全に実行されるリサンプリングアルゴリズムに依存します。

一般的に使用される4つのリサンプリングアルゴリズムは、nearest-neighbour (最も近い単一のソースピクセルを選択、ハードエッジを保持、拡大時にブロック状、ピクセルアートに対する唯一の正しい選択)、bilinear (周囲4つのソースピクセルの線形ブレンド、速く凡庸)、bicubic (周囲16ピクセルにわたるKeys 1981立方カーネル、何十年もPhotoshopのデフォルト)、Lanczos (Lanczosカーネルでウィンドウ化されたsinc関数、最もシャープな出力、ハードエッジ近くの軽微なリンギング、ImageMagickとSharpがダウンスケールにデフォルトで使用) です。このツールはCanvas APIのimageSmoothingQualityを"high"に設定し、ChromeとFirefoxはこれをデスクトップでLanczosクラスのカーネルとして解釈し、Safariはbicubicクラスのカーネルとして解釈します。ブラウザが選びます; JavaScriptはhighを要求できますが、正確なフィルタを選ぶことはできません。

ダウンスケールとアップスケールは対称的な問題ではありません。ダウンスケールは制御された方法で情報を破棄します; リサンプラがどの詳細を保持するかを決定し、良いアルゴリズムはソースの可視構造を保持します。アップスケールはサンプリングされなかったピクセルを追加し、情報理論 (Nyquist-Shannonサンプリング定理) は元の信号にない周波数を回復できないと言います。古典的なリサンプラができる最善は既知のサンプル間を滑らかに補間することで、これは常にソフトに見えます。本物の拡大には、現代の代替案はAI超解像 (Real-ESRGAN、waifu2x、Adobe Super Resolution、Topaz Gigapixel) で、これは何百万もの類似画像で訓練されたニューラルネットワークを使用してもっともらしい詳細を幻覚します。それはここで起こっていることではありません。このツールは正直な補間を行います。

このツールが内部でどのように動くか

パイプライン全体はHTML5 Canvas 2D APIです。外部ライブラリはロードされません。画像をドロップすると、ブラウザのFile APIがバイトを新しいHTMLImageElementに渡します; ブラウザの組み込みJPEG、PNG、またはWebPデコーダがビットストリームをピクセルバッファに変換します。アスペクト比は自然な幅と高さから計算されます。設定したターゲット寸法で新しい要素がメモリ内に作成され、ctx.drawImage(image, 0, 0, targetWidth, targetHeight)がソースを宛先にスケーリングして描画します。宛先がソースと異なる寸法を持つため、ブラウザはすべての新しいピクセルを計算するためにリサンプリングカーネルを呼び出します。

drawImage呼び出しの前に、ツールはctx.imageSmoothingEnabled = trueとctx.imageSmoothingQuality = "high"を設定します。最初のフラグはスムージングをオンにします (nearest-neighbourオフ); 2番目はブラウザに最高品質のフィルタを使用するように示唆します。WHATWG canvas仕様は正確なフィルタを実装に任せます。デスクトップ上のChromeとFirefoxはhighでLanczosクラスのカーネルを使用; Safariはbicubicクラスのカーネルを使用; モバイルビルドはメモリ圧迫下でbilinearにダウングレードする場合があります。これらのいずれもJavaScriptには見えません。描画後、canvas.toBlob(mimeType, quality)はcanvasを選択された出力形式のBlobにシリアライズします: PNG (lossless DEFLATE、quality引数は無視される)、JPEG (品質0.92のlossy DCT)、またはWebP (品質0.92のlossyまたはlossless)。Blobはダウンロード可能なオブジェクトURLになります。

バイトはタブを離れません。画像はあなたのブラウザでデコードされ、あなたのブラウザでリサンプリングされ、あなたのブラウザで再エンコードされます。ダウンロードされたファイルはローカルに生成され、ブラウザの通常のダウンロードメカニズムによってデバイスに保存されます。唯一のネットワークトラフィックは初期ページロードと小さなimage-resizer.jsスクリプト (数キロバイト) です。ページがロードされた後にブラウザを機内モードに切り替えると、リサイザはあなたが選択した任意のローカル画像で動作し続けます。リサイズ中にDevToolsのNetworkタブを開いてください: 画像データを運ぶリクエストはゼロです。Canvas APIはこの仕事に十分強力なため、アーキテクチャ全体は意図的に最小限です; ライブラリを引き込むと、出力を変更することなくバイトと複雑さが追加されるだけです。

画像リサンプリングの簡単な歴史

• 光学引き伸ばし機、プレデジタル時代。 デジタル写真の前は、写真を「拡大する」ことは、ネガを光学引き伸ばし機を通して感光紙に投影することを意味しました。レンズは量子化なしで連続的にリサンプリングを行いましたが、レンズ自体の光学的限界がありました。最初の商用引き伸ばし機は1860年代に遡ります。リサンプリングは数学的操作として、画像が連続的なエマルションではなくピクセルグリッドとして存在するようになって初めて意味のある問題になりました。
• Bicubic補間、1973-1981年。 Robert G. Rifmanは1973年にTRW Defense and Space Systemsで、衛星画像のリスケーリング用に書かれたbicubicスプライン画像リサンプリングアルゴリズムを発表しました。標準的な定式化はR. G. Keysが1981年に発表したものから来ました: IEEE Transactions on Acoustics, Speech, and Signal ProcessingでCubic Convolution Interpolation for Digital Image Processing。今日bicubicと言うすべての画像処理ライブラリは、4x4近傍で評価されたKeys立方カーネルを意味します。
• Mitchell-Netravaliフィルタ、1988年。 Don P. MitchellとArun N. NetravaliはSIGGRAPH '88でReconstruction Filters in Computer Graphicsを発表し、2つの係数BとCで調整可能なパラメータ化された立方フィルタファミリーを紹介しました。標準的なMitchellフィルタ (B=C=1/3) は、わずかなシャープネスを非常に低いリンギングと交換し、libvipsのような高品質画像処理ライブラリでダウンスケールの標準デフォルトになりました。
• ImageMagick選択可能フィルタ、1990年代。 John Cristyは選択可能なリサンプリングフィルタを第一級機能としてImageMagick (元々1987年、1990年に公開) をリリースしました。1990年代半ばまでに、写真家とDTPプロフェッショナルは同じソース画像でLanczos、Mitchell、Catmull-Rom、Hermite、Gaussianを比較し、ユースケースごとに選択できました。ImageMagickの-filter Lanczosは今でも本番パイプラインで一般的なレシピです。
• HTML5 Canvasリサイズ、2008-2017年。 WHATWG canvas仕様は2008年に暗黙のスケーリングでdrawImage()を標準化し、9引数フォーム (ここで使用されているもの) はそれ以来すべてのブラウザにあります。imageSmoothingQuality属性 (low / medium / high) は後で出荷されました、Chrome 54は2016年、Firefox 51は2017年、Safari 11.1は2018年。それ以前は、ブラウザ側のリサイズは、ツールがhigh qualityを要求しても、すべての実装で事実上bilineareのみでした。
• AI超解像、2018-2021年。 ESRGAN (Wang et al., 2018) は、生成的敵対的ネットワークが拡大された写真のための信じられる詳細を合成できることを実証しました。Real-ESRGAN (Wang et al., 2021) は、実世界の入力にとって技術を実用的にしました; waifu2x (nagadomi, 2015) は、以前にアニメアート用にCNNベースのバリアントを調整していました。Adobe Camera Rawは2021年にSuper Resolutionを追加しました。これらのツールはダウンスケールのための古典的なリサンプリングを置き換えるものではありません; それらは、滑らかな補間ではなく、特に幻覚された詳細を望むケースをターゲットにしています。

一般的な画像サイズ

• 1920 x 1080 · Full HD、ウェブの背景やYouTubeサムネイルの標準サイズ。
• 1080 x 1080 · Instagramフィード投稿（正方形フォーマット）。
• 1080 x 1350 · Instagramポートレート投稿（フィードで画面を大きく占有）。
• 1280 x 720 · HD、ブログのヘッダーやプレゼンテーションに最適。
• 800 x 600 · クラシックなウェブ画像サイズ、メールマガジンに最適。
• 400 x 400 · プロフィール写真やアバター画像。
• 16 x 16 / 32 x 32 · ウェブサイトのファビコンサイズ。

実世界のリサイズワークフロー

• ソーシャルメディアプラットフォームのサイジング。 すべてのソーシャルプラットフォームには、フィード投稿、ストーリー、バナー、サムネイル用の好みの寸法があります。間違ったサイズでアップロードすると、プラットフォームがあなたに代わってクロップまたはレターボックスを行い、しばしば悪く行います。一般的な2026年のターゲット: Instagramフィード1080x1080 (正方形) または1080x1350 (縦長、モバイルフィードで約25%多くの垂直スクリーンを占めるため、現在最高のエンゲージメントを持つ静止形式)、Instagramストーリーとリール1080x1920、YouTubeサムネイル1280x720、Twitter/Xインストリームカード1200x675、FacebookとLinkedInリンクプレビュー (Open Graph) 1200x630、Pinterest標準ピン1000x1500、TikTok 1080x1920。アップロード前に一度リサイズすることで、欲しい結果が保証されます; 生の写真をアップロードすると、選択がプラットフォームに任されます。
• ウェブ最適化とCore Web Vitals。 LighthouseのProperly size imagesオーディットは、自然な寸法が表示寸法よりもはるかに大きい画像を失敗とします。1200ピクセル幅で表示されるが4000ピクセルで提供されるヒーロー画像は帯域幅を無駄にし、最も目に見えるCore Web VitalであるLargest Contentful Paintを損ないます。修正は、ソースを表示サイズ程度、またはretinaディスプレイには2倍にリサイズし、現代のsrcset属性を介して異なるビューポートに異なるサイズを提供することです。単一のヒーロー画像を4000から1920ピクセルにリサイズすると、通常ファイルサイズが60〜80%カットされ、LCPスコアが直接続きます。
• メール添付ファイル。 Gmail、Outlook、Apple Mailはすべてメッセージあたり25 MBで添付ファイルを上限としています。フル解像度の電話写真のフォルダは、わずか5、6枚の画像でキャップに達することができます。長辺を1920ピクセルにリサイズすると、通常各写真を1 MB未満にカットし、任意のラップトップまたは電話画面で完全に表示可能なままにします。1920ピクセルでの20枚の写真は、単一のメッセージに快適にフィットします; フル解像度の同じ20枚は3つまたは4つの送信またはクラウド共有リンクを必要とします。
• プロフィール写真とアバター。 ほとんどのソーシャルプラットフォームはプロフィール写真用に400x400から800x800ピクセルを望み、それらを円として表示します。アップロード前にローカルでリサイズすることで、プラットフォームに任意のクロップをさせるのではなく、正方形アスペクトクロップ (このツールのImage Cropperと組み合わせる) と正確なピクセル数を制御できます。retinaディスプレイの経験則は、表示サイズの2倍でアップロードすることなので、200ピクセルアバターは少なくとも400x400ソースである必要があります。
• ファビコンとアプリアイコン生成。 現代のブラウザは16x16 (ブラウザタブ) と32x32 (高DPIタブ) を望み、Appleタッチアイコンは180x180、Windowsタイルアイコンは270x270、Progressive Web Appマニフェストは通常192x192プラス512x512を含みます。1つのよく設計された正方形ソース (通常細部のない512x512 PNG) をこれらの各ターゲットにリサイズすることは、すべてのプラットフォームでシャープなアイコンを生成するための標準的なワークフローです。
• 印刷準備。 300 DPIでの4x6インチ写真プリントには1200x1800ピクセルのソース解像度が必要です。16x20インチのポスターには4800x6000が必要です。240 DPI (新聞紙品質) での8x10インチプリントには1920x2400が必要です。意図された印刷サイズの正しいピクセル数にソースをリサイズすることは、印刷ラボがあなたに代わって自動リサンプリングする必要がないことを意味し、これは予測不可能なフィルタ選択と未知の品質設定を回避します。リサイズされたピクセル数を印刷ダイアログの正しいDPIメタデータと組み合わせると、結果は画面で見たものに一致します。

よくある落とし穴とその意味

• アップスケールは常にぼやけて見えます。 200ピクセル幅のサムネイルを1920ピクセルに拡大すると、どのブラウザや品質設定が使用されたかに関係なくソフトに見えます。古典的補間 (bicubic、Lanczos、Mitchell) は既知のサンプル間を滑らかにするだけで、欠けている詳細を発明することはできません。情報理論の天井はソースのNyquist周波数によって設定されます。シャープな出力を生成する実際の拡大には、何百万もの類似画像で訓練されたニューラルネットワークを使用してもっともらしい詳細を幻覚するスーパーレゾリューションツール (Real-ESRGAN、Topaz Gigapixel AI、Camera RawのAdobe Super Resolution) を通してソースを実行します。
• アスペクト比のロックを解除すると写真が引き伸ばされます。 ロックアイコンが無効化され、幅と高さが一致しないと、出力は数学的に押し潰されたり引き伸ばされたりします。ツールはデフォルトでロックオン; ロック解除は意図的なアクションです。ソースの自然なものではなくターゲットアスペクト比に合わせる必要がある場合、正しいワークフローは最初にクロップする (Image Cropperを使用) してからクロップされた結果をリサイズすることです。これにより比率が正しく保たれ、被写体が歪まないままになります。
• ピクセルアートはスムーズに消されます。 このツールのスムージングオンのデフォルトは、8ビットスプライト、ピクセルグリッドアイコン、および色付きセル間のハードエッジが要点である任意のグラフィックを破壊します。任意のスムージングフィルタ (bilinear、bicubic、Lanczos) でリサンプリングすると、これらのエッジがグラデーションにぼかされます。ピクセルアートの正しい答えは、すべてのハードエッジを保持するnearest-neighbourリサイズです。ブラウザ側では、表示される画像にCSSでimage-rendering: pixelatedを設定します。新しいサイズでの実際のエクスポートには、デスクトップツールを使用します: ImageMagickの-filter Point、GIMPのNone補間、またはAsepriteのような専門的なエディタ。
• 再リサイズはJPEGとWebPを劣化させます。 canvasを通る各往復はJPEGまたはWebPを品質0.92で再エンコードします。最初のパスは視覚的に知覚できません; 3回目または4回目のパスは平らな領域に目に見えるアーティファクトを導入し、細かい詳細をソフトにします。常にあなたが持っている最高解像度のマスターからリサイズしてください、昨日エクスポートしたコピーからではありません。反復する必要がある場合 (1920を試す、次に1600、次に1280)、リサイズをチェーンするのではなく毎回元のソースに戻ってください。
• 印刷DPIはピクセル寸法と同じではありません。 多くの人がDPIまたは解像度フィールドが印刷サイズを制御することを期待します。このツールはピクセル数のみでリサイズします。JPEGまたはPNGのDPIメタデータタグは、プリンターに紙にレンダリングするインチあたりのピクセルを伝える助言情報です。ピクセル寸法とDPIは独立しています: 1920x1080画像は任意のDPI設定で1920x1080ピクセルです。印刷サイズを制御するには、印刷ダイアログまたはデスクトップフォトツール (PreviewのPrintペイン、PhotoshopのImage SizeダイアログでResample Imageをオフにする) で正しいDPIも設定する必要があります。
• 非常に大きな画像はモバイルブラウザタブをクラッシュさせる可能性があります。 canvasに画像をデコードするには、その寸法に比例したRAMが必要です: 24メガピクセル写真 (6000x4000ピクセル) はRGBAソースピクセルバッファだけで約96 MB必要で、ターゲットcanvas用の別のバッファ、JPEGまたはWebPエンコーダワークスペースが必要です。ブラウザに利用可能な1〜2 GBのRAMを持つモバイルデバイスは、エンコードが完了する前にOSによってタブが終了する可能性があります。非常に大きな写真には、デスクトップブラウザでリサイズするか、各ステップが利用可能なメモリにフィットするように段階的にダウンサイズしてください (最初に50%、次にもう一度50%)。

プライバシー: 画像はデバイスを離れません

すべてのクラウドベースの画像リサイザ (iLoveIMG、ResizeImage.net、ResizePixel、BeFunky、Fotor、Pixlrのresizeエンドポイント、数十のresize image onlineサービス) は、ファイルをオペレーターのサーバーにアップロードし、リサイズアルゴリズムを実行し、より小さい画像をダウンロードとして返します。写真は通常識別可能なコンテンツを含むため、プライバシーへの影響は非自明です: 顔、背景に見える住所、内部UIまたは機密文書のスクリーンショット、子供の写真、プライベートな空間で撮影された写真、個人情報を含むドキュメントスキャン。ほとんどのオペレーターは、1時間または2時間以内にアップロードを削除し、転送中に暗号化することにコミットするプライバシーポリシーを公開しており、より大きなものはISO/IEC 27001認証を保持しています。彼らはそれらのポリシーを尊重する強い商業的理由を持っています。しかし「1時間以内に削除」は「決して見られない」ではありません。その1時間の間、画像コンテンツはオペレーターのインフラストラクチャに存在し、適切なアクセス権を持つ任意のプロセスや人がアクセスでき、適用される保持ポリシーに従ってログとバックアップに表示されます。

このリサイザは何もアップロードしません。パイプライン全体 (ファイル選択、画像デコード、canvasリサイズ、エンコード、ダウンロード) は、JavaScriptとHTML5 Canvas APIを使用してブラウザタブ内で実行されます。アップロードなし、画像データを運ぶネットワークリクエストなし、ログエントリなし。リサイズ前にブラウザの開発者ツールをNetworkタブに開いて確認できます: 画像コンテンツを含むリクエストは発火しません。唯一のネットワークトラフィックは初期ページロードと小さなimage-resizer.jsスクリプトです。ページがロードされた後にブラウザを機内モードに切り替えると、リサイザは任意のローカルファイルで動作し続けます、これは何もアップロードされていないという最強の経験的証明です。何か機密性のあるもの (顔、場所、内部スクリーンショット、IDドキュメント) を含む写真の場合、ブラウザ側の取引は明らかに価値があります。

別のツールが正しい選択になるとき

• 数百のファイルにわたるバッチ自動化。 Node.jsでsharp (libvipsに基づく標準的なサーバーサイド画像ライブラリ)、コマンドラインでImageMagickまたはGraphicsMagick、またはPythonでPillowを使用してください。これらのツールはブラウザメモリ制限なしに数千のファイルを処理し、すべてのリサンプリングカーネルを明示的なオプションとして公開し、CIジョブ、デプロイフック、またはcronタスクから実行されます。
• 本物の拡大のためのAI超解像。 実際に詳細を追加するシャープな拡大のためには、ニューラルネットワークアップスケーラーを使用してください。Real-ESRGAN (オープンソース、ChaiNNerまたはCLI経由でローカルに実行)、waifu2x (オープンソース、無料のウェブデモが利用可能)、Topaz Gigapixel AI (商業デスクトップ)、またはCamera RawまたはLightroom内のAdobe Super Resolution。これらのモデルは詳細を回復するのではなくもっともらしい詳細を幻覚します; モデルがトレーニング中に多くの類似画像を見たため、結果は顔と自然なテクスチャでシャープに見えます。
• ハードエッジを保持するピクセルアートリサイズ。 nearest-neighbourリサンプリングを明示的に公開するツールを使用してください: ImageMagickの-filter Point、GIMPの補間を「None」に設定、またはAsepriteのような専門ピクセルアートエディタ。Canvas APIのimageSmoothingEnabledフラグがオンになっているため、このツールは常にスムージングします; オフにすると他のすべてのユースケースを劣化させるため、トレードオフはスプライトよりも写真を優先します。
• DPI制御による印刷品質のワークフロー。 Adobe Photoshop、Affinity Photo、またはLightroomは、ピクセル寸法とDPIの両方を独立した設定として公開し、カラー管理されたワークフロー (ICCプロファイル保存、ソフトプルーフィング、CMYK出力) をサポートし、非破壊的なリサイズ履歴を記憶します。Canvasは sRGB で動作し、再エンコーディング中に埋め込まれたカラープロファイルを削除する可能性があるため、ブラウザベースのCanvasリサイズはそれらのいずれも保証できません。

よくある質問

リサイズすると画質は低下しますか？

縮小は品質をよく保持します。拡大（画像を元のサイズよりも大きくすること）は、新しいピクセルを補間する必要があるため、多少のぼやけが発生します。最高の結果を得るには、最も高解像度のソース画像から始めてください。

「縦横比をロック」は何をしますか？

ロックすると、幅を変更すると高さが自動的に調整され（またその逆）、画像の元の比率が維持されます。正確な寸法に引き伸ばしたり押しつぶしたりする必要がある場合は、ロックを解除してください。

私の画像はサーバーにアップロードされますか？

いいえ。すべてのリサイズはHTML5 Canvas APIを使用してブラウザ内でローカルに行われます。お使いの画像がデバイスから出ることはありません。

出力形式を変更できますか？

はい。元の形式に関係なく、リサイズした画像をJPEG、PNG、WebPとして出力できます。リサイズしながら形式を変換するのに便利です。

その他のよくある質問

DPI、PPI、ピクセル寸法の違いは何ですか?

ピクセル寸法 (ピクセル単位の幅×高さ) は、画像が実際に何を含むかを記述します。PPI (インチあたりのピクセル) は、これらのピクセルが画面に表示されるときにどの程度密にパックされているかを記述し、これは表示ハードウェアのプロパティであり、ファイルではありません。DPI (インチあたりのドット) は、画像が印刷されるときに紙のインチあたりに何個のプリンター出力ドットが置かれるかを記述します。JPEGまたはPNGに埋め込まれたDPIタグは、プリンターのための助言メタデータです; それはピクセルデータを変更しません。1920x1080画像は任意のDPI設定で1920x1080ピクセルです。プリントを縮小するには、ピクセル数を減らす (このツール) か、印刷に送る前にDPIメタデータを増やします (デスクトップツールのPrintダイアログまたはPhotoshopのImage SizeでResample Imageをオフにする)。

なぜ私の拡大された画像はぼやけて見えるのですか?

情報理論がそうでなければならないと言うからです。古典的リサンプリング (bicubic、Lanczos、Mitchell) は既知のソースピクセル間を滑らかに補間するだけで、サンプリングされなかった詳細を発明することはできません。Nyquist-Shannonサンプリング定理はハード上限を設定します: ソースのピクセルグリッドレートの半分を超える周波数は数学的に回復不可能です。200ピクセルソースを1920ピクセルに拡大すると、新しいピクセルの90%が補間されるため常にソフトに見えます。シャープな拡大には、何百万もの類似画像で訓練されたニューラルネットワークを介してもっともらしい詳細を合成する超解像モデル (Real-ESRGAN、Topaz Gigapixel、Adobe Super Resolution) を使用してください。

retinaまたはHiDPIスクリーン用にリサイズすべきですか?

はい。retina iPhone、MacBook、HiDPI Windowsスクリーンは、論理CSSピクセル密度の2倍または3倍でレンダリングします。retinaスクリーンで1200論理ピクセル幅で表示されるヒーロー画像は実際に2400物理ピクセルをペイントします。HTMLのsrcset属性 (現代のレスポンシブ画像標準) を介して2倍ソースを提供すると、ブラウザは各ビューアのデバイスに適したものを選択します。srcsetのない単一のアバターまたはヒーロー画像の場合、表示サイズの2倍にリサイズするだけで: 画像はretinaでシャープになり、非retinaではわずかにオーバーサイズになります、これは小さな帯域幅を消費しますが、高密度ピクセル上にストレッチされたアンダーサイズの画像のはるかに目立つぼかしを回避します。

このツールはオフラインで動作しますか?

はい。HTML5 Canvas APIはダウンロードされたライブラリではなくブラウザ自体の一部であり、キャッシュする別のランタイムはありません。ページは通常通りロードされます; 一度開かれると、リサイザはあなたが選択した任意のローカルファイルに対してブラウザ組み込みコードから完全に実行されます。ページを開いた後にエアプレーンモードに切り替えてローカル画像をリサイズすることで確認できます。ダウンロードされた結果はローカルに生成され、ブラウザの通常のダウンロードメカニズムによって保存され、ネットワーク関与もありません。

リサイズの前に切り取るべきですか、それとも後ですか?

最初に切り取り、次にリサイズします。切り取りは望ましくない端のピクセルを破棄することによってアスペクト比 (YouTube用16:9、Instagramフィード用1:1、Stories用9:16、Open Graph用1.91:1) を設定します。リサイズは選択されたアスペクト比のピクセル数を設定します。逆の順序で手順を行うことも可能ですが、作業を浪費します。必要以上のピクセルをリサンプリングし、その後切り取り中に一部を捨てることになります。このツールでは、最初にImage Cropperを使用してアスペクト比を設定し、次にこのImage Resizerを使用して正確なターゲット寸法を設定します。多くのプラットフォーム固有のワークフロー (1280x720のYouTubeサムネイル、1080x1080のInstagramフィード) は両方のステップを組み合わせます; 2つの専用ツールでそれらを順番に行うと、引き伸ばされたアスペクト比で両方を一度に行おうとするよりもクリーンな出力が得られます。

デスクトップまたはコマンドラインに同等のものはありますか?

いくつかあります。バッチ自動化のためには、Node.jsのsharpが標準のサーバーサイドライブラリです (libvipsに基づく)。ImageMagick (magick input.jpg -resize 1920x1080 output.jpg) とGraphicsMagickは任意のシェルから実行し、巨大なファイルを処理します。PythonのPillow (Image.open(p).resize((1920, 1080), Image.LANCZOS)) はデータサイエンスワークフローのデフォルトです。このツールのような単発のインタラクティブな作業に、AVIFを含む明示的なper-kernel制御とより多くの出力形式を持つには、Squoosh (Google Chrome Labs、完全にクライアントサイド) が推奨されるブラウザの代替です。Photoshop、Affinity Photo、macOSのPreview (ツール、サイズ調整) はデスクトップGUIケースをカバーします。

関連ツール