シエリアサロン大阪梅田ライフデザインミュージアム / #38ch_SiteReview
サイト概要
ファーストビュー
・ミュージアム内の写真に黒のフィルターをかけて、白文字を乗せている。
・要素は詰め込まれているが、リード文の英字が細いヘアラインセリフなので、余白が足りない感じはない。
・左上はサロン名、右上はメニューがまとめられており、その右端は予約ボタンが配置されている。
・1スクロールすると、サロン名はフェードアウト、メニューと予約ボタンは縮小する。
構成
・フロントページのみ、内容はTOP、ABOUT、LINE UP、FLOW、MUSEUM、NEWS、ACCESS
・画像が縮小したり、装飾の見出しが右から左に流れたり、FLOWの色が変化したりなど、滑らかなスクロールアクションが豊富。
・予約とSDGsの取り組み以外はクリック無し、スクロールのみで閲覧できる。
フォント
種類
欧文フォント:freight-big-pro
和文フォント:游明朝
見出し用フォント:
数字用のフォント:
サイズ・太さ
レスポンシブ対応のため、VWを使用している箇所あり。
見出し34px、本文16pxくらい。
※画面幅によって異なる。
配色
レスポンシブ対応
@mediaのmax-widthで、480px、768px、1200px、1700pxで切り替え。
フォントサイズなどはvwを使用して対応している。
フロントページのサムネイル
この記事が気に入ったらサポートをしてみませんか?