No.047 小枝(森永製菓株式会社) – webサイト分析

小枝(森永製菓株式会社)公式サイト(https://www.morinaga.co.jp/koeda/)分析

小枝(森永製菓株式会社)のサイトは、イラストが使われていて動きが取り入れられているサイトです。ピックアップ・小枝の”サステナブル”な取り組み・商品ラインナップ・小枝のおいしさのヒミツ・小枝の歴史・公式SNSへのリンクがあります。
今回は勉強のために、デザインを分析しました。

 

PCメインビュー

font

“Noto Sans JP”, sans-serif
文字:黄緑(#a9c35a)・茶系(#5f401c)・白・緑(#008700)
読みやすい文字です。

color

黄緑・ピンク・黄色系
背景:白・ベージュ系(#fae9bf)・黄緑(#b7ca79)・緑(#008700)

メニュー

右上にハンバーガーメニューがあります。ハンバーガーメニュー内は中央配置で高さは100vhで画面全体に開きます。

 

PCハンバーガーメニュー内

 

PCモーダルウィンドウ

 

まとめ

短くまとめられたとても見やすいサイトです。ラインナップをクリックすると商品紹介のモーダルウィンドウが開きます。

初回は簡単に書かせて頂きました。分析内容はこちらのページか新規のページに不定期に追記をするかもしれません。

 

PCトップページスクリーンショット

 

スマートフォントップページスクリーンショット

webサイト100選 | 雨とホットケーキ