ウェブ制作
「海」をテーマにしたウェブサイトのデザイン・カラーをまとめてみました。
今回は、「海」をテーマにしたウェブサイトをご紹介します。
ご紹介させて頂くと「海」を意識したウェブサイトを作成する際の、共通点などを見つけることができます。
カラーの選択、画像の見せ方など参考にしてみてください。
東京ダイビングスクール NEO(ネオ)
- https://www.tds-neo.com/
- メインカラー：#0260dd
- アクセントカラー：#f8f708，#ff006a
東京都のダイビングスクールのホームページです。
海のカラーである青や水色は落ち着いた感じの印象を与えますが、元気、無邪気といった印象を持つイエローをアクセントカラーに用いることで「ダイビング」というアクティビティ感を演出していて、ワクワクするようなデザインに仕上げられています。
Seaballoon
- https://seaballoon.com/
- メインカラー：-
- アクセントカラー：-
東京都のシーバルーンの企画・製造や、海中旅行の企画等を行っている会社のホームページです。
スクロールすると深海へと潜水していき、ページの最下部には当社のシーバルーンに辿り着きます。他にはないオリジナル性の高いデザインで、シーバルーンや海中旅行に対する強いこだわりを感じることができます。
うみのホテル
- https://www.umino-hotel.com/
- メインカラー：#ffffff
- アクセントカラー：#7bcccf
神奈川県の海を見渡せる宿泊施設のホームページです。
海辺の写真だけでなく、宿泊施設ならではのおしゃれなインテリア、空間デザインなどの写真を使い、サイトデザインも相まってホームページを見るだけでも宿泊施設の雰囲気を味わえる構成になっています。
GLOSSO
- https://glosso.jp/
- メインカラー：#ffffff
- アクセントカラー：#064996，#0bac74
大阪府のアクアリウムの企画・設計・デザイン会社のホームページです。
「活魚水槽・生簀」は青、「アクアリウム」には緑とサービスで色を使い分けられています。活魚水槽・生簀は清潔感が求められる一方、アクアリウムは生物の育成環境として、より自然感が求められるため、色によって良いすみ分けがされています。
海ごみ探検隊
- http://kagawaumigomi.jp/umigomilla/
- メインカラー：#00aeba
- アクセントカラー：#EBF3CF
香川県・香川県海ごみ対策推進協議会のホームページです。瀬戸内海の海を守るために、海ごみ問題についての情報が発信されています。メインカラーには青緑色が使われており、一番の目的が自然保護活動が目的であることが伝わってきます。
オーシャンステージ
- https://ocean-stage.jp/
- メインカラー：#ffffff
- アクセントカラー：#00aca0
大阪府のダイビングスクールのホームページです。海・ダイビングに関する動画や写真で見せるデザインを採用しています。アクセントカラーに緑系の色を持ってくることで、自然を感じるダイビングといったメッセージを感じ取れます。
まとめ
いかがでしたでしょうか。
「海」をテーマにしたサイトの多くが、「白」「青」「緑」系のカラーをうまく使いながら海の雰囲気や自然感、レジャー感なを演出しています。
良い参考サイトが見つかったら随時追加していきます。
