画像と写真 · Social Image Resizer
4:5、0.8、または 1600×2000: 同じアスペクト比を記述する 3 つの方法
· 背景
アスペクト比 画像寸法 画像のサイズ変更
4:5 のような比率、0.8 のような小数、1600×2000 のようなピクセル サイズはすべて同じ形状を表し、仕様ではそれらを自由に組み合わせます。この投稿では、それらの間で変換する方法、ディメンションのペアを最も単純な比率に減らす方法、および丸めが混乱を引き起こす場所について説明します。
3 つの仕様、1 つの形状 — 1 つのソースが 4:5、別の 0.8、そして 3 つ目のソースがピクセルを与えるときの具体的な混乱
ブリーフでは、1 つのポートレートの形状を 4:5、0.8、または 1600×2000 として説明できます。 1 つ目は比率、2 つ目は幅を高さで割ったもの、3 つ目はその比率を持つ 1 つの具体的なピクセル グリッドです。これらのフォームを混同すると、クロップが回転したり、意図した形状に近いだけの寸法が生成されたりする可能性があります。
Social Image Resizer は、`4:5`、`4/5`、`1.91:1` などの使い慣れた比率の選択とカスタム テキストを受け入れます。そのパーサーは幅を高さで割った値を返し、sizeFromRatio はその数値と最長エッジのバジェットを組み合わせて整数の寸法を生成します。算術演算は表示され、単体テストが行われます。
比率表記 — 幅と高さ、順序が重要な理由、および 5:4 と 4:5 が同じ数値の異なる方向である理由
比率の順序は、幅が 1 番目、高さが 2 番目です。幅 4 単位が占有する高さの 5 単位未満であるため、4 ～ 5 は肖像画を意味します。 5対4は風景です。同じ 2 つの数字は、順序が逆になると同じ向きを表しません。
比率は形状を変更せずにスケーリングできます: 4×5、800×1000、および 1600×2000 はすべて同じ関係になります。それら自体には解決策は含まれていません。比率はクロッパーに長方形の形状を伝えます。ピクセル ペアは、最終的な四角形に含まれるサンプルの数をレンダラーに伝えます。
小数形式 - 幅を高さで割る、および 1.78 のような小数が 16:9 の近似である理由
小数形式は除算から来ています。 4 を 5 で割った値は正確に 0.8 ですが、16 を 9 で割った値は繰り返され、一般的に散文では丸められます。したがって、1.78 のような 10 進数は、16:9 の正確な置き換えではなく、省略表現である可能性があります。元の部分を使用すると、不必要なドリフトが回避されます。
ToolAcre のカスタム パーサーはコロンの両側で小数項をサポートしているため、`1.91:1` が有効です。ゼロおよび不正な形式のテキストは拒否されます。結果の JavaScript 数値は引き続き丸められた整数の出力次元に含まれるため、正確な出所が重要な場合は要求された表記を保持してください。
ピクセルから比率へ — ディメンションのペアを最大公約数で削減し、「ほぼ 4:5」が発生する理由
ピクセルの寸法を単純な整数比に減らすには、幅と高さを最大公約数で除算します。 1600×2000 の場合、約数は 400 となり、4×5 になります。ペアが予想される比率まで減らない場合は、小数点以下の幅を高さで割った値を比較し、丸めによって差異が生じたかどうかを判断します。
出力の四捨五入後に、すべての有用な比率がきちんとした小整数の削減を行うわけではありません。 sizeFromRatio は計算された短いエッジを丸めるため、カスタムの最長エッジは要求された小数に近似するペアを生成できます。キャンバスには依然として正の整数の幅と高さが必要です。端数の出力ピクセルは存在しません。
実用的な例: いくつかの次元ペアを削減する - 算術演算、およびペアが主張する比率と異なっている場合の検出
1080×1350 を最大公約数 270 で減算して、4:5 を取得します。 1200 を 630 で割ると、約 1.9048 が得られます。現在の Open Graph プリセットでは、簡潔な説明として 1.91:1 というラベルが付けられます。 1584 を 396 で除算すると、現在の 4:1 LinkedIn ラベルのバナー プリセットと一致する正確な 4 が得られます。
これらの例は、永続的な宛先仕様ではなく、現在の ToolAcre プリセットを説明しています。ここでの値は算術です。レビュー担当者は、寸法ペアがそのラベルと正確に一致するとき、丸められた規則であるとき、および誰かが誤って方向を交換したときを検出できます。
方向に関する単語 — 縦、横、正方形、縦、およびそれらを数字にマッピングする方法
正方形とは、幅が高さに等しいことを意味します。縦向きの場合は幅が小さくなります。横向きとは幅が広いことを意味します。 「垂直」は、9:16 のように、背の高い肖像画を表すことがよくありますが、言葉は数字ほど正確ではありません。注文した比率または寸法のペアを常に製造メモに保存してください。
ToolAcre の現在のラベルは、スクエア 1:1、ポートレート 4:5、フル ポートレート 9:16、およびランドスケープ 16:9 を区別します。これらの単語はナビゲーションに役立ち、値はジオメトリを推進します。関係者が「肖像画」とだけ言った場合は、いくつかの背の高い形状を推測するのではなく、比率や目的地を尋ねます。
これでカバーされない内容 — 現在、どのプラットフォームでどの比率が使用されているか。ここでの数値は仕様ではなく算術例として扱ってください。
この記事では、事前に設定された日付の表を超えて、今日の比率をソーシャル 商品に割り当てません。プラットフォームは寸法とプレゼンテーションを修正できます。算術演算は引き続き有効ですが、宛先が今日 4:5 を望んでいるかどうかは、外部の現状の問題であり、独自のガイダンスに照らしてチェックする必要があります。
また、比率が等しい 2 つのファイルの品質が等しいとも主張しません。 400×500 画像と 1600×2000 画像は形状を共有しますが、ピクセル数は共有しません。ソースの詳細、スケーリング方向、エンコーディング、および表示サイズは個別の変数のままであり、比率表記だけでは回答できません。
ポイント: 自信を持って変換できます。Social Image Resizer を使用すると、プラットフォームが期待するアスペクト比を選択し、ピクセル演算を処理できます。
概念を分けて表記を変換します: 形状の比率、数値比較の 10 進数、および具体的なピクセル グリッドの寸法。整数のペアで許可されている場合は最大公約数の削減を使用し、比率が整数の最長エッジと一致する場合は丸めを想定します。
Social Image Resizer はカスタム比率の最後の変換を実行し、実際の出力寸法を公開します。計算されたペアを確認し、意図した比率をレビューメモに保存し、宛先の現在の要件を確認します。これにより、表記の混乱が検査可能な算術演算に置き換えられます。