)2016年8月1日更新ツイート閲覧数5,468viewsこのコラムをPDF形式でダウンロードするJimdoExpertとしてこれまで100件以上のJimdoサイトに携わってきた筆者が、Jimdoを使用して日本語のWebサイトをデザインするポイントについて解説する本コラム。前回のコラムではメインビジュアルについて解説しました。第5回目となる今回は、テーマカラーの選び方や組み合わせのコツを解説します。色が与える心理的な影響Webサイトに限らず、私たちは色に囲まれた生活をしていますが、それらの色から受ける心理的な影響を意識しながら暮らしている方はどれくらいいるでしょうか。実際、私たちは何かの行動をするとき色から大きな影響を受けています。信号を思い浮かべてみてください。世界中どこへ行っても「赤」が”止まれ”です。これは「赤」という色に注意を促す心理的な効果があり、人は赤いものを見ると無意識的に「注意」「注目」するという特性を利用しているからです。逆に「緑」(青信号)には安心感を与える効果があるため、「緑」が”進め”なのです。信号のように公的なものに限らず、さまざまな商品や広告の「色」には作り手の意図が込められており、皆さまがWebサイトを制作する際にも細心の注意を払う必要があります。それぞれの業種に合った色を選ぶことはもちろん、複数の色を使う場合には違和感のない組み合わせにすることも重要です。そこで今回は、色の知識がなくても簡単にバランスの良い色を選べるテクニックをいくつか紹介します。色についてより理解を深めたい方は、以下のコラムに非常に分かりやすくまとめられていますので、ご一読されることをオススメします。私がJimdoユーザの方からよく受けるご相談の1つに「メインカラーは決まっているけど、それに合った配色を選ぶのが難しい」というものがあります。そんなときは「HUE/360」(http://hue360.herokuapp.com/)というサービスが便利です。画面に表示されている色の中からメインカラーを選ぶと、相性の悪い色が自動で消えて、相性の良い色だけを残してくれます。その中から好きな色を選ぶだけでバランスの良い配色を作れるという、優れもののサービスです。放射状のカラーパレットの中からメインカラーを選びます。すると、メインカラーと合う色だけが残るので、好きな色を選びます。Color」をクリックします。各色のカラーコード(#のついた6桁の英数字)が表示されるので、このコードをコピーします。Jimdoのスタイルメニューで、上図の点線で囲んだ欄に先ほどのカラーコードをペーストすると選んだ色が適用されます。ゼロからカラーリングを決めたいなら「Pinterest」が使えるWeb上にある画像をブックマークするサービス「Pinterest」(https://jp.pinterest.com/)。自分の好きな画像を収集したり、他の人の収集している画像を閲覧したりできる、いわゆるSNSに近いサービスです(厳密にはSNSではありません)。私も実際のデザイン業務で主にインスピレーションを得るために頻繁に使用していますが、ゼロからカラーリングを決める際には、Pinterestの検索機能が非常に強力な助けとなってくれます。上部の検索窓に「tones」と入力します。いろいろな写真と一緒にカラーパレットが表示されます。追加のキーワード、例えば「Earth」と入力してみます。するとアースカラー(自然色)の画像とパレットが表示されるので、この中から好きなものを選ぶだけ。あとはそれぞれのカラーコードをJimdoのスタイルメニューに入力してください。「Earth」でなくても構いませんので、「Sea」「Vegetable」などお好きなキーワードで検索してみてください。イメージに合った配色のパターンに出会えるはずです。(※キーワードによってはカラーパレットが表示されないこともあります)色選びに迷ったら「coolors」がオススメそれでもどうしても色を選ぶのが難しい、という方には、「coolors」(https://coolors.co/)というサービスがオススメです。これはスタイリッシュな色の組み合わせを自動で作成してくれるサービスですが、私のイチ押しの使い方は「画像から色を抽出する」方法です。前回のコラムで、メインビジュアルは業種に合ったものにしましょうと解説しました。そのメインビジュアルの画像から色を抽出するのです。started」からパレット作成ページに入ります。image」を選択します。画像をアップロードする画面になりますので、メインビジュアルの画像をアップします。すると画像から自動で色を抽出したカラーパレットを作成してくれます。各色にはカラーコードが表示されますので、それをJimdoのスタイルメニューに入力すれば完成です。この方法であれば、確実にご自身のWebサイトに合ったカラーを選ぶことができますので、どうしても色を選べない、という方はこの方法が一番簡単かもしれません。魅力的なWebサイトは色使いも魅力的Webサイトの配色は、第一印象だけでなく最終的なコンバージョンにも大きく影響します。良いWebサイトは往々にして配色も優れているものです。上で紹介したような便利なツールを使い、ぜひ魅力的な色使いのWebサイトを作成してください。次回は、Jimdoに新しく追加された画像編集機能をご紹介しながら、画像のトリミング等について解説します。2014年までインドネシア・バリ島で活動し、世界各国のクリエイターと交流。Webサイトの制作だけでなく、各種WebサービスのテンプレートデザインやUI設計、セミナー登壇、コラムへの寄稿など精力的に活動中。"かっこいいを簡単に"をモットーに、海外のWebデザインを日本向けにローカライズした新しいデザインを提案している。人気講師が教える本格Webサイトの書き方』など。(著)「4つのレイアウトパターン」と「レスポンシブデザイン」を実際に手を動かして作りながらサイト制作のきほんが学べます!ライブ感のあるチュートリアル学習により、まるでWebデザイン会社でOJT(オン・ザ・ジョブ・トレーニング)を受けているような体験型の独習書です。ための経理サポートサイト文具、通信、オフィスのことなら何でもお任せ問い合わせ件数をアップさせるなら!「通話料無料・わかりやすい番号」のフリーコール事務所開設するなら固定電話番号で信頼アップ本コンテンツは、掲載時点の内容となります。「みんなのビジネスオンライン」は「はじめてWEB」にお読み替えいただきますようお願いいたします。Reserved.「はじめてWEB」はKDDIが提供しています。