私は反応性の高いウェブサイトを構築するプロジェクトに取り組んでいます。私たちが苦しんでいるのは、さまざまな表示モードで画像の内容を処理することです。注目してください:イメージの内容。レスポンシブウェブサイトでの画像コンテンツの表示方法
事は:ほとんどのページのPCビューでは、画像が幅と高さの比が大きいランドスケープで表示されます。モバイルビューにするときは、別のフレームに表示する必要があります。そしてあなたが想像しているように、画像の内容は拡大縮小され、切り取られて、モバイルビューで非常に奇妙な画像にエクスポートされました。人々との広い絵のように、左側にはほとんどありますが、切り取られた後、残っている写真には非感覚のものだけがあります。
私たちは技術的なソリューションを使ってイメージの技術的属性(サイズ変更、スケーリング)のみを処理していますが、実際にはイメージコンテンツを扱うことができません。
私は約4解決策を考えている:
- 1 - 顧客の感情にもかかわらず、私たちは(それをリサイズ、 すべてのコンテンツを保つ)画像を拡大。出力は の肖像画または正方形の1つに風景写真のサイズを変更すると思われるので、時々非常に となるでしょう。しかし、それは主に最も簡単な方法です。
- 2 - モバイルビューでイメージフレームサイズを考慮し、画像の中央領域を選択して イメージを自動トリミングすることを考慮してください。上で述べたように、 結局のところ、意味のない画像が生成されました。
- 3 - 顧客に知らせると、画像をアップロードするたびに、デスクトップビュー用とモバイルビュー用の2つのコピーがアップロードされなければなりません。顧客は多大な労力を費やす必要がありますが、開発は容易です。
- 4 - 高度な機能:ユーザーは画像を1つだけアップロードすることができます。 異なるビューポートと、クロップされた画像に画像 がどのように表示されるかを決定するためのクロッパーを提供します。
私はこれらのものに対処する経験はあまりなく、このケースを扱う世界がどうなっているかはわかりません。私が今見ているように、Wordpressはユーザーにただ1枚の写真をアップロードする必要があり、それは自動的にそれをスケーリングします(私の第1の選択肢)。誰にもこれに関する経験はありますか?あなたは私のソリューションと私の上記のソリューションについてのあなたの考えを共有していただけますか?ありがとうございました。