見出し画像

WEBサイトデザイン分析(塩田家具屋)

今晩です!
今日はWEBサイト分析した物を転載しようと思います。
表現やカラー、配置などを参考に自分で使える知識として
吸収していける事が目的です。

今回は塩田家具屋さんのサイトを分析していきたいと思います。

コンセプトやファーストビュー

コンセプト:
家具と暮らしを選ぶ
ターゲット:
家具が好きな人、暮らしを豊かにしたい人、暮らしにあった家具を知りたい人

ファーストビュー
椅子やソフォーの初心を全体的、正面、真横の視点で分かれている!
時間でソファーから椅子の画像に変わるようになっているところがポイント!!
またファーストビューの文字はHタグとかではなくSVGとして扱われている!!

ナビゲーションメニューはマウスを当てているところにカギカッコで表現し
下に詳細メニューもでるようになっていますね。

サイトカラー分析


メインカラー:#dbdbdb 薄い灰色味があるカラーになっている。
サブカラー:#FFF  文字などの情報があるところは白色を使っている。
アクセントカラー:#006d80 ロゴにも使われている色をアクセントカラーにしている?

灰色を使う事で引き締り感を出している。万能色
ロゴカラーでもある緑は家具のある暮らしということもあり
安らぎや自然色を表現している?

全体的なバランスや配置


伝えたい言葉は大きくだして
余白をとっており、心地よさを感じる表現になっている。
また、よこには見出して心理効果でもある3パターンで説明されている。
文字は明朝体やヒラギノを使っています。

取り扱い商品は特にこだわっているダイニングとリビングを大きめに出していて、それ以外のソファーやカーテン、子供用の部屋の家具などを下に項目べつになっている。
マウスカーソルを置くとズームするようになっています。

こだわりの家具ブランドや木材についての説明などの詳細ページのリンクや
特注できるページも用意されている。

店舗情報はファーストビューぐらいの大きさで表現されていて
伝えたいことを縦書きと文字の横に線で引いてアピールしている。


まとめ


文字の余白が綺麗で写真の見せ方や伝えたいことが分かりやすい家具屋さん
のイメージが持てました。

この記事が気に入ったらサポートをしてみませんか?