アイコン+カード型のレイアウト
さまざまな企業のサイトで見られたのは、アイコン＋カード型レイアウトのセットでした。
特に複数の事業案内や商品一覧で、２〜３カラムで配置されていました。
また、こんな工夫も見られました。
- 色分けをすることで、より視認性アップ
- なるべくTOPページの上段に配置することで、ユーザーのストレス軽減につなげる
大人の七難 ピースでいこう プリオール（PRIOR）｜資生堂
プリオールは、自分らしく今を楽しみ、輝き続ける女性のために、大人ならではの悩みを研究し生まれた化粧品ブランドです。スキンケアからメイクアップ、ヘアケアまで、ラクに美しく、見た目も気持ちも幸せあふれるピースな毎日を応援します。
www.shiseido.co.jp
行き先に応じてボタンの矢印を変える
こちらは、TOYOTAのレスポンシブデザインです。
TOYOTAでは、「→」の場合は別ページへ飛ぶリンク、「」の場合はその詳細をアコーディオン式に表示するという区別化を図っています。
矢印の種類や向きを変えただけですが、これだけで視認性が断然あがりますね。
スライダーの導入
スライダーといえば、ファーストビューに配置されているイメージが多いですが
多くのサイトでその他のコンテンツに導入されていました。
スライダーの良さは、一つひとつ縦に並べるとボリュームがあるコンテンツも、
すっきりと納めることができますよね。
また、コンテンツの重要度にもメリハリをつけることができるます。
まとめ
今回は大手企業のレスポンシブデザインを調査してみました！
どのサイトも、「分かりやすさ」「見やすさ」に注力していて、改めてレスポンシブデザインのあり方を考えさせられました…
また、いかに視認性をあげるか、ユーザービリティを向上させるかもさまざまな工夫が施されており、大変勉強になりました！
コメント