アイコン+カード型のレイアウト

さまざまな企業のサイトで見られたのは、アイコン+カード型レイアウトのセットでした。
特に複数の事業案内や商品一覧で、2〜3カラムで配置されていました。
また、こんな工夫も見られました。
- 色分けをすることで、より視認性アップ
- なるべくTOPページの上段に配置することで、ユーザーのストレス軽減につなげる
大人の七難すんなり解決 プリオール(PRIOR)|資生堂
プリオールは、大人ならではの悩みを研究し生まれた、楽に、美しくなれる化粧品ブランドです。スキンケア・ベースメイク・ポイントメイク・ヘアケアのラインナップで、大人女性の美しさをきらめかせます。
行き先に応じてボタンの矢印を変える
こちらは、TOYOTAのレスポンシブデザインです。

TOYOTAでは、「→」の場合は別ページへ飛ぶリンク、「」の場合はその詳細をアコーディオン式に表示するという区別化を図っています。
矢印の種類や向きを変えただけですが、これだけで視認性が断然あがりますね。
スライダーの導入
スライダーといえば、ファーストビューに配置されているイメージが多いですが
多くのサイトでその他のコンテンツに導入されていました。

スライダーの良さは、一つひとつ縦に並べるとボリュームがあるコンテンツも、
すっきりと納めることができますよね。
また、コンテンツの重要度にもメリハリをつけることができるます。
まとめ
今回は大手企業のレスポンシブデザインを調査してみました!
どのサイトも、「分かりやすさ」「見やすさ」に注力していて、改めてレスポンシブデザインのあり方を考えさせられました…
また、いかに視認性をあげるか、ユーザービリティを向上させるかもさまざまな工夫が施されており、大変勉強になりました!
コメント