ブログやホームページを作成するにあたって、
色のデザインは非常に大切です。
色遣いによって読みやすく見栄えするサイトがあれば、色遣いがデタラメで不快なサイトもある。
また、同じ色でも使っているディスプレイによっては濃く表示されたり薄く表示されたりするので、
色が自分の見ているとおりに表示されない環境でも読めるような配慮が必要である。
さらに色の種類でも、ＨＴＭＬで定義されている基本色の［
標準１６色］。異なるＰＣ環境でも
色の影響に支障がない［
Web Safeカラー 216色］。それ以外の［
カラーネーム 147色］がある。
ここで大事なのは
147色で指定すると、ブラウザによっては
全く別の色に変わってしまう可能性が
あること。自分のパソコンではＯＫだと思っても、他人のパソコンからはどう表示されているのか
わからない。背景色と文字色に147色を使った場合、最悪、何も見えなくなってしまうことだってある。
よほどの理由がないかぎり、カラーネーム１４７色を使うのは避けるべきだろう。
Web Safeカラー 216色の使用が望ましい。(余談だが、fc2ブログもWeb Safeカラーを指定している)
ただしWeb Safeカラーでも背景色に赤や黄色などを選ぶと、訪問者の目に負担がかかるので慎もう。
↓カラーチャート参考サイト↓タグインデックス−カラーチャートkowaza of the HTML−カラーコードカラーコード＆配色シミュレーションカラーコード作成ツール色彩に関する入門サイトＭａｒｉのいろえんぴつ人気色ランキングカラーチャートとは−Wikipedia
Web Safeカラー 216色 (どんなブラウザでも表示される安全な色)
| ■#000000 | ■#000033 | ■#000066 | ■#000099 | ■#0000cc | ■#0000ff | | ■#003300 | ■#003333 | ■#003366 | ■#003399 | ■#0033cc | ■#0033ff | | ■#006600 | ■#006633 | ■#006666 | ■#006699 | ■#0066cc | ■#0066ff | | ■#009900 | ■#009933 | ■#009966 | ■#009999 | ■#0099cc | ■#0099ff | | ■#00cc00 | ■#00cc33 | ■#00cc66 | ■#00cc99 | ■#00cccc | ■#00ccff | | ■#00ff00 | ■#00ff33 | ■#00ff66 | ■#00ff99 | ■#00ffcc | ■#00ffff |
| ■#330000 | ■#330033 | ■#330066 | ■#330099 | ■#3300cc | ■#3300ff | | ■#333300 | ■#333333 | ■#333366 | ■#333399 | ■#3333cc | ■#3333ff | | ■#336600 | ■#336633 | ■#336666 | ■#336699 | ■#3366cc | ■#3366ff | | ■#339900 | ■#339933 | ■#339966 | ■#339999 | ■#3399cc | ■#3399ff | | ■#33cc00 | ■#33cc33 | ■#33cc66 | ■#33cc99 | ■#33cccc | ■#33ccff | | ■#33ff00 | ■#33ff33 | ■#33ff66 | ■#33ff99 | ■#33ffcc | ■#33ffff |
| ■#660000 | ■#660033 | ■#660066 | ■#660099 | ■#6600cc | ■#6600ff | | ■#663300 | ■#663333 | ■#663366 | ■#663399 | ■#6633cc | ■#6633ff | | ■#666600 | ■#666633 | ■#666666 | ■#666699 | ■#6666cc | ■#6666ff | | ■#669900 | ■#669933 | ■#669966 | ■#669999 | ■#6699cc | ■#6699ff | | ■#66cc00 | ■#66cc33 | ■#66cc66 | ■#66cc99 | ■#66cccc | ■#66ccff | | ■#66ff00 | ■#66ff33 | ■#66ff66 | ■#66ff99 | ■#66ffcc | ■#66ffff |
| ■#990000 | ■#990033 | ■#990066 | ■#990099 | ■#9900cc | ■#9900ff | | ■#993300 | ■#993333 | ■#993366 | ■#993399 | ■#9933cc | ■#9933ff | | ■#996600 | ■#996633 | ■#996666 | ■#996699 | ■#9966cc | ■#9966ff | | ■#999900 | ■#999933 | ■#999966 | ■#999999 | ■#9999cc | ■#9999ff | | ■#99cc00 | ■#99cc33 | ■#99cc66 | ■#99cc99 | ■#99cccc | ■#99ccff | | ■#99ff00 | ■#99ff33 | ■#99ff66 | ■#99ff99 | ■#99ffcc | ■#99ffff |
| ■#cc0000 | ■#cc0033 | ■#cc0066 | ■#cc0099 | ■#cc00cc | ■#cc00ff | | ■#cc3300 | ■#cc3333 | ■#cc3366 | ■#cc3399 | ■#cc33cc | ■#cc33ff | | ■#cc6600 | ■#cc6633 | ■#cc6666 | ■#cc6699 | ■#cc66cc | ■#cc66ff | | ■#cc9900 | ■#cc9933 | ■#cc9966 | ■#cc9999 | ■#cc99cc | ■#cc99ff | | ■#cccc00 | ■#cccc33 | ■#cccc66 | ■#cccc99 | ■#cccccc | ■#ccccff | | ■#ccff00 | ■#ccff33 | ■#ccff66 | ■#ccff99 | ■#ccffcc | ■#ccffff |
| ■#ff0000 | ■#ff0033 | ■#ff0066 | ■#ff0099 | ■#ff00cc | ■#ff00ff | | ■#ff3300 | ■#ff3333 | ■#ff3366 | ■#ff3399 | ■#ff33cc | ■#ff33ff | | ■#ff6600 | ■#ff6633 | ■#ff6666 | ■#ff6699 | ■#ff66cc | ■#ff66ff | | ■#ff9900 | ■#ff9933 | ■#ff9966 | ■#ff9999 | ■#ff99cc | ■#ff99ff | | ■#ffcc00 | ■#ffcc33 | ■#ffcc66 | ■#ffcc99 | ■#ffcccc | ■#ffccff | | ■#ffff00 | ■#ffff33 | ■#ffff66 | ■#ffff99 | ■#ffffcc | ■#ffffff |
|
カラーネーム 147色 (ブラウザによっては正しく表示されない不安定な色)
| ■#F0F8FF | ■#FAEBD7 | ■#00FFFF | ■#7FFFD4 | ■#F0FFFF | | ■#F5F5DC | ■#FFE4C4 | ■#000000 | ■#FFEBCD | ■#0000FF | | ■#8A2BE2 | ■#A52A2A | ■#DEB887 | ■#5F9EA0 | ■#7FFF00 | | ■#D2691E | ■#FF7F50 | ■#6495ED | ■#FFF8DC | ■#DC143C | | ■#00ffff | ■#00008B | ■#008B8B | ■#B8860B | ■#A9A9A9 | | ■#006400 | ■#BDB76B | ■#8B008B | ■#556B2F | ■#FF8C00 | | ■#9932CC | ■#8B0000 | ■#E9967A | ■#8FBC8F | ■#483D8B | | ■#2F4F4F | ■#00CED1 | ■#9400D3 | ■#FF1493 | ■#00BFFF | | ■#696969 | ■#1E90FF | ■#B22222 | ■#FFFAF0 | ■#228B22 | | ■#FF00FF | ■#DCDCDC | ■#F8F8FF | ■#FFD700 | ■#DAA520 | | ■#808080 | ■#008000 | ■#ADFF2F | ■#F0FFF0 | ■#FF69B4 | | ■#CD5C5C | ■#4B0082 | ■#FFFFF0 | ■#F0E68C | ■#E6E6FA | | ■#FFF0F5 | ■#7CFC00 | ■#FFFACD | ■#ADD8E6 | ■#F08080 | | ■#E0FFFF | ■#FAFAD2 | ■#90EE90 | ■#D3D3D3 | ■#FFB6C1 | | ■#FFA07A | ■#20B2AA | ■#87CEFA | ■#778899 | ■#B0C4DE | | ■#FFFFE0 | ■#00FF00 | ■#32CD32 | ■#FAF0E6 | ■#FF00FF | | ■#800000 | ■#66CDAA | ■#0000CD | ■#BA55D3 | ■#9370DB | | ■#3CB371 | ■#7B68EE | ■#00FA9A | ■#48D1CC | ■#C71585 | | ■#191970 | ■#F5FFFA | ■#FFE4E1 | ■#FFE4B5 | ■#FFDEAD | | ■#000080 | ■#FDF5E6 | ■#808000 | ■#6B8E23 | ■#FFA500 | | ■#FF4500 | ■#DA70D6 | ■#EEE8AA | ■#98FB98 | ■#AFEEEE | | ■#DB7093 | ■#FFEFD5 | ■#FFDAB9 | ■#CD853f | ■#FFC0CB | | ■#DDA0DD | ■#B0E0E6 | ■#800080 | ■#FF0000 | ■#BC8F8F | | ■#4169E1 | ■#8B4513 | ■#FA8072 | ■#F4A460 | ■#2E8B57 | | ■#FFF5EE | ■#A0522D | ■#C0C0C0 | ■#87CEEB | ■#6A5ACD | | ■#708090 | ■#FFFAFA | ■#00FF7F | ■#4682B4 | ■#D2B48C | | ■#008080 | ■#D8BFD8 | ■#FF6347 | ■#40E0D0 | ■#EE82EE | | ■#F5DEB3 | ■#FFFFFF | ■#F5F5F5 | ■#FFFF00 | ■#9ACD32 |
|
