見出し画像

#31 爽やかな色合いと、思わず惹かれるキャッチコピーを見習いたい!シャワーヘッドのWebサイト

こんにちは!Webサイト研究です!
GWも明け、直後の週末も明け、ゆるゆるモードを切り替えて仕事するためにも、いけてるWebサイトを見てモチベーションを上げようと思います(^ ^)

今日もギャラリーサイト「SANKOU!」 https://sankoudesign.com/ さんからです。

「Bollina」
https://www.bollina.jp/

画像1


暑くなってきた5月中頃(特に今日は30度!)、爽やかなこちらのWebサイトに惹かれて選びました。
さっそく装飾の研究していきます。


☆リンク要素のルール
・文字リンクはマウスオーバーでopacity
・写真はマウスオーバーで水色がかったopacity
・商品写真はマウスオーバーで商品名が出てくる


☆王道サイズ、形のセオリー
・ヘッダーは130px
・文章は15〜18px
・見出しは50pxくらいありそうだけどimgが使われてる


☆薄い色は何色あるかをつかむ
・よくあるグレーの線はないが、キーカラーが薄い緑であり、見出し・小見出しに使われているため、全体がうるさくならない印象。


☆コンテンツの横幅、グリッドのルール
・最大3カラム。3つの特徴を説明


☆レスポンシブの変化のセオリー
・左が上、右が下の基本ルール
・全て1カラムへ


☆配色のルール
・グラデーションが綺麗!!
・写真も含め、使われている色は白、薄いグレー、薄い緑や水色のグラデ。
 →かなりクリーンな爽やかな印象!
・見出しなど大きい文字にキーカラーの薄い色が使われている


☆読みやすい文字量
・「浴びる全身美顔器」ってキャッチコピー、超イイ・・・
・見出しは英語なのでシャレてます!でも薄い色なのでアピールしすぎず、ちゃんと日本語の文章に目が行くので、ちょうどいい感じ



商品の特徴を図と写真で分かりやすく伝えていると思いました。
商品の売りである気泡が、ころころさせた文字や写真から遊び心から伝わってきますし、綺麗なグラデーションも加わって、
これからの季節に気持ち良さそうな、爽やかフレッシュな世界観が出ているなあと思いました!
つまり、シャワー浴びたくなりました(笑)

今日も最後までお読みいただきありがとうございました(*^^*)

#webデザイナー #webサイト #webサイト研究