WEBサイトトレース #01

今回はXDに慣れる為にサイトのトレースを開始。
第一回目のサイトは"まるざ発芽玄米研究所"さん（https://maruza.jp/）のサイトトレースに挑戦しました。

まるざ発芽玄米研究所

■なんのサイト?
→自然栽培の発芽玄米専門店サイト
■ターゲット層
→30~40代の健康志向で子持ちの主婦（料理にこだわり有）
■配色
メインカラー　#B39A3A
ベースカラー　#FFFFFF
アクセントカラー　#B39A3A
■書体
Noto Serif 
#231815
■レイアウト
１カラムレイアウト

気付いた事

長い文章
size 14px
letter-spacing 72~80px
line-height 33~36px
最大フォントsize
50px
その他
約30~40px

・カーソルを合わせると基本文字が白文字になり背景が黒のボタンに変化
・ファーストビュー にある一番初めの文字はあえて縦文字にし和のイメージが出ている。
・商品紹介の部分は一部を横スライド式にしてあり、その他ボタンで別ページのオンラインショップに行けるように工夫されている。
商品の画像にカーソルを合わせると商品が少しアップになる。
・その他ボタンにカーソルを合わせた時文字や背景の明度が上がっている。
・footerの部分にSNSやお問い合わせ情報、営業時間・電話番号等の記載有り。
・右側に固定でオンラインショップに行けるようボタンが付いている。