イメージのサイズが異なる場合の命名規則

Question

thumborイメージサーバーを使用して、ユーザーがアップロードしたイメージの異なる解像度を自動的に生成しています。

イメージは、中規模のプロフィール写真、リストの小さな画像、詳細ページの大きな画像、ギャラリーのさらに大きな画像など、さまざまな場所で使用されます。 一部のバリアントは元のアスペクト比を持ち、他のバリアントは4：3フレームに適合し、背景が灰色でなければなりません。

"small"、 "medium"、 "large"などのイメージサイズ識別子は意味を持ちませんし、何かを意味する可能性があります。残念ながら、私はこの状況のた​​めの文書化された命名規則を見つけませんでした。

どのようなイメージサイズの命名規則が知られていて、Webアプリケーション環境で最も効果的ですか？

Answer 1

我々は、以下の溶液で決着しました：まず

---

1. は、我々はすべてのリストを作りました画像サイズ、縦横比、およびフロントエンドで必要なスタイルが含まれます。
2. 類似のサイズ、同じアスペクト比とスタイルのバケットにグループ分けしました。
3. 使い方の場所、スタイル、サイズ/アスペクトに応じて名前が付けられました。いくつかのリストビューの
   • thumbnail（小さな画像、40ピクセル幅）
   • small（300×225に収まる）
   • list43grey（：私たちは次の名前のリストを持っていた最後に

、4：3のアスペクト比、グレーの背景）

listquad（一部のリストビューでは1：1のアスペクト比、クロップフィット）

detail（詳細ページ上の大きな画像、800x400）

fullscreen

（フルスクリーニングギャラリー、1600×1200）

Answer 2

私の推薦は、このようなものになるだろう：

は、たとえば、あなたは、システムにあるすべての異なる比率を考えてみましょう：

• 2x3の
• 1x1の
• の1x2
• 3×4
を

- 風景

1x1の - スクエア

の1x2 -

3x4のスプレッド - 肖像

を次にため、異なるサイズのための接頭辞として名前を使用

• 2x3の：のように、名前をACH各画像：

  landscape_300は、3x4の比率の画像（300px幅）になります。

  Square_96は96px X 96px画像を結果となり、等々...