アクセシビリティ重視のウェブ制作

チャコウェブ

株式会社CyberCats

受付時間:9:00~17:00(月曜日~金曜日)

中小企業のホームページ制作で事業の価値を引き出します。良いホームページの作り方や運営の方法、集客に役立つヒントをお届けします。

【ホームページ制作事例】 埼玉県さいたま市マッサージ治療室ホームページ

ホームページ制作事例のご紹介

今回は埼玉県さいたま市のマッサージ治療室ホームページをご紹介します。

・テンプレート利用デザイン
・スマートフォン / タブレット対応レスポンシブデザイン
・らくらく更新ボタン搭載
・常時SSL対応

サイトはこちらからご覧ください。

今回のホームページ制作では、「(心身)穏やかな雰囲気を出したい」というリクエストのもと、あえてカラーを多用し、やんわりと優しい配色を用いています。

今回の記事では、そんな「ホームページの配色」に関するお話をしていきます。

配色1つでテーマを分かりやすく伝えることができます。

ホームページ制作において、配色というのはとても重要です。
一般的に、1つのホームページにおいて、2~3色までのカラーを決めたほうがいいと言われています。

それぞれ「テーマカラー」「アクセントカラー」と呼ばれています。

*テーマカラーとは、大部分を占めるメインとなる色です。
*アクセントカラーとは、利用箇所は少ないものの、ピンポイントで上手く利用し、ユーザーの視線導線を集める役割のある色です。

テーマカラーの決め方はどうすればいいのか?

ホームページイメージを左右する「テーマカラー」は一番初めに決めた方がいいです。
また、会社のロゴマークなどがある方は、ロゴマークと同じ色を使用するケースが多いです。

「テーマカラー」を決める基準として、ユーザーターゲットに合わせた色を探す必要があるでしょう。色の持つ印象とユーザーターゲットが合致するか今一度考えてみてください。

一例)病院ホームページ:優しいピンク色など

また、テーマカラーで理由もなく激しい色を使うのは避けたほうがいいでしょう。
ホームページでは、そこに記載されている内容(文字など)をストレスなくユーザーに読んでもらう必要があります。そのためできるだけ明度を低くした色を選ぶ傾向があります。

 

ホームページカラーを解析してくれる便利なサイト「Web Color Data」

ホームページテーマカラーの参考として、
有名サイトや自分のお気に入りサイトのテーマカラーを解析してくれるツールがあります。

http://webcolourdata.com/

使い方は簡単です。http://webcolourdata.com/ をクリックして、そのホームページのURLを入れるだけです。
「気になるあの競合サイトはどんな配色だろう」などなど、自社サイトの配色決めの参考になると思います。

「ホームページに載せる内容の決め方」について以前3回に分けて記事を公開しました。
こちらも参考に、より良いホームページになるよう考えていきましょう。


          この記事を書いた人        
タク制作部長
株式会社Cyber Cats 制作部長。2011年よりWebサイト制作業界に入り、日々デザインとにらめっこしています。 美しい文字組みに関心があり、どうしたら相手に伝わるデザインができるか切磋琢磨する日々です。 奇抜な料理とロック好き。
詳しいプロフィールはこちらから
SNSでフォローする