【Webデザインお題 デザイン＆コーディング】Hair Salon Kobayas

こばやすさん(@kobayas_s)のWebデザインお題に挑戦しました。
お題内容はこちら↓。

PC版・SP版全体画像

PC版

SP版

意識したこと

雰囲気

全体的に、
シンプル
自然派（植物系）
清潔感
を意識した配色や写真の選定を行いました。

ぱっと見で情報のグルーピングができるように配置や装飾等を意識しました。
また、ボタンはアクセントカラーを使用し目立つようにしています。

使用色

今回使用したのは、指定のあった

#f6f6f1　ベージュ
#b8dae6　水色

に加え、
見出しの文字色に #66541d　茶色
本文の文字色に #333333　暗いグレー
を使用しました。

写真

明るめに調整しました。
また、メインターゲットは女性ですがその家族にもきてほしいということなので、FVのスライダーとカットモデルの写真には男性の写真も入れています。

フォント

タイトルの文字に手書き風の文字を使用したのですが、崩れ過ぎていないものを使うことで読みやすさと清潔感を保ちました。

コーディング

ここでは画像しか載せていませんがコーディングまで行いました。
コーディングのしやすい構成にすることも意識しながらデザインしています。