ホーム » 著書の紹介 » Webプロフェッショナルのための黄金則 Web配色デザインのセオリー
Webプロフェッショナルのための黄金則 Web配色デザインのセオリー
フォルトゥナのカラーコンサルタント坂本邦夫の2冊目の著書「Webプロフェッショナルのための黄金則 Web配色デザインのセオリー」のご紹介です。
内容
ウェブサイトの「色づかい」は、「その色がきれいだから」などと恣意的に決まるものではありません。場合に応じて、目的によって、適切に色を使っていく「セオリー」があります。
本書は、Webプロフェッショナル、またはWebクリエイターを目指す方であれば必ず知っておきたい、ウェブサイトにおける配色のセオリーをまとめたものです。
1項目を基本的に見開きで構成し、図解を多用した誌面になっており、また適宜「チェックリスト」を設けることで、「見てわかりやすく、調べて使いやすい」内容となっています。
Chapter1「ウェブ配色の基礎」では、色彩および配色の基本を簡潔にまとめます。色彩の基本を知り、色の持つ性質を覚えておけば、より効果的な色の使用ができるでしょう。
Chapter2「配色を整えるテクニック」では、テーマカラーの決め方から、前景色、背景色の決定方法、さらに決めた色をどう配置すればよいか、といった「整え」のテクニックをまとめています。
Chapter3「デザインの目的別テクニック」では、「テキスト」「レイアウト」「画像」といった要素ごとに、その要素の目的を達するためのテクニックやノウハウを解説します。また、配色の調整方法なども説明しています。
Chapter4 「ビジネスゴールごとの目的別テクニック」では、ユーザビリティ、アクセシビリティ、CI、ブランディングといったサイトのビジネスゴールや、ニュースサイト、広告サイト、公共系サイトなどのサイトの目的という視点から、その目的を達するためにはどのように配色を考え、決めていけばよいかを解説していきま す。サイトの目的に最適の色づかいをするのに、きっと役立つでしょう。
「色」はウェブサイトにおいて、ビジュアルイメージの方向性や、情報伝達に重要な意味を持ちます。より高いビジネスゴールを実現するために知っておきたい、Webプロフェッショナルのための"黄金則"です。
毎日コミュニケーションズのサイトで本の一部を立ち読みすることが出来ます。購入を検討している方はご参考にどうぞ。
目次
- Chapter 1 ウェブ配色の基礎
- Category_1. 色彩の基礎知識
- Theme 1-1 色の三属性
- Theme 1-2 トーンとそのイメージ
- Theme 1-3 色と面積
- Theme 1-4 アクセントカラーとセパレーションカラー
- Theme 1-5 同化現象と対比現象
- Theme 1-6 色の誘目性
- Theme 1-7 視認性と可読性
- Theme 1-8 色の識別性
- Theme 1-9 モニタと印刷との色域の違い
- Check List
- Category_2. 印象を左右する色彩の心理的効果
- Theme 2-1 色の寒暖
- Theme 2-2 派手な色と地味な色／興奮色と沈静色
- Theme 2-3 重い色と軽い色／固い色と柔らかい色
- Theme 2-4 色の遠近感
- Check List
- Category_3. ウェブサイトの配色
- Theme 3-1 HTML/CSSでの色指定
- Theme 3-2 Webセーフカラー
- Theme 3-3 HSBを利用して色を作る
- Theme 3-4 色のユーザビリティ
- Theme 3-5 色のアクセシビリティ
- Theme 3-6 可読性のチェックとソフトウェア
- Theme 3-7 テキストリンクの色
- Check List
- Chapter 2 配色を整えるテクニック
- Category_1. テーマカラーを決める
- Theme 1-1 基本テーマカラーを1色設定する
- Theme 1-2 テーマカラーの彩度と面積
- Check List
- Category_2. 色相・トーンを手がかりにした配色
- Theme 2-1 色相を限定した配色
- Theme 2-2 多色配色
- Theme 2-3 トーンによる配色
- Theme 2-4 自然の色を使った配色
- Check List
- Category_3. 背景色
- Theme 3-1 背景と文字のコントラストの調整
- Theme 3-2 背景画像の上のテキスト
- Theme 3-3 背景色とリンクの色
- Check List
- Category_4. 色の配置
- Theme 4-1 情報の優先順位を決めて配色する
- Theme 4-2 視線移動の基礎
- Theme 4-3 全体のレイアウトと視線の移動
- Theme 4-4 グラデーションで視線を誘う
- Check List
- Chapter 3 デザインの目的別テクニック
- Category_1. テキストの扱い
- Theme 1-1 テキストを読ませる
- Theme 1-2 メニューを読みやすくする
- Theme 1-3 テキストリンクの下線を外す
- Theme 1-4 テキストの強調
- Check List
- Category_2. レイアウトを構成する色
- Theme 2-1 ロゴやサイト名を見せる
- Theme 2-2 ロゴの下のナビゲーションの色
- Theme 2-3 サイドバーの色
- Theme 2-4 コンテンツを整理して見せる
- Theme 2-5 印刷できる色にする
- Theme 2-6 ボタンをクリックさせる
- Check List
- Category_3. 画像の扱い
- Theme 3-1 画像の色を重視する
- Theme 3-2 多数の画像を並べる
- Theme 3-3 商品を紹介する画像
- Check List
- Category_4. 配色の調整
- Theme 4-1 離れて配色を見る
- Theme 4-2 項目ごとにチェックする
- Check List
- Chapter 4 ビジネスゴールごとの目的別テクニック
- Category_1. ユーザビリティ、アクセシビリティを重視するサイト
- Theme 1-1 政府・自治体や公共交通機関などのサイト
- Category_2. CIを重視するサイト
- Theme 2-1 ロゴの色の彩度を考えた配色
- Theme 2-2 色の繰り返しによるイメージ定着
- Check List
- Category_3. 色彩によるブランディング
- Theme 3-1 競合サイトと似ていないか？
- Theme 3-2 用いる色相を絞り込む
- Theme 3-3 独自のサービスを持つサイト
- Category_4. 印象を重視するサイト
- Theme 4-1 信頼感の表現方法
- Theme 4-2 親しみやすさを表現
- Check List
- Category_5. 高齢者をターゲットとするサイト
- Theme 5-1 加齢に伴う見え方の変化
- Theme 5-2 高齢者の嗜好と視覚特性を考慮した配色
- Category_6. SNSやWiki、ニュースなど情報を扱うサイト
- Theme 6-1 繰り返し訪れられるサイトの色
- Check List
- Category_7. 人物の写真があるサイト
- Category_8. 飲食物を扱うサイト
- Theme 8-1 美味しそうに見せる色
- Check List
- Category_9. 広告で収益を得るサイト
- Theme 9-1 画像広告を挿入する場合
- Theme 9-2 文字広告の挿入
- Category_10. 地域限定サービスのサイト
- Theme 10-1 地域で親しまれている色を探す
- Theme 10-2 地域の競合サイトを調査して配色を考える
- Check List
- Appendix 配色技法
関連記事
何かコメントがあればどうぞ
▲このページの先頭に戻る
