WordPressなどで色のカスタマイズに便利なWEB色見本原色大辞典
カラーはデザイン的にも機能的にもとても大事
こんにちは。WEBディレクターの金川です。
今日はWordPressに限定しない「WEB」そのものについてのちょっとしたスキル＆知識について紹介しようと思います。
そして具体的なテーマは「WEBにおける色＝カラー」についてです。
カラーって実はとっても大事でして、同じレイアウトやバランスであっても、色の選択や配置が違うだけで、クールになったりなんだかカッコ悪いなあーなことになったりします。
まあカッコ悪いだけならまだしもなんですけど、見にくかったり読みにくかったりすると、カッコ悪いだけではすまずに、本来のWEBの機能を損なうこともありえるので、そのへんは注意が必要ですよね。
印刷における色の規格＝CMYK
さて色なんですが、印刷における色とWEB上での色とはまったく別の規格の話なんですね。
具体的にこんな規格になります。
印刷における色の規格＝CMYK
C＝シアン≒青
M＝マゼンダ≒赤
Y＝イエロー＝黄色
K＝ブラック＝黒
というふうに、ざっくりとですが、4つの基本色の掛け合わせで決められます。
一つ例を上げてみますね。
というように、上記の割合のCMYKの色の配合で、こんなピンクが構成されてるんですね。
光の色の規格＝RGB
次にWEBで使う色の規格です。
まあWEBのというより、光で構成される色の規格といったほうが正確なんですけどね。
モニタースクリーンで表示される色のことなので。
光の色の規格＝RGB
R＝レッド
G＝グリーン
B＝ブルー
この三つの光の要素で光の色は構成されてるんです。
RGBの光の強さの割合によって光の色は決まります。
WEBで使う「カラーコード」
ちょっとややこしいんですが、WEBでカラーを指定する際には、実際にはRGBではなく、「カラーコード」というものを指定するんですよ。
WEBで使う色のは全てカラーコードが決まっていまして、そのカラーコードを指定することで枚違いなく絶対的な色の指定ができます。
カラーコードは「#」が前に付く6ケタの数字とアルファベットの組み合わで表現されるんです。
上記の色の例で言えば、
というわけです。
WEB色見本 原色大辞典
まあこんなお勉強みたいなことはこれくらいにしておきます（笑）
ちょっと楽しげなことを紹介させていただきますね。
それはコレ。WEBの色見本です。
さまざまなサイトでWEBカラーの見本を見せてくれるんですが、ボクはこのサイトが一番見やすくて分かりやすいので、ここばっかり見てます。
また和風とか、パステルとか、いろんなテイストを集めいてくれているので、使いやすいだけではなくて、見ててとっても楽しいんですね。
↓具体的な使いは下のように使います。
↓WEB色見本で使いたい色を選ぶ。
↓その色のカラーコードをコピーする（#ffa500とかです）
↓画像編集ソフト上でコピーしたカラーコードを指定する。
というふうに利用しているんです。
画像編集ソフトとは、アドビ・イラストレーターとかフォトショップとかですね。
あるいはWordPressであればテーマ（テンプレート）上で、専門知識不要でいろんなパートを色を変更する＆指定するなどのカスタマイズが可能なので、そんな時にも重宝しますよ。
以上WEBでの色について紹介させていただきました。
色って素敵ですね！
