焼きたてカヌレ専門店 KURAMAE CANNELE 公式オンラインサイト(https://www.kuramae-cannele.jp/)分析
KURAMAE CANNELEのwebサイトは、サイトを開くとふわっとメインビューが表示されます。明朝体がとても優雅な印象のサイトです。スクロールすると下から上に画像が動いて表示されます。
今回は勉強のために、デザインを分析しました。
font
YuMincho, ‘Yu Mincho’, serif
‘Libre Baskerville’, serif
白系・ベージュ系（#cbb297・#462800）・黒・グレー系（#595858）
画面幅1920px：font-size 0.7vw～0.8vw～0.9vw～1.2vw～35px
color
白系・グレー系（#464646）・茶系（#403000・#c8c2ac）・黒色・
メニュー
PCもスマートフォンもは右上に縦にリンクメニューがあります。ページをスクロールしても固定されています。
画面について
スクロールすると
途中のbackgroundがゆっくりグレーの色がついて（rgb(230, 230, 230)）、スクロールすると白くなります。
FOOD・DRINKメニューが文字でページに書かれています。メニューリストのあるページへのボタンがあります。
トップページによくあるヘッダーメニューのページ内にスクロールするリンクはありません。
まとめ
KURAMAE CANNELEのwebサイトは、明朝体で格式高い印象です。イラストが見出し前に使われています。大きさの違う縦長の長方形の画像が並んでいます。縦が短い小さい画像の上部にpxで余白をとって縦に長い画像より下の位置になるようにして、位置を揃えないで表示しています。デザインを参考にしたいサイトです。
初回は簡単に書かせて頂きました。分析内容はこちらのページか新規のページに不定期に追記をするかもしれません。
