レスポンシブなウェブサイトはあなたのビジネスに不可欠です。レスポンシブであれば、主要なすべてのデバイスでブランドとウェブサイトとの一貫性を維持する簡単な方法を提供します。また、応答性の高いWebサイトのバナーを適切に選択する必要があります。あなたの電話機でウェブサイトをロードしようとしただけで、画面上の混乱を見つけることはできませんでしたか？それは、サイトが応答性がない場合や、モバイルフレンドリーな場合に起こります。

画像は、応答性の高いウェブサイトの中で最も不満な側面の1つです。具体的には、バナー/フルサイズの画像です。これらは最も壊れそうなものです。または、画面に正しく表示されません。なぜこうなった？これを理解するために、あなたのウェブサイトが敏感であることが何を意味するのかを説明します。 （詳細は、 これは偉大なアドバイザーのサイトのようなものです ）

<！ - 1 - >

反応する鍵

反応のよいウェブサイトは、ウェブサイトのサイズを横方向に縮小します。つまり、ウェブサイトが水平に変更されると、ウェブサイトのすべての位置が変更されます。これは流体レイアウトと呼ばれるものです。レスポンシブウェブサイトはデバイスに応じてレイアウトのサイズやレイアウトを変更するため、ページが応答しない場合はウェブサイトの画像の詳細をすべて表示することは難しいでしょう。バナーは非常に大きく、ほとんど常に細部に満ちているため、バナーは特に難しいものです。

<！ - 2 - >

以下は、Advisor Webサイトで応答性のある画像のバナーを選択する際のベストプラクティスです。

反応するウェブサイトのバナーを選択する方法

写真のサイズが小さすぎないようにします。 レスポンシブウェブサイトのバナー画像は、最高品質の画像を得るために最低2000ピクセルから600ピクセルの範囲であることをおすすめします。このサイズよりも小さいもの（幅または高さのいずれか）は、ぼやけた画像になります。画像が大きくなればなるほど、バナーの右の部分を再生して切り取る余地が増えます。

<！ - 3 - >

フォーカスのない画像を選んでみてください。 主な焦点がない、風景などのバナー画像を選択することは、あなたのウェブサイトのバナーにもっとも適した画像の1つです。デバイスに関係なく、画像の詳細を見ることができます。フォーカスがないので、ウェブサイトのデバイスサイズをどのように変更するか心配することなくイメージを配置できます。ここにいくつかの例があります：

ご覧のとおり、画像は水平方向に縮小しますが、風景が非常に大きいため、クライアントは背景が何であるかをまだ確認できます。

フォーカスのある画像を選択する。 あなたのウェブサイト上の人物や物の写真に焦点を当てたいとしましょう。ピントが合っている写真を使用するときは、画像の中心にメインフォーカスを置くことが非常に重要です。応答性のあるバナー画像は水平方向に縮小するのが好きなので、画像の多くの側面（白い部分）を失います。 （関連する読書については、 この1つのことがあなたの顧問会社のウェブサイトを壊滅させる可能性があります。 ）

例では、岩と個体がイメージの中心にあることがわかります。これにより、クリーンでサイズ変更された画像が得られます。

とりわけ、あなたのイメージをテストします。 あなたの画像をテストする最良の方法は、あなたのウェブサイトでそれらを試してみることです。画像をテストすることで、どのタイプの写真がうまく動作しないかを理解するのに役立ちます。自分で試したり、素晴らしいサポートチームと一緒に仕事をすることができます。 （関連記事は あなたのウェブサイトのコンテンツがクライアントを引き付ける方法 を参照）

- この記事はShaheen Mahaniによって書かれ、Advisor Webサイトには初めて登場しました。