CSS 선택자 남용 유감
2006.01.11 ,
오전 11:23 
웹 디자인, 웹 접근성 
4 comments »
CSS는 Cascading Style Sheet의 약자이다. 의역하면, 계단형(상속형) 스타일 시트이다. CSS는 (x)HTML의 외양을 꾸미는 역할을 하며, 이름에서 알 수 있듯이 CSS의 가장 큰 특징은 상속형이다. 각각의 CSS 요소들의 정의된 성질들이 조상/자손, 부모/자식 관계 속에서 상속된다는 것이다.
이렇게 상속되는 특징을 잘 이해하고, CSS를 제작한다면, 웹문서는 출렁이는 파도처럼 부드러움을 갖게될 것이다. 웹사이트 전체적인 통일성과 유동성을 쉽게 구성할 수 있고, 추후 수정/보완할 수 있다.
그렇지 않고 CSS를 제작한다면 흡사, 웹문소의 구성요소들은 각개전투를 벌이다가 웹사이트 전체적인 전투진형을 흩뜨릴 것이며, 장군(제작자)의 작전명령을 오만년이 걸려서야 수행할 것이다. ^^;
이런 상속되는 특징을 이해하기 위해선 먼저 CSS 선택자를 이해해야 한다. 즉, CSS 선택자 이해 -> CSS 상속성 이해 -> CSS 이해가 되려남.. 이와 관련해서 현석님은 “선택자를 알면 CSS의 절반을 안다”라고 말했었다.
최근 UTF-8 인코딩을 지원하고, 웹표준을 준수한 GR보드가 공개됐다. 또한 개인화기능이 추가되고, 웹표준을 준수한 올블로그V2가 베타 테스트 중이다. 이 두 사이트가 웹표준을 준수한다고 해서 코드를 잠깐 확인해보니, CSS 선택자(HTML 요소, Class 선택자, ID 선택자)가 남용된 걸 알 수 있었다.
웹 유효성 검사(Validate)는 수단이지 목적이 아니다. 검사를 통과했다고 표준도 아닐 것이다. 충분히 의미있고(sementic), 구조적인(Structual)인 마크업을 사용하도록 조금 더 노력한다면, 정말 멋진 사이트가 될 것이다.
GR보드와 올블로그 개발자 여러분 조금 더 힘내세요! 파이팅~!
또 다른 읽을거리
Random Post
-
Post-Plugin Library missing
Hooney라는 ID로 온라인에서 활동하는 조훈입니다. 
4개의 의견이 있습니다. | 당신의 의견을 바랍니다.
1.
하늘이 ｜
2006.01.11 ,
오후 12:33 ·
permallink
흑흑, 앞으로도 분발하겠습니다! ㅠ_ㅜ)/
2.
Hooney ｜
2006.01.11 ,
오후 01:17 ·
permallink
올블로그는 국내 대표 블로그 메타 사이트잖아요. 작년 여름부터 CDK(CSS 디자인 코리아) 회원들은 올블의 웹표준화에 관심이 있었답니다.
직접 돕진 못하더라도, 이렇게나마 작은 의견 남기는 것 뿐이네요~ ^^:
하늘님 파이팅~!!
3.
yser ｜
2006.01.16 ,
오후 06:42 ·
permallink
그런데 이건 많이 써보는 수 밖에 없더라고요. 직접 코딩하는 게 항상 그렇지만.. 아무리 이론을 머리론 알고 있어도 직접 코딩하면서 벽에 부딫혀보지 않으면 익혀지지 않더군요. 저도 초보일 때는 잘 몰랐지만, 지금은 막 XHTML/css 새로 배우는 분들의 소스를 보면 class 남발 되어 있는 걸 보면서 나도 옛날엔 저랬구나.. 하고 깨닫게 되더군요.
물론, 제가 그걸 그 분들에게 지적해준다고 한들 조언은 되겠지만 결국엔 그 습관이 한동안은 이어질거라는 것. 학문(?)의 이론과 실재란 참.. ^^;;
어쨌든 그저 많이 코딩해보는 수 밖에 없는 것 같습니다.
4.
Hooney ｜
2006.01.18 ,
오전 10:22 ·
permallink
yser님/ 경험 측면도 있겠지만, 저는 기본을 제대로 학습할 기회가 없었다고 생각합니다. (저 역시 그랬구요)
하지만 대부분 눈에 보이는 디자인에 관심을 갖을 뿐, 그 뼈대를 이루는 코드에 누가 관심을 갖을까요? ^^;
당신의 의견을 바랍니다..
사용할 수 있는 HTML 태그 :
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>