【1日1サイトレビュー】 #12 株式会社ミルボン
今回は美容系ということで、私もヘアオイルを使わせてもらっているミルボンさんの公式サイトです！
では早速、色んなスキルを学ばせてもらいましょ〜う🌟
01. サイト概要
ヘアケア商品メーカーの公式HP
構成
＜TOP＞
MV→ブランドについて→研究開発・生産について→企業情報/サステナビリティ/株主投資家情報/採用情報→商品紹介
＜下層ページ＞
・情報量の多いサステナビリティ、研究開発、株主投資家情報ページは、ヘッダーからプルダウン表示で素早く情報探せるようになっている。
・サイト内検索も可能。
目的とゴール（予想）
・ブランドイメージの確立（会社の研究内容などを知ってもらってブランドイメージを植え付ける）
・取引先や株主、求人者への広報目的
02. 客観的な目線で見てみる
「もし私が美容室のオーナーで、新たにヘアケアを導入することを検討していたら」と言う目線で見てみます！
・常に右上にお問合せがあるのですぐにコンタクトできる◎
・かなり沢山のブランドがあって一つづつみていくのは、、、と思ったが、
各ブランドを「Premium」「Professional」「Technical」の３分類に分けていてそれぞれのターゲットや目的にあったブランドを探せる上、そこから各商品カテゴリー別で見ることもできてみやすく探しやすい◎
・品質や安全性が気になっていたが、研究開発のページにかなり詳細に書かれていて安心。（世界のどんな環境でも高い品質を保てるように様々な環境下で検証しているのすごい！👏）
03. デザイナー目線で考えてみる
配色について
・背景は真っ白の＃FFFFFFで、アクセントカラーとしてロゴと同じ濃い紫を使用。
・文字は黒だが、濃紺に近い色で、紫との組み合わせでも違和感のない色となっている。
・フッターと一部文字にグレーの#9DA2A6を使用。
全体的にとてもシンプルな配色で、読みやすさやみやすさを最重視している印象。
デザインについて
【真似したい箇所】
◎ヘッダーの右上部分
ホバーすると大きく表示が出て、アイコンだけだと見えにくいのでこの表示があることで何のボタンなのか、わかりやすくてユーザーに親切。
◎株主・投資家情報
株主のページはあまりみたことないし、気にしたことはないが、MVに株価のリアルタイムの動きが載っていて、ユーザーにとっては助かるのではないかと感じた。（下記画像参照）
◎トップページ＞ニュース
ホバーした時にふわっと右に動く動きがどれを指しているのかわかりやすい。
◎ブランド紹介ページ
客観的な見方のところでも少し触れたが、多数あるブランドを3つの方向性で分類し、そこから商品カテゴリーごとにも見て絞っていける仕様がとても分かりやすくて良い。そのブランドがどのような目的で作られたのか見れていいなと思った。（下記画像参照）ちなみに私が使っているエルジューダは、Professionalで、「新しいトレンド、デザインの変化、世代観の違いを捉えたブランド」だそうです！確かに、この商品トレンド入りしている。。。👏
【気づいたこと】
・海外にも拠点がある会社なので、仕様している画像は海外のモデルさんも起用している。
・MVが動画になっているが、よくある全面動画ではなく、左右に余白があり映画の一部のような印象。
・トップページの商品一覧の上の部分、4つの項目が並んでいる部分が、少しづつ高さをずらしていて、なぜだろうと疑問に思った。横一列で揃えるとサステナビリティの文字が長くて見づらかったのか。。。？
04. 最後に
トップページ画像
感想
とにかくシンプルだけど、ユーザーのことを考えられているサイトでした👏
それにしてもミルボンさんはこんなにも沢山ブランドがあったのか。。。知らなかった🫢またエルジューダ以外も使ってみたいと思います！
ということで、これにて第12回サイトレビュー終了です！
ではまた〜👋