CMS솔루션마켓, 이온디 - 워드프레스, 라이믹스, 카페24, 그누보드, 엑셀

홈페이지 제작팁

웹 안전색 216컬러!

이온디
2010년 02월 17일

웹안전색 216컬러!

간단하다! 브라우저, 운영체제, 모니터에 따라서 웹에서 보이는 홈페이지의 색상이 다르게 보일수 있다.
웹안전색은 사용자의 환경이 달라도 색상의 변화가 없이 공통으로 보여지는 색을 말한다.
빨강(RED), 초록(GREEN), 파랑(BLUE) 세 가지 색상을 디지털 신호가 각각 0, 51, 102, 153, 204, 255 일때 재현되는 색의 조합으로 6X6X6에 의해 모두 216가지가 되어 210가지의 유채색과 6가지의 무채색으로 이루어진다.

다양한 디자인을 요구하는 곳에서는 216의 제한된 색상을 사용해서 표현한다는건 거의 모험에 가깝지만.. 단순한 로고 또는 단순한 이미지에 사용할때 기본형태를 만들때에는 웹컬러를 사용하는것이 좋을것 같다.
단점이라면, 무채색이 하얀색과 검정색을 빼면 4가지 뿐이라는거… 색상이 너무 한정되어 있다는거…
-_- (단연한거잔아!)

내가 왜?!
웹컬러를 사용하려는 이유라면…
솔직히 직업도 아니고 한데…취미로 홈페이지 운영하는데…
CRT 쓰다가 LCD로 넘어왔다.! 뭐 색상이 오히려 더 좋았다.! 색도 똑같아 보였다.!
그리고 와이드LCD를 샀다.! 헐…색상이 다르게 보이는게 아니던가~
그래서 웹컬러를 쓰기로 마음을 먹었다! 이런 단순한 이유! 랄까?

Plus +
웹컬러를 어떻게 사용할까 생각하다가 8bit PNG가 떠 올랐다.

여기서 잠깐!
# 8bit : Pallete PNG
이미지 내의 색상을 index화 하여 256 칼라를 사용할 수 있다는 GIF 와 비슷한 특성을 가지지만, 동일 이미지의 GIF 파일보다 크기가 작습니다. 그 외의 속성은 png와 같습니다.
(Alpha Transparency, No Animated) 
# 24bit : Truecolor PNG
JPG와 같은 1670만 칼라를 지원하며, JPG와 달리 이미지의 손실(열화)이 없습니다. 그래서 이미지의 크기는 JPG보다 크지만, JPG의 최상퀄리티의 파일 크기에 비하면 오히려 작다고 할 수 있습니다. 그외에 역시 Alpha Transparency를 지원하며 애니메이션은 지원되지 않습니다.

8비트 PNG는 용량도 작고 ie.6 에서도 표현이 잘된다
(ie.6에서 8bit PNG는 GIF와 비슷한 Transparency 를 지원한다.)
그냥 ie.6 가 사라지면…. -_-; (뭐.. 난 취미로 하는것이니 다른 사람 생각할 필요가 없다는거!)

  #FF0000 red   #DC143C crimson
  #B22222 firebrick   #800000 maroon
  #8B0000 darkred   #A52A2A brown
  #A0522D sienna   #8B4513 saddlebrown
  #CD5C5C indianred   #BC8F8F rosybrown
  #F08080 lightcoral   #FA8072 salmon
  #E9967A darksalmon   #FF7F50 coral
  #FF6347 tomato   #F4A460 sandybrown
  #FFA07A lightsalmon   #CD853F peru
  #D2691E chocolate   #FF4500 orangered
  #FFA500 orange   #FF8C00 darkorange
  #D2B48C tan   #FFDAB9 peachpuff
  #FFE4C4 bisque   #FFE4B5 moccasin
  #FFDEAD navajowhite   #F5DEB3 wheat
  #DEB887 burlywood   #B8860B darkgoldenrod
  #DAA520 goldenrod   #FFD700 gold
  #FFFF00 yellow   #FAFAD2 lightgoldenrodyellow
  #EEE8AA palegoldenrod   #F0E68C khaki
  #BDB76B darkkhaki   #7CFC00 lawngreen
  #ADFF2F greenyellow   #7FFF00 chartreuse
  #00FF00 lime   #32CD32 limegreen
  #9ACD32 yellowgreen   #808000 olive
  #6B8E23 olivedrab   #556B2F darkolivegreen
  #228B22 forestgreen   #006400 darkgreen
  #008000 green   #2E8B57 seagreen
  #3CB371 mediumseagreen   #8FBC8F darkseagreen
  #90EE90 lightgreen   #98FB98 palegreen
  #00FF7F springgreen   #00FA9A mediumspringgreen
  #008080 teal   #008B8B darkcyan
  #20B2AA lightseagreen   #66CDAA mediumaquamarine
  #5F9EA0 cadetblue   #4682B4 steelblue
  #7FFFD4 aquamarine   #B0E0E6 powderblue
  #AFEEEE paleturquoise   #ADD8E6 lightblue
  #B0C4DE lightsteelblue   #87CEEB skyblue
  #87CEFA lightskyblue   #48D1CC mediumturquoise
  #40E0D0 turquoise   #00CED1 darkturquoise
  #00FFFF aqua   #00FFFF cyan
  #00BFFF deepskyblue   #1E90FF dodgerblue
  #6495ED cornflowerblue   #4169E1 royalblue
  #0000FF blue   #0000CD mediumblue
  #000080 navy   #00008B darkblue
  #191970 midnightblue   #483D8B darkslateblue
  #6A5ACD slateblue   #7B68EE mediumslateblue
  #9370DB mediumpurple   #9932CC darkorchid
  #9400D3 darkviolet   #8A2BE2 blueviolet
  #BA55D3 mediumorchid   #DDA0DD plum
  #E6E6FA lavender   #D8BFD8 thistle
  #DA70D6 orchid   #EE82EE violet
  #4B0082 indigo   #8B008B darkmagenta
  #800080 purple   #C71585 mediumvioletred
  #FF1493 deeppink   #FF00FF fuchsia
  #FF00FF magenta   #FF69B4 hotpink
  #DB7093 palevioletred   #FFB6C1 lightpink
  #FFC0CB pink   #FFE4E1 mistyrose
  #FFEBCD blanchedalmond   #FFFFE0 lightyellow
  #FFF8DC cornsilk   #FAEBD7 antiquewhite
  #FFEFD5 papayawhip   #FFFACD lemonchiffon
  #F5F5DC beige   #FAF0E6 linen
  #FDF5E6 oldlace   #E0FFFF lightcyan
  #F0F8FF aliceblue   #F5F5F5 whitemoke
  #FFF0F5 lavenderblush   #FFFAF0 floralwhite
  #F5FFFA mintcream   #F8F8FF ghostwhite
  #F0FFF0 honeydew   #FFF5EE seashell
  #FFFFF0 ivory   #F0FFFF azure
  #FFFAFA snow   #FFFFFF white
  #DCDCDC gainsboro   #D3D3D3 lightgrey
  #C0C0C0 silver   #A9A9A9 darkgray
  #778899 lightslategray   #708090 slategray
  #808080 gray   #696969 dimgray
  #2F4F4F darkslategray   #000000 black
출처 : http://redrainbow.net/?mid=textyle&category=162&vid=ritbi&document_srl=192
 
댓글은 로그인 사용자만 작성 가능합니다. 로그인하기