そこで、メディアクエリとマジックナンバーをできるだけ少なくすることを目的として、完全にレスポンシブなWebサイトを作成しています。何度か試してみましたが、コンテンツを使用してレイアウトを作成するのが、最善の方法です。
私のクライアントは、画像スライドショー/カルーセルをホームページ、そして場合によってはすべてのメインページに目立つように表示するように要求しました。私は機能するレイアウトを作成しました、そして彼らはそれに満足しています。こちらからご覧いただけます。
今、私は新しい課題を抱えていますが、中程度の反応で見栄えのする目を引くスライドショーを作成するにはどうすればよいですか？拡大させて
私には制約がほとんどありません。これは、この場合の救済よりも負担です。
- 画像の高さは400pxである必要があります。
- 幅は300px-2000pxの任意の値にすることができます。
- 細部に応じて、いくつかのレイヤーを作成できます。レイヤーは、ウェブページ自体で移動して画面サイズに対応できます。
- 画像とデザインは長い間同じままである可能性が高く、テキストはかなり頻繁に変更されます。
だから私が現在考えて試みているのは：
被写体への直接リンクのある背景画像と、画面サイズに応じてフロートできる1つまたは2つの興味深く関連性のあるクリップアートタイプの画像を使用します。
次に、マージン/パディングとメディアクエリの助けを借りて、テキストを配置します。
この編集の時点で、私は広くて明白な写真を使用して、簡単で安全で退屈なオプションを採用しました。
表示されているメディアに対応するグラフィックの作成を任された場合のアプローチについてアドバイスを探しています。
これに関連する元の質問（そうではない）：
単色、単純なグラデーション、または非常に滑らかな背景の方が、繰り返しパターンや細部のあるものよりも優れているでしょうか？
サブジェクトとデザインに関連し、それに関連する繰り返しパターンをどのように作成できますか？
フロート可能な前景画像を使用する場合、クリップアートではなく、リアルに見える必要があると思いますか？
検討すべきより良いトピック：
- 設計の観点から（技術的な側面は知っています）、テキストを拡大/縮小する方法を決定するためにどのような条件を使用できますか？すなわち。コンテナの幅に応じて、テキストを特定のサイズ以下にする必要がありますか？
- 幅が大きく変化する背景にはどのような画像が最適ですか？ 私の推測では、画像の残りの部分全体に重要ではない詳細が含まれている、単一の重要なアンカーポイントがある画像です。
- 前景の画像とテキストの固定されていない/浮動している性質に関して考慮すべき最も重要なことは何ですか？（ホワイトスペース、ラッピングなど何ですか？）
これに関連するブログの投稿、記事、レポートは大歓迎です。