2008. 10. 15. 01:30

속성값으로 사용될 윈도우 기본 글꼴 

한글 지원 글꼴 굴림체, 바탕체, 궁서체, 돋움체
영문 지원 글꼴 Arial, Arial Black, Courier,
Comic Sans MS, Times New Roman,
Verdana,

POSITION 속성 
                             형식                           기능 
태그{position : static | relative | absolute} 태그{position : static | relative | absolute}
태그{visibility: visible | hidden} 레이어 숨기기
태그{z-index: }
레이어에 순서 지정
태그{clip: rect(상단, 오른쪽, 하단, 왼쪽)}
레이어 자르기

 Scrollbar (스크롤바) 속성
 형식 기능 
 {scrollbar-face-color: }  움직이는 바의 전체 색을 설정
 {scrollbar-track-color: }  바가 없는 아래 부분의 색을 설정
 {scrollbar-arrow-color: }  화살표 버튼색을 설정
 {scrollbar-hightlight-color: }  바의 왼쪽과 위쪽의 색을 설정
 {scrollbar-3dlight-color: }  바의 왼쪽과 위쪽의 바탕으로 들어가는 색을 설정
 {scrollbar-shadow-color: }  바의 오른쪽과 그림자색을 설정
 {scrollbar-darkshadow-color: }  바의 오른쪽과 밑에 들어가는 색을 설정

예제)
 <style type="text/css">

    table {
        border : 1px #83D5F7 dotted ;
             }
    #box {
      width: 180 ; height:340 ;
      overflow: auto; padding : 3px ;
      border : 1 solid #83D5F7 ; 
      font-size:9pt ; color: #208BB8 ;
      line-height : 17pt ;
           }
    div {
      scrollbar-face-color: #ffffff;
      scrollbar-shadow-color: #83D5F7;
      scrollbar-highlight-color: #ffffff;
      scrollbar-3dlight-color: #83D5F7;
      scrollbar-darkshadow-color: #ffffff;
      scrollbar-track-color:#ffffff;
      scrollbar-arrow-color: #83D5F7 ;
        }
    </style>


 

'Website 세상 > Web Design' 카테고리의 다른 글

인풋창 태그 입력 방지  (0) 2008.10.24
셀 배경 고정  (0) 2008.10.24
스타일시트를 이용한 글씨 세로로 쓰기  (0) 2008.09.29
CI SYSTEM  (0) 2008.09.11
[색상코드] 클릭해서 사용하는 색상코드  (0) 2008.09.11
Posted by ToTb
2008. 9. 29. 11:41
<center>
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<div style="writing-mode:tb-rl;">
내용을 적어주세요^^
</div>
</td>
</tr>
</table>
</center>


'Website 세상 > Web Design' 카테고리의 다른 글

셀 배경 고정  (0) 2008.10.24
css 속성  (0) 2008.10.15
CI SYSTEM  (0) 2008.09.11
[색상코드] 클릭해서 사용하는 색상코드  (0) 2008.09.11
Table 처리시.  (0) 2008.09.09
Posted by ToTb
2008. 9. 11. 20:02

CI(Corporate Identity)의 일반적인 개념은 기업이미지 통합을 말합니다.

CI SYSTEM

1. Basic System(BS) - CI 기본시스템

- 코퍼레이트 심볼마크(Corperate Symbolmak)

심볼마크는 기업의 이념과 비전이 함축적으로 담겨져 있는 기업의 얼굴이라 할 수 있다. 모든 디자인 요소 중에 기준이 되는 것으로 기업의 이름이 아닌 심볼의 형태만으로도 기업임을 알 수 있다. CI 디자인 시스템의 가장 중요한 요소이며 모든 시각 커뮤니케이션 활동의 핵심요소이다.

- 코퍼레이트 로고타입(Corperate Logotype)

기업의 정식 명칭을 시각화 한 것으로 영문 로고타입과 국문 로고타입의 두 종류로 디자인 하게 되며, 최근에는 심볼마크가 없는 로고타입으로만 디자인하는 경우가 많다. 이를 워드마크(Wordmark)라고 한다.

- 코퍼레이트 색상체계(Corperate Color)

기업의 이미지를 나타내는 전용색상을 체계적으로 확립하는 것으로 코퍼레이트 심볼과 로고타입을 중심으로 많은 응용디자인에 적용된다. 이것은 규정에 의거하여 사용될 때 기업이미지가 흐트러짐 없이 일관품?보여 진다.

- 코퍼레이트 전용서체(Corporate Typographic)

기업에서 사용되는 문건이나 양식에 들어가는 모든 서체를 동일화하는 작업으로 국문과 영문전용서체를 만들어 사용합니다.

- 코퍼레이트 마스코트(Corporate Mascot)

마스코트는 기업의 홍보에 있어서 대리인으로 내세워 소비자로 하여금 좀더 친숙하게 접근하여 기업의 인지도를 높이는 역할을 합니다. 모든 행사와 이벤트 등에 다양한 방법으로 사용되며 일반적으로 캐릭터라고도 알려져 있습니다.

- 그리드 시스템(Grid System)

심벌마크의 작도법 : 심벌마크는 매우 세밀하게 제작된 조형입니다. 또한 각종 시각전달 커뮤니케이션 활동에서 매우 중요한 요소이므로 이미지의 일관적인 사용과 합리적인 기능이 유지되도록 하기 위해 작도법(Grid System)에 의해 정확하게 작도 되어야 한다. 

로고타입의 작도법 : 로고타입은 매우 세심한 감각과 가독성을 고려하여 제작된 디자인 서체이다. 또한 각종 시각전달 커뮤니케이션에 있어 매우 중요한 역할을 하게 되므로 이미지의 일관성을 유지하여 사용하여야 하며 사용상의 엄격한 통제와 관리가 필요하다.

- 사용금지규정

심벌마크와 로고타입은 기업이미지를 형성하는 중요한 요소이므로 항상 일괄된 형태와 색상으로 활용되어져야 한다. 따라서 색상을 임의변경하거나 형태를 임의로 왜곡시키는 행위는 해서는 안된다. 잘못된 표기는 기업이미지의 품위를 실추시키게 된다.

 

2. Signature System(SS) - 시그니처시스템

- 시그니처시스템

시그니처 시스템은 CI디자인 시스템의 핵심적인 요소인 심벌마크와 로고타이프를 가장 이상적이고 합리적을 조합시킨 것으로 CI의 정식 표기를 의미한다. 이는 기업이미지를 대내외적으로 인식시키기 위한 전략 표현방법이다. 따라서 각종 사인류, 간행물, 홍보물 등에 적용되며 체계적인 관리로 남용하지 않고 효과적으로 사용하여야 한다.

- 시그니처 블록

심벌마크와 로고타이프를 조합하여 시그니처를 주소 등과 함께 서식류, 인쇄물에 적용할 경우 통일된 이미지 전달을 위한 배치규정이다.

- 시그니처 색상활용

가장 이상적인 색상표현 컬러를 양화(Positive)로 표현하는 것으로 단색매체 또는 적용매체의 특수한 상황에 따라 다양한 색상의 변화를 가져온다. 다양한 상황에 대응하기 위한 시스衢냅?색상활용은 색상에 의한 기업이미지 왜곡을 억제하고 고객들에게 기업이미지를 일관성있게 각인시키기 위한 색상 표현 규정이다.

- 시그니처 아이소레이션

시그니처는 그 조형들이 발산하는 이미지를 명확하게 전달하여 식별성과 독리성이 확보되어야 한다. 따라서 표현되는 바탕이나 그 주변 요소들로 부터 장애를 받지 않아야 하며 최소한의 공간을 확보 유지하여야 합니다.

- 시그니처 사용금지규정

시그니처는 심벌마크와 로고타이프를 가장 이상적으로 조합하여 놓은 조형으로 기업이미지의 정식표기를 의미하고 기업이미지를 대내외에 알리기 위한 직접적인 수단이다. 잘못된 시그니처의 오남용은 기업이미지의 훼손과 품위를 손상시키므로 절대 사용을 금해야 한다.

 

3. Application System(AS) - CI 응용시스템

- 서식류(Business Forms)

일반적으로 쓰여지는 문구류나 서식류 일체를 말하는 것으로 레터지, 명함, 봉투, 기안용지, 견적서, 청구서, 팩시밀리용지 등을 말한다.

- 사인(Sign)

기업의 존재를 알리는데 표시하는 간판을 지칭하는 것으로 외부인지 사인과 내부인지사인으로 나눌 수 있다. 외부인지사인은 전면, 돌출, 기둥 사인보드를 말하며, 내부인지사인은 입구에 부착되는 사인보드와 안내사인, 규제사인 등이 있다.

- 수송기류(Vehicles)

수송용 차량이나 선박, 항공기 등 움직이는 기업의 수송용 기기를 총칭한다. 이 수송용 디자인은 움직이는 광고물로서 노출의 빈도가 아주 높으므로 보다 높은 시각 인지도가 필요하다.

- 포장류(Package)

일반적으로 패키지라고 하며 이는 단순히 상품을 감싸 안는 위험으로의 보호만을 위함이 아닌 상품의 인지도와 구매력을 촉진시키는 역할을 해야 한다. 곧 패키지는 상품의 얼굴이 되어 상품의 질을 높이는 마케팅 도구가 된다.

- 유니폼(Uniform)

회사의 규정된 제복을 베이직 시스템을 바탕으로 디자인을 해야 하며, 옷의 질감, 색상, 형태까지 모두 고려해야한다. 사내 직원들의 결속된 모습을 가장 먼저 볼 수 있는 수단으로 의복디자인 수준이 높은 기업은 직원들의 사기앙양과 외부적으로 비춰지는 기업이미지를 긍정적으로 보여 지게 한다.

- 디스플레이(Display)

전시디자인을 말하며 기업의 외관 인테리어와 내부 인테리어 등이 포함된다. 체인점일 경우는 기업이미지와 주변 환경, 소비자의 취향 등을 고려하여 전 체인점을 일관성 있게 디스플레이 한다. 일관성 있게 디스플레이를 했을 경우 소비자들로 하여금 소비심리를 자극하여 매출로 연결되는 직접적인 역할을 하고 있다.

- 광고홍보(Advertising)

기업의 아이덴티티를 일관성 있게 적용하여 홍보하는 모든 수단을 총칭하는 것으로 매스미디어(MassMedia)와 SP미디어(Sales Promotion Media)로 나눌 수 있다. 매스미디어는 TV, 신문, 라디오, 잡지 등의 4매체를 말하며, SP미디어는 그 외 나머지 판매촉진광고를 말한다.

이 모든 것을 통합하여 CI라고 부른다. 

Posted by ToTb
2008. 9. 11. 20:00

 

※ 원하는 색깔을 드래그해서 복사하십시오.
#93DAFF #98DFFF #9DE4FF #A2E9FF #A7EEFF #ACF3FF #B0F7FF #B4FBFF #B9FFFF #C0FFFF
#87CEFA #91D8FA #A5D8FA #AFDDFA #B9E2FA #C3E7FA #CDECFA #D7F1FA #E1F6FA #EBFBFF
#00BFFF #0AC9FF #14D3FF #1EDDFF #28E7FF #32F1FF #3CFBFF #46FFFF #96FFFF #C8FFFF
#00A5FF #00AFFF #00B9FF #00C3FF #00CDFF #00D7FF #00E1FF #00EBFF #00F5FF #00FFFF
#1EA4FF #28AEFF #32B8FF #3CC2FF #46CCFF #50D6FF #5AE0FF #6EE0FF #6EEAFF #78F3FF
#1E90FF #289AFF #32A4FF #3CAEFF #46B8FF #50C2FF #5ACCFF #64D6FF #6EE0FF #78EAFF
#96A5FF #A0AFFF #AAB9FF #B4C3FF #BECDFF #C8D7FF #D2E1FF #DCEBFF #E8F5FF #F4FFFF
#86A5FF #90AFFF #9AB9FF #A4C3FF #AECDFF #B8D7FF #CCE1FF #E0EBFF #EBF5FF #F9FFFF
#6495ED #6E9FED #78A9ED #82B3ED #8CBDED #96C7ED #A0D1F7 #AADBFF #B4E5FF #BEEFFF
#0078FF #0A82FF #148CFF #1E96FF #28A0FF #32AAFF #3CB4FF #46BEFF #50C8FF #5AD2FF
#0064FF #0A6EFF #1478FF #1E82FF #288CFF #3296FF #3CA0FF #46AAFF #50B4FF #5ABEFF
#0000FF #3232FF #5050FF #646EFF #6478FF #6482FF #648CFF #6496FF #64A0FF #64AAFF
#4169E1 #4B73E1 #557DE1 #5F87E1 #6991E1 #739BE1 #7DA5E1 #87AFEB #91B9F5 #9BC3FF
#0064CD #0A6ECD #1478CD #1E82CD #288CD2 #3296D7 #3CA0E1 #46AAEB #50B4F5 #5ABEF5
#5A5AFF #6464FF #6E6EFF #7878FF #8282FF #8C8CFF #A0A0FF #B4B4FF #C8C8FF #D2D2FF
#7B68EE #8572EE #8F7CEE #9986EE #A390EE #AD9AEE #B7A4EE #C1AEEE #CBB8EE #D5C2EE
#6A5ACD #7E6ECD #8878CD #9282CD #9C8CCD #A696CD #B0A0CD #BAAAD7 #C4B4E1 #CEBEE1
#0000CD #2828CD #4646CD #6464CD #6E6ED7 #7878E1 #8282EB #8C8CF5 #9696FF #A0A0FF
#00008C #14148C #28288C #3C3C8C #50508C #646496 #7878AA #8C8CBE #A0A0C8 #B4B4DC
#483D8B #52478B #5C518B #665B8B #70658B #7A6F95 #84799F #8E83A9 #988DB3 #A297BD
#000069 #1E3269 #323C73 #3C467D #3C5087 #3C5A91 #46649B #506EA5 #5A78AF #6482B9

#3DFF92 #47FF9C #51FFA6 #5BFFB0 #65FFBA #6FFFC4 #79FFCE #75FFCA #7AFFCF #7FFFD4
#55EE94 #5FEE9E #69EEA8 #73EEB2 #7DEEBC #87EEC6 #91F8D0 #9BFFDA #A5FFE4 #AFFFEE
#66CDAA #70D2B4 #7AD7BE #84DCC8 #8EE1D2 #98EBDC #9DF0E1 #A2F5E6 #A7FAEB #ACFFEF
#AAEBAA #B4F0B4 #BEF5BE #C8FAC8 #D2FFD2 #DCFFDC #E1FFE1 #E6FFE6 #EBFFEB #F0FFF0
#80E12A #8AE634 #94EB3E #9EF048 #A8F552 #B2FA5C #BCFF66 #C1FF6B #C6FF70 #CBFF75
#52E252 #5CE75C #66EC66 #70F170 #7AF67A #84FB84 #89FB89 #8EFB8E #93FB93 #98FB98
#64CD3C #6ED746 #78E150 #82EB5A #8CF064 #96F56E #9BFA73 #A0FA78 #A5FA7D #AAFA82
#13C7A3 #18CCA8 #1DD1AD #22D6B2 #27DBB7 #2CE0BC #31E0C1 #36E0C6 #3BE0CB #40E0D0
#46B4B4 #50BEBE #5AC8C8 #64D2D2 #6EDCDC #73E1E1 #78E6E6 #7DEBEB #82F0F0 #87F5F5
#20B2AA #2ABCB4 #34C6BE #3ED0C8 #48DAD2 #52E4DC #57E9E1 #5CEEE6 #61F3EB #66F8F0
#5F9EA0 #69A8AA #73B2B4 #7DBCBE #87C6C8 #91D0D2 #96D5D7 #9BDADC #A0DFE1 #A5E3E6
#3CB371 #46BD7B #50C785 #5AD18F #64DB99 #6EE5A3 #73EAA8 #78EFAD #7DF4B2 #82F9B7
#2E8B57 #389561 #429F6B #4CA975 #56B37F #60BD89 #65C28E #6AC793 #6FCC98 #74D19D
#228B22 #2C952C #369F36 #40A940 #4AB34A #54BD54 #5EC75E #63CC63 #68D168 #6DD66D
#497649 #538053 #5D8A5D #679467 #719E71 #7BA87B #80AD80 #85B285 #8AB78A #8FBC8F
#006400 #0A6E0A #147814 #1E821E #288C28 #329632 #3CA03C #41A541 #46AA46 #4BAF4B
#008C8C #0A9696 #14A0A0 #1EAAAA #28B4B4 #32BEBE #37C3C3 #3CC8C8 #41CDCD #46D2D2
#008080 #0A8A8A #149494 #1E9E9E #28A8A8 #32B2B2 #37B7B7 #3CBCBC #41C1C1 #46C6C6

#FFB6C1 #FFBBC6 #FFC0CB #FFC5D0 #FFCAD5 #FFCFDA #FFD4DF #FFD9E4 #FFDEE9 #FFE3EE
#FFAAAF #FFB4B9 #FFBEC3 #FFC8CD #FFD2D7 #FFDCE1 #FFE1E6 #FFE6EB #FFEBF0 #FFF0F5
#FF9E9B #FFA8A5 #FFB2AF #FFBCB9 #FFC6C3 #FFD0CD #FFD5D2 #FFDAD7 #FFDFDC #FFE4E1
#FF7A85 #FF848F #FF8E99 #FF98A3 #FFA2AD #FFACB7 #FFB1BC #FFB6C1 #FFBBC6 #FFC0CB
#FF5675 #FF607F #FF6A89 #FF7493 #FF7E9D #FF88A7 #FF92B1 #FF9CBB #FFA6C5 #FFB0CF
#FF82FF #FF8CFF #FF96FF #FFA0FF #FFAAFF #FFB4FF #FFBEFF #FFC8FF #FFD2FF #FFDCFF
#FF7DB4 #FF87BE #FF91C8 #FF9BD2 #FFA5DC #FFAFE6 #FFB4EB #FFB9F0 #FFBEF5 #FFC3FA
#FF69B4 #FF73BE #FF7DC8 #FF87D2 #FF91DC #FF9BE6 #FFA5F0 #FFAAF5 #FFAFFA #FFB4FF
#FF1493 #FF1E9D #FF28A7 #FF32B1 #FF3CBB #FF46C5 #FF50CF #FF5AD9 #FF64E3 #FF6EED
#DB7093 #DB7A9D #DB84A7 #E08EB1 #E598BB #EAA2C5 #EAB1D4 #EFACCF #F4BBDE #F4B6D9
#D7567F #DC6089 #E16A93 #E6749D #EB7EA7 #F088B1 #F592BB #FA9CC5 #FFA6CF #FFB0D9
#C71585 #C71F8F #C73399 #C73DA3 #CC47AD #D151B7 #D65BC1 #E065CB #EA6FD5 #F479DF
#CD1039 #CD1F48 #CD2E57 #CD3861 #CD426B #D24C75 #D7567F #DC6089 #E16A93 #E6749D
#B9062F #B91A4D #BE2457 #C32E61 #C8386B #CD4275 #D24C7F #D75689 #DC6093 #E16A9D

#FAEB78 #FAF082 #FAF58C #FAFA96 #FAFAA0 #FAFAAA #FAFAB4 #FAFABE #FAFAD2 #FAFAD2
#FFDC3C #FFE146 #FFE650 #FFEB5A #FFF064 #FFF56E #FFFA78 #FFFA82 #FFFF8C #FFFF96
#FFC81E #FFD228 #FFD732 #FFDC3C #FFE146 #FFE650 #FFEB5A #FFF064 #FFF56E #FFF978
#FFB400 #FFBE0A #FFC314 #FFC81E #FFCD28 #FFD232 #FFD73C #FFDC46 #FFE150 #FFE65A
#FDCD8C #FDD296 #FDD7A0 #FDDCAA #FDE1B4 #FDE6BE #FDEBC8 #FDF5D2 #FDF5DC #FDF5E6
#FAC87D #FACD87 #FAD291 #FAD79B #FADCA5 #FAE1AF #FAE6B9 #FAEBC3 #FAEBCD #FAEBD7
#FFA500 #FFAF0A #FFB914 #FFC31E #FFCD28 #FFD732 #FFDC37 #FFE13C #FFE641 #FFEB46
#FF9100 #FF9B00 #FFA500 #FFAF00 #FFB900 #FFC300 #FFC800 #FFCD00 #FFD200 #FFD700
#FF8200 #FF8C0A #FF9614 #FFA01E #FFAA28 #FFB432 #FFB937 #FFBE3C #FFC341 #FFC846
#FFA98F #FFB399 #FFBDA3 #FFC7AD #FFD1B7 #FFDBC1 #FFE0C6 #FFE5CB #FFEAD0 #FFEFD5
#FFA374 #FFAD7E #FFB788 #FFC192 #FFCB9C #FFD0A1 #FFD5A6 #FFDAAB #FFDFB0 #FFE4B5
#FF9473 #FF9E7D #FFA887 #FFB291 #FFBC9B #FFC6A5 #FFD0AF #FFD0AF #FFD5B4 #FFDAB9
#FF7F50 #FF895A #FF9364 #FF9D6E #FFA778 #FFB182 #FFBB8C #FFC091 #FFC596 #FFCA9B
#CD853F #CD8F49 #D29953 #D7A35D #DCAD67 #E1B771 #E6C17B #EBC680 #F0CB85 #F5D08A
#D2691E #D27328 #D27D32 #D7873C #DC9146 #E19B50 #E6A55A #EBAA5F #EBAF64 #F0B469
#AE5E1A #B86824 #C2722E #CC7C38 #D68642 #E0904C #E59551 #EA9A56 #EF9F5B #F4A460
#8B4513 #8B4F1D #8B5927 #8B6331 #906D3B #957745 #9F814F #A48654 #A98B59 #AE905E

#FF9696 #FFA0A0 #FFAAAA #FFB4B4 #FFBEBE #FFC8C8 #FFD2D2 #FFDCDC #FFE6E6 #FFF0F0
#F08080 #F08A8A #F09494 #F59E9E #FAA8A8 #FAB2B2 #FAB7B7 #FABCBC #FAC1C1 #FAC6C6
#F56E6E #F57878 #F58282 #F58C8C #F59696 #F5A0A0 #F5AAAA #FAB4B4 #FABEBE #FAC8C8
#F06464 #F06E6E #F07878 #F08282 #F08C8C #F09696 #F4A0A0 #F4AAAA #F4B4B4 #FEBEBE
#FF0000 #FF3232 #FF4646 #FF5050 #FF5A5A #FF6464 #FF6E6E #FF7878 #FF8282 #FF8C8C
#EB0000 #EB3232 #EB4646 #EB5050 #EB5A5A #EB6464 #F06E6E #F57878 #FA8282 #FA8C8C
#CD0000 #CD3C3C #CD4646 #CD5050 #D25A5A #D76464 #DC6E6E #E17878 #E68282 #EB8C8C
#CD5C5C #CD6666 #CD7070 #CD7A7A #D28484 #D78E8E #DC9898 #E6A2A2 #EBACAC #F0B6B6
#B90000 #B93232 #B93C3C #B94646 #B95050 #BE5A5A #C35F5F #C86464 #CD6969 #D26E6E
#B22222 #B24040 #B24A4A #B25454 #B75E5E #BC6868 #C17272 #CB7776 #CB7C7C #D08180
#A52A2A #AA3E3E #AF4848 #B45252 #BE5C5C #C36666 #CD7070 #CD7A7A #D28484 #D78E8E
#800000 #803232 #853C3C #8F4646 #945050 #9E5A5A #A36464 #AD6E6E #B77878 #C18282

#CD853F #CD8B45 #CD904A #D2954F #D29A54 #D79F59 #D7A45E #E1A963 #E1AE68 #E6B36D
#DB631F #E56D29 #E57733 #EA813D #EF8B47 #EF904C #F49551 #F49A56 #F49F5B #F4A460
#D2691E #D27328 #D77D32 #D7873C #DC9146 #E19B50 #E6A055 #EBA55A #F0AA5F #F5AF64
#A0522D #A05C37 #A06641 #A5704B #AA7A55 #B4845F #B98E69 #C39873 #CDA27D #D7AC87
#8B4513 #8B4F1D #8B5927 #8B6331 #906D3B #9A7745 #A4814F #AE8B59 #B89563 #C29F6D
#DA70D6 #DF75DB #E47AE0 #E97FE5 #EE84EA #F389EF #F88EF4 #FD93F9 #FF98FE #FF9DFF
#BA55D3 #BF5AD8 #C45FDD #C964E2 #CE69E7 #D36EEC #D873F1 #DD78F6 #E27DFB #E782FF
#9932CC #9E37D1 #A33CD6 #A841DB #AD46E0 #B24BE5 #B750EA #BC55EF #C15AF4 #C65FF9
#9400D3 #9905D8 #9E0ADD #A30FE2 #A814E7 #AD19EC #B21EF1 #B723F6 #BC28FB #C12DFF
#942894 #9E329E #A83CA8 #B246B2 #BC50BC #C65AC6 #D064D0 #DA6EDA #E478E4 #EE82EE
#8c008c #960a96 #a014a0 #aa1eaa #b428b4 #be32be #c83cc8 #d246d2 #dc50dc #e65ae6
#800080 #8a0a8a #941494 #9e1e9e #a828a8 #b232b2 #bc3cbc #c646c6 #d050d0 #da5ada
#834683 #8d508d #975a97 #a164a1 #ab6eab #b578b5 #bf82bf #c98cc9 #d396d3 #dda0dd
#828282 #8c8c8c #969696 #a0a0a0 #aaaaaa #b4b4b4 #bebebe #c8c8c8 #d2d2d2 #dcdcdc
#000000 #282828 #323232 #3c3c3c #464646 #505050 #5a5a5a #646464 #6e6e6e #787878


'Website 세상 > Web Design' 카테고리의 다른 글

스타일시트를 이용한 글씨 세로로 쓰기  (0) 2008.09.29
CI SYSTEM  (0) 2008.09.11
Table 처리시.  (0) 2008.09.09
스타일시트로 테이블에 그라데이션 효과 주기  (0) 2008.09.09
CSS 필터모음  (0) 2008.09.09
Posted by ToTb
2008. 9. 9. 00:19
테이블에서 박스를 씌우고 , 표형태로 출력 시 값이 없을 때 셀구분선이 표시되지 않기때문에
이를 위해서 if 문으로 처리하여 null 이면 '&nbsp'를 출력하도록 코딩되어 있습니다.
그래서 코딩량도 많고 관리되 어려운데 다음처럼 표를 처리하면 모든 문제가 해결됩니다.

<table style='border-width:1px;border-color:#90a2ac;border-style:solid;' width='91%' border='1' cellpadding='3' cellspacing='0' frame=void bordercolordark='white' bordercolorlight='#90a2ac'>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
</table>

위와 같이 하면 값이 없더라도, 셀구분선이 정확히 표시됩니다.


* 잠깐 설명을 하면
style='border-width:1px;border-color:#90a2ac;border-style:solid;' 은 테이블의 외곽선을 그리는 것입니다.
frame = void 는 테이블 내부의 각 셀의 표시방업입니다.
. 사용가능한 값은 : void, hsides, vsides 등 8가지 가 있습니다.
. 말로 설명하기는 어렵고, 직접 테스트 해보세요




Posted by ToTb
2008. 9. 9. 00:18
css 팁 하나 올려봅니다. ^^
브라우저에서 확인해 보세요~

<table style='filter=progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr=#B1C7F9, EndColorStr=#EEF2FC)'>

<tr width='400'height='200'>

<td align='center'>스타일시트로 테이블에 그라데이션 효과 주기</td>

</tr>

</table>





'Website 세상 > Web Design' 카테고리의 다른 글

[색상코드] 클릭해서 사용하는 색상코드  (0) 2008.09.11
Table 처리시.  (0) 2008.09.09
CSS 필터모음  (0) 2008.09.09
웹 사이트에 색 좀 제대로 쓰자  (0) 2008.09.09
색의 감성효과  (0) 2008.09.09
Posted by ToTb
2008. 9. 9. 00:16

모션필터


<style>
#mb{
filter:progid:DXImageTransform.Microsoft.MotionBlur(Strength=30,Direction=90)
}
</style>



알파필터

<style>
#af{
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30)
}
</style>




쉐도우필터


<style>
#sf{
filter:progid:DXImageTransform.Microsoft.Shadow(color='gray', Direction=135, Strength=5)
}
</style>



페이드인 / 페이드 아웃 필터

<img src="/images/photoshop/020116p_01.jpg" id="objImg">

<input type="button" onclick=fadeOut(objDiv) value="페이드-아웃">
<input type="button" onclick=fadeIn(objDiv) value="페이드-인">


<SCRIPT>
<!--
function fadeOut(obj) {
    obj.style.filter="blendTrans(duration=2)";
    // 필터가 작동하고 있지 않음을 확인
    if ((obj.visibility != "hidden") && (obj.filters.blendTrans.status != 2)) {
        obj.filters.blendTrans.Apply();
        obj.style.visibility="hidden";
        obj.filters.blendTrans.Play();
    }
}
function fadeIn(obj) {
    obj.style.filter="blendTrans(duration=2)";
    // 필터가 작동하고 있지 않음을 확인
    if ((obj.visibility != "visible") && (obj.filters.blendTrans.status != 2)) {
        obj.filters.blendTrans.Apply();
        obj.style.visibility="visible";
        obj.filters.blendTrans.Play();
    }
}
-->
</SCRIPT>





'Website 세상 > Web Design' 카테고리의 다른 글

Table 처리시.  (0) 2008.09.09
스타일시트로 테이블에 그라데이션 효과 주기  (0) 2008.09.09
웹 사이트에 색 좀 제대로 쓰자  (0) 2008.09.09
색의 감성효과  (0) 2008.09.09
프로페셔널 디자이너  (0) 2008.09.09
Posted by ToTb
2008. 9. 9. 00:15
때때로 웹 사이트의 색은 만드는 사람의 개인적인 취향에 의해 결정되곤 한다. 방문하는 고객들의 성향을 거의 고려치 않는다는 말인데, 이럴 경우 사이트 색깔이 영 ‘엉뚱해’ 지거나 부정적인 평가를 받는 경우가 허다하다.

색에 대해 잘 이해하지 못하거나, 색이 갖는 엄청난 힘을 제대로 사용하지 못한다면 사이트의 성공에 악영향을 끼칠 수도 있다.

효과적인 색 사용은 사이트의 방문객에게 무의식적이지만 강력한 영향을 끼친다. 잘 조화된 색상은 웹 사이트의 전체 톤이나 분위기를 훌륭히 연출할 수도 있고, 사이트가 전달하려는 특정 메시지에 감정을 불어 넣고 힘을 실을 수 있다. 게다가, 웹 사이트 전체적으로 통일된 색상은 회사나 제품에 대한 브랜딩 효과까지 주게 된다.

웹 사이트의 질을 높이고 싶다면 먼저 주제가 되는 색 조합(color scheme)을 정할 필요가 있다. 배경, 버튼, 로고, 링크 색깔 등 웹 사이트의 모든 그래픽 요소에 한 가지 색 조합을 적용해 사이트에 항상 통일된 느낌을 부여하도록 하라.

또한 사이트의 특정부분에 두드러지는 색을 사용해 독자의 눈길을 끌거나 특정 메시지를 강조할 필요도 있을 것이다. 색을 적용한 텍스트 박스, 헤드라인, 글 머리 기호, 특정 아이템 리스트 등은 방문객들의 관심을 끄는데 적당하다.

 사이트의 색상을 결정하기 전에는 반드시 다음 사항들을 짚고 넘어가기 바란다. 

1. 주 방문객은 누구인가 (남자 혹은 여자? 10대 혹은 중년? 전문직 혹은 일반직?)
2. 사이트의 톤은 어떻게 정할 것인가 (격식 있게? 학문적으로? 기술적으로? 캐주얼하게?)
3. 사이트에 어떤 메시지를 전하고 있는가 (정보? 기술 강좌? 오락?)
4. 기존에 쓰던 컬러 스킴은 있는가 (전에 잡지에 내보냈던 광고의 컬러 스킴이나 로고에 들어 있는 컬러 스킴을 웹 사이트에 사용하는 것도 바람직하다.)

 구체적으로 색을 적용하기 전에는 다음 사항들을 고려하기 바란다.

1. 웹 사이트 색으로 어떤 효과를 주려 하는지?
2. 어떤 색이 사이트의 목적에 가장 잘 부합하는지?
3. 중심이 되는 색을 정했으면, 그 색으로 만들어 낼 수 있는 색 조합(컬러 스킴)엔 어떤 것들이 있는지?
4. 웹 사이트의 주 방문객을 고려할 때 그 중 어떤 컬러 스킴이 가장 어울리는지?

다음은 주제 색과 컬러 스킴이 불러 일으키는 느낌들이다. 잘 살펴보고 자신의 웹 사이트에는 어떤 주제 색이 어울릴지 결정하기 바란다.

ㆍ뜨거운: 주로 빨간 색 계열. 뜨거운 색은 외향적이고 강함을 상징한다. 공격적이고 자극적인 성질 때문에 주위를 환기 시키는데 효과적이다.

ㆍ차가운: 주로 파란 색 계열. 초록과 청록도 같은 계열이다. 눈과 얼음을 연상시키는 차가운 색은 냉정함과 차분함을 상징한다.

ㆍ따듯한: 주로 빨강, 노랑 색 계열. 주황 색과 오렌지 색이 대표적. 따뜻한 색은 아늑하고 편안하고 자연스러운 느낌을 준다.

ㆍ시원한: 주로 파란색과 노란색의 조합으로 쓰인다. 연두, 초록, 청록 등이 이런 시원한 색의 주종을 이룬다. 주로 자연에서 볼 수 있는 색으로 신선하고 평화롭고 안정적인, 그리고 깊은 느낌을 준다.

ㆍ밝은: 파스텔 색상, 크림색, 순면 색 등이 밝은 색의 주종이다. 원색을 쓰지 않는 거의 투명한 빛깔이기 때문에 공기나 물과 같은 느낌을 준다. 주위의 분위기를 탁 트이기 하는데 효과적.

ㆍ어두운: 검은색을 포함하는 색깔이다. 어두운 색은 공간을 좁게 보이게 하고 진지한 분위기를 심어 준다. 계절적으로 가을이나 겨울을 연상시키기도 한다.

ㆍ흐린: 상아색, 밝은 파랑, 핑크, 라벤더와 같은 색조가 낮은 색들이다. 최소 65% 이상의 흰색을 포함하고 있으며 부드럽고 로맨틱한 분위기를 심어준다. 잔잔하고 점잖은 느낌을 전달한다.

ㆍ화려한: 회색이나 검은색을 포함하지 않은 순수한 색들이다. 화려한 성질 덕에 주위를 끄는데 효과적이다. 친절하고 발랄한 분위기를 연출한다.

마지막으로 사이트에 눈을 피곤하게 하거나 글을 읽기 힘들게 만드는 색을 쓰지 않았는지 확인하도록 하라. 또한 사이트 전체의 색상이 불안하거나 혼란스럽지 않은지 주의하도록. 스스로 컬러 스킴을 만들어 낼 능력이 없다면 과거의 고전적인 색들을 이용해 보도록 한다. 과거에 흔히 이용됐던 컬러 스팀은 가장 안전한 선택이다.

웹 사이트의 색은 저절로 만들어 지는 것이 아니다. 사이트 제작자들은 색을 자신의 목적에 맞게 부릴 수 있도록 많은 신경을 써야 한다. 효율적인 색 관리를 통해 방문객이 사이트에서 메시지 뿐만 아니라 느낌을 가져갈 수 있도록 하라.


제공 : 코리아인터넷닷컴
저자 : Kathy Hill Hough 




'Website 세상 > Web Design' 카테고리의 다른 글

Table 처리시.  (0) 2008.09.09
스타일시트로 테이블에 그라데이션 효과 주기  (0) 2008.09.09
CSS 필터모음  (0) 2008.09.09
색의 감성효과  (0) 2008.09.09
프로페셔널 디자이너  (0) 2008.09.09
Posted by ToTb
2008. 9. 9. 00:05
심리

노랑은 종종 따뜻한 느낌을 담고 있으며 따라서 휴양지를 홍보하는 웹 사이트 같은 곳에서 쓸 색상으로 제격이다. 그러나 경찰력이나 치안과 관련한 웹 사이트에 써서는 곤란하다.

노랑은 동시에 병약함과 겁많음, 질투심, 배반을 뜻할 수 있기 때문이다.

빨강이나 주황 같은 또 다른 “
난색(暖色)
”도 있다. 이러한 선명한 색상은 감정을 고양시킨다. 빨강을 좋아하는 사람은 충동적이고 정력적이며 추진력이 높다.

그러나 이러한 색상을 과도하게 사용하는 것은 자칫 긴장을 불러 일으킬 수 있다.

한색(寒色)에는 보라, 파랑, 녹색 계열이 들어간다. 이러한 색상은 차분하며 사람들의 감정을 가라앉힌다. 파랑과 밝은 초록은 위무적이며 야외로 나가고픈 충동을 일으킨다.

성(性)

지난 몇십 년 사이에 이루어진 각종 연구들을 보면 남성들은 백색이 혼합되지 않은 순수한 색상에 끌리는 경향이 있다. 그러므로 빨강이나 밝은 파랑류를 포함하는 광고는 여성보다 남성에게 더욱 호소력을 가지게 된다.

여성들은 차갑고 차분한 색상에 끌리는 경향이 있으며, 일반적으로 남성들보다 색상에 민감하다.

연구 결과에 따르면 남성 여성 모두에서 무채색의 황량한 느낌을 주는 색상은 심장 박동수를 증가시키며 스트레스를 가중시키는 결과를 낳는다.


빨강

빨강은 피를 끓게 하는 색입니다. 행동을 부추기는 색상이어서 대다수의 카지노에서 주로 쓰이는 색이기도 하지요. 파란 불빛 아래에서와 견주어 빨간 불빛 아래에서 사람들이 얼마나 더 많은 도박을 하고 모험을 거는지 일러 주는 연구보고도 어렵지 않게 찾을 수 있습니다.

빨강은 높은 각성 효과를 일으킵니다.

기업의 색을 비교해 봅시다. 크라이슬러(빨강)과 포드(파랑)를 생각해 보십시오. 어느 기업이 보다 활기찬 광고를 하며 유행에 민감한 자동차 디자인을 갖고 있습니까?

녹색

많은 이들의 마음 속에서 초록색은 선함을 대변합니다. 환경과 관련해서는 말이지요.

초록은 생생한 빛깔입니다. 그것은 낙관주의를 상징하며 모든 일에 대한 전망이 밝으리라는 암시를 줍니다. 그러나 노랑연두는 부정적입니다. 끈적끈적하고 악취 나는 달팽이 점액을 생각해 보십시오.

밝은 녹색은 침착한 색상이며 종종 공공의 녹색으로 불립니다. 교도소나 정신과 병동을 가 본 적 있으신지요? 그런 곳에서는 이 색의 진정 효과 때문에 벽면을 주로 이 색상으로 칠해 놓습니다.

파랑

파랑은 많은 미국의 기업들이 기업의 색으로 사용하는 색입니다.

포드,
빅 블루Big Blue(IBM) 그리고 벤츠 모두 그렇습니다. 엑슨과 모빌이 합병할 때 그들을 대표하는 색이 된 것도 파랑이었습니다.

미국의 주요 기업들의 명단과 그들을 대표하는 색상을 살펴보십시오. 아마 무수히 많은 초록과 파랑이 눈에 띌 것입니다. (그에 견주어 빨강은 활력입니다. 코카 콜라나 크라이슬러를 보세요.)

검정

오늘날 검정은
나는 지금 최첨단에서 실권을 쥐고 있습니다
는 의미로 종종 쓰입니다. 검정은 하나의 태도를 나타내는 색으로 고려해 볼 만합니다.



고객층이 주로 남성일 경우

우리의 초대 재무장관은 남성인 Alexander Hamilton이었습니다. 그는 연방 서류에 쓸 색으로 밝은 녹색을 선정했습니다. 그 녹색은 훗날 우리의 지폐로 바뀌었습니다.

그 고유의 색깔로 파랑을 지정해 두는 대개의 기업의 경영진은 남성입니다.

남성들은 주로 파랑과 초록을 선호합니다. (저는 최근까지 그 이유를 모르는 채로 단지 제가 좋아하는 색이라는 이유로 파랑을 제 사이트의 주된 색깔로 정했습니다).

고객층이 주로 여성일 경우

여성들은 남성들보다 색에 열 배는 더 민감합니다. 여성이 남성보다 색을 감지하는 능력이 뛰어나다는 것은 과학적으로도 입증된 바 있습니다. (제가 빨강이라 말하면 아내는
장미색이라고 정정해 줍니다. 분홍이라고 하면 아내는 복숭앗빛
하고 고쳐 줍니다.)

여성들에게는 봄빛 화사한 파스텔 톤이나 가을빛 물씬 풍기는 세피아 계열 같은 보다 미묘한 색깔이 필요합니다.

고객층이 주로 노년층일 경우

이럴 경우에는 밝은 빨강이나 오렌지, 노랑 같은 밝은 색깔이 제격입니다.

나이가 들면 시야에 상당한 변화가 있습니다. 이미지를 예리하게 파악하는 능력뿐 아니라 색을 인지하는 방법에 있어서도 그렇습니다. 그렇기 때문에 노령자들을 위한 골프 코스에서는 자연 세계 그 어디에서도 볼 수 없는 색을 보게 되는 것이지요.

 
객관적이고 합리적이면 신뢰성이 높은 디자인 계획이 가능하게 하고자 한다.
9초안에 웹 사이트에 관한 인상을 받는다.
그래서 웹사이트의 내용과 사용자를 고려한 색상계획이 매우 중요하다.
색상은 웹 사이트의 가치, 목적과 개성까지도 표현해 주기 때문에 색상 선택은 매우 신중을 기해서 해야한다. 





'Website 세상 > Web Design' 카테고리의 다른 글

Table 처리시.  (0) 2008.09.09
스타일시트로 테이블에 그라데이션 효과 주기  (0) 2008.09.09
CSS 필터모음  (0) 2008.09.09
웹 사이트에 색 좀 제대로 쓰자  (0) 2008.09.09
프로페셔널 디자이너  (0) 2008.09.09
Posted by ToTb
2008. 9. 9. 00:04

프로페셔널 디자이너

기존의 디자이너로서 활동하는 분들보다는 앞으로 디자이너로써 새로운 마켓에 대해 도전해 보고 싶은 분들에게 전하고 싶은 말을 간단히 적을까 한다.

우선 프로페셔널한 디자이너가 되기위해서는 크리에이티브만을 추구하는 사람이 되어선 안 된다. 크리에이티브를 하면서 동시에 자신의 크리에이티브를 세일즈로 유도할 수 있도록 기획하는 것과 더불어 직접 세일즈를 할 수 있는 능력을 겸비하는 것이 진정하게 자신을 남들에게 인정 받고 디자이너로써 사회적인 혜택을 누릴 수 있다.


디자인 작업에는 충실하지만 그 디자인에 대해 충분히 포장이나 가격표를 제대로 달지 못하면 프로페셔널 한 디자이너의 요건에 들지 않는다.현실적으론 클라이언트에게 세일링과 크리에이티브 전략과 크리에이티브 전달은 각각 구분되어 있지만 기본적으로 업무의 흐름을 이해하고 있어야 한다. ‘난 디자인만 하는 사람’이란 식으로서의 업무분담은 팀웍을 조성하는데 큰 갭이 된다.


디자이너들에게 자신의 크리에이티브를 세일즈할 수 있게 끔 가장 쉽게 접근하는 방법은 기본적으로 자신의 주관적이고 불투명한 이미지를 선명하고 깨끗하고 선명한 컬러 사진과 같은 느낌으로 구두와 시각적으로 만드는 스킬을 지녀야 한다.


주관적이고 불투명한 느낌을 시각적으로 구사하는 방법은 디자인 전공이나 혹은 기타 디자인 교육학원을 통해 충분히 익혀왔으리라 믿는다.하지만 구두,즉 프리젠테이션 능력을 깨끗하고 능숙하게 하는 것은 경험과 습득을 통해서만 이뤄진다.


평소에 알고 지내던 웹 디자인 회사의 디자인팀장은 자신 밤을 새워 가면서 작업한 디자인을 클라이언트가 보고 의견을 물었을 때 머뭇거리다가 단순히 “뭐, 예쁘잖아요”라고 한마디로 끝내버리면 클라이언트가 아닌 다른 보통사람 들의 기대치에도 결코 만족스러운 결과를 가져올 수 없다.


여기서 한가지 중요한 점은 디자이너가 가장 착각하기 쉬운 부분은 자신의 주관적인 관점에서 작업을 시작하면서 겉잡을 수 없을 만큼 자신의 눈높이가 자신이 디자인한 것에 디자인화 되어버린다는 것이다.


경험이 많은 현직 디자이너들은 각자 훌륭한 노하우를 가지고 있겠지만 필자는 백화점이나 상점을 웹사이트의 쇼핑몰과 비교해 가면서 각각의 서비스에 초점을 맞춘다.


개인적으로 백화점에서 물건을 구매시의 느낌과 웹사이트에서 구매버튼을 눌렀을 때에 느낌을 객관적으로 설득할 수 있는 방법을 습득하고 반대로 어떤 가이드라인을 통해 서로 다른 곳에서 판매를 하고 있는지를 관찰해 한 다음,


(물론 회사 내에서 세일즈 교육프로그램이 있거나 유능한 세일즈 팀을 통해 배우는 것이 가장 이상적이고 좋은 방법이지만 그렇게 셋업이 되어있지 않은 곳이 더 많은 것 같다.)클라이언트에게 판매를 할 때에 백화점에 교육 받은 점원을 모델로 삼고 웹사이트도 좋은 웹사이트를 모델로 삼으면 클라이언트를 설득시키기에 가장 쉽게 접근할 수 있다.


여기서 백화점 점원처럼 자신의 크리에이티브를 파는 것이 아니라 교육 받은 마인드를 보고 자신에게 맞는 모델을 선정해서 거기에 비추어 클라이언트를 판매로 유도 시키는 것이다.


마지막으로 잊기 쉬운 작업은 모든 것을 도큐먼트화 하는 것이다. 이것은 클라이언트 사이드에서 자신의 크리에이티브에 신용도를 가지게 하기에는 아주 유용하다.스타일 가이드나 스탠다드 라인과 같은 메뉴얼을 만드는 것도 잊어서는 안 된다.


위의 모든 것은 결과적으로 어느 한 방향에만 치우쳐서도 안되고 또 하나를 빼먹어서도 안 된다.모든 진행상황에 있어서 적절히 유지하면서 밸런스를 만드는 것이 가장 중요하다.


그럼 클라이언트에게서 프로젝트를 수주 받은 다음 어떤 식으로 일을 진행해야 하는가에 대해 잠깐 살펴보기로 하자.일단 아트디렉터를 주축으로 각각 리드급의 디자이너들을 통해 계층적인 라인을 통해 작업을 만들어 나아간다.영업을 통해 일을 전달 받고 크리에이티브 전략 팀을 구성한다.


여기서는 전체적인 문맥을 잡는 전략가들을 중심으로 브랜드 빌더,크리에이티브 딜리버리와 정보 및 시스템 설계사 등으로 구성되어 프로젝트의 전략을 수립하고 사이트의 정의를 내린다.여기서 나온 결과물(전형)을 가지고 마스터플랜(원형)을 작성하고 크리에이티브 관점에서 프론트앤드 디자인과 백앤드 디자인을 만들어 나아간다.


여기서 프론트 앤드는 웹사이트의 외형 디자인을 말하는 것이고 백앤드 디자인의 경우는 클라이언트 관리와 브랜드 빌딩을 위해 전체 디자인 가이드 라인을 매뉴얼화 시키는 것이다.프론트엔드의 결과물은 마지막으로 사이트 디멜롭먼트들에 의해 유용성을 다지면서 다이나믹하고 인터액티브하게 완성도를 높여 나아간다.


진행상황에 대해서는 PM이 관리를 하고 CCO(Chief Creative Officer)에 의해 점검이 된다.이런 진행방식은 회사마다 다르겠지만 필자가 생각했을 때 핵심역량을 충분히 살리면서 나름대로 변화의 유연성을 가질 수 있을 거라고 생각한다.


마지막으로 당부하고 싶은 얘기는 내가 당신에게 나의 크리에이티브를 팔려면 Creative Work만으론 부족하다.기본적으로 자신의 크리에이티브를 확실하게 포장하면서 분명하게 가격표를 달아줄 수 있어야 하고 명확한 설명서까지 만들어 주어야 한다.


프로페셔널 한 디자이너가 되려면 비즈니스를 디자인하는 마인드를 가져야 한다.고객의 경험에 비추어 파트너쉽으로 설정 시킨 클라이언트를 자신의 크리에이티브로 리드해 성공적으로 비즈니스를 수행해 나아갈 때 비로소 자신은 프로페셔널 한 디자이너가 되는 것이다.


David & Danny's Design Channel




'Website 세상 > Web Design' 카테고리의 다른 글

Table 처리시.  (0) 2008.09.09
스타일시트로 테이블에 그라데이션 효과 주기  (0) 2008.09.09
CSS 필터모음  (0) 2008.09.09
웹 사이트에 색 좀 제대로 쓰자  (0) 2008.09.09
색의 감성효과  (0) 2008.09.09
Posted by ToTb