표준은 어디에나 존재한다 그러나…
nmind님의 언급처럼 표준이라는 것은 기술적인 것 보다는 약간은 정치적인 면이 있습니다. 시장이 커지면 보통 미국에서부터 표준화 작업이 이루어 집니다. 비영리 단체에서 그러한 일을 하고 있으며, 웹에서는 보통 W3C에서 관련 표준화 작업을 진행합니다.
마이크로소프트에서 만드는 OS도 표준이 존재하고, 비쥬얼 스튜디오에서 지원하는 언어들도 표준이 존재합니다. 심지어는 종교도 표준이 존재합니다.
일반적으로 표준은 처음엔 많이 쓰이는 부분을 묶는 것부터 시작하고, 시간이 지나면 선도적인 권고를 내놓습니다. 지금은 쓰이지 않아도 이렇게 하면 모든 이에게 이롭다는 식입니다. W3C에서 현재의 표준으로 삼는 XHTML1.1+CSS2.0이 과연 모든 이에게 이로울까요?
CSS 레이아웃의 표준
CSS 레이아웃을 만드는 것에 가장 불리한 점은 “쉽지 않다”라는 점입니다. 무슨 이야기냐 하면 W3C에서 제공하는 레퍼런스만을 보고 디자인을 할 수가 없습니다. 즉, 브라우져에 띄우기 전까지는 어떻게 나올지 알 수 없다는 이야기입니다.
즉, 테이블 레이아웃을 적용할 때에는 IE, FireFox, Safari 등의 태그 레퍼런스를 참고하지 않아도 디자인이 가능합니다. 그 이유는 테이블이라고 하는 것은 웹이 처음 생길 때 부터 존재했던 것이기 때문이죠. 하지만, CSS는 여러가지 브라우져가 나온 이후에 생긴 것으로 브라우져마다 적용 방법이 약간씩 틀립니다.
우리는 왜 브라우져 핵을 사용해야 하는가?
저도 과거에 CSS만으로 웹페이지를 구성한 적이 있습니다. 코드와 디자인의 분리는 만드는 입장에서는 꽤나 매력적인 것이 사실입니다. 즉, 코드는 DIV로 쌓여져서 그 자체로 데이터만 넣고, 디자인은 style.css 등의 파일 안에 넣습니다. 디자인을 고칠때에는 style.css파일만 수정합니다. 정말 매력적입니다.
하지만, 오래 지나지 않아서 브라우져 별로 CSS를 적용하는 것이 쉽지 않다는 것을 알게 되었습니다. 그리고, 전혀 불필요하지만 CSS만으로 디자인 할 때 필요한 것, 즉 브라우져 핵을 써야한다는 사실도 알았습니다. 브라우져들이 CSS를 적용을 달리하는데 우리는 한개의 CSS로 둘 다 제대로 나오게 해야 합니다. 프로그래머의 경우는 보통 동일 API를 사용할 수 있는 라이브러리를 만들어서 코딩을 하는데, 하나의 프로그램 코드가 유닉스던 리눅스던 윈도우던 동일한 출력을 보장하게 하는 가장 편한 방법입니다. Google이 Picasa 리눅스 버젼을 만든 방법이 이것입니다.
하지만, CSS는 단순한 상속의 개념은 있지만, 클래스처럼 그것을 자유롭게 활용하기가 구조적으로 불가능합니다. CSS 3.0에서는 해결이 될 것 같지만, 현재는 모든 브라우져에서 동일한 출력을 보장하는 CSS 파일은 불가능합니다.
따라서, 선택은 세가지로 압축됩니다. 브라우져 핵을 이용하거나, 브라우져 별 별도의 CSS를 만들거나 아니면 디자인 자체를 핵이 필요없는 것으로 바꾸거나…
방금 검색을 해서 알아본 두가지 CSS 코드를 소개합니다.
<style type="text/css">
#mydiv {
color: blue;
drdoc: ";
drdoc: "";
color: red;
background: silver;
/*";/* IE */
font-weight: bold;
}
#nextdiv {
color: red;
}
body {
background: navy;
}
</style>Note: IE will continue parsing after /* IE */
그리고,
<p class="code"><style type="text/css">
#mydiv {
color: blue;
/*/*/
drdoc: ";
drdoc: "";
/* NN4 */
color: red;
background: silver;
/*";/* IE */
font-weight: bold;
}
#nextdiv {
color: red;
}
body {
background: navy;
}
</style>
이것은 라운드 박스를 구현하는 CSS입니다.
브라우져 호환성을 갖게 하기 위한 노력으로 이런 코드는 레퍼런스도 없습니다. 해보고 되면 블로그등에 올려서 전파됩니다. 그러고보니 집단지성이군요.
이 글을 보시는 관계자 분들은 위의 코드를 해석하실 수 있습니까? 만약 전임자가 이런 코드를 넣었다면 수정하실 수 있겠습니까?
CSS로 잘 만든는 것은 무엇을 의미하는가?
CSS가 쉽지 않다는 것은 누구나 알고 있습니다. 보통 CSS가 레이아웃을 잡는데 “잘 만들면” 더 생산적이고 편하고 빠르다라는 말을 하는 분도 있습니다. 물론 실력이 있어서 브라우져 핵을 자유롭게 쓰는 분일 것입니다.
여기서도 문제는 있습니다. 브라우져 핵이 필요한 CSS파일을 누군가는 만들어야 합니다. 프로그래머? 디자이너? 컨텐츠 제작자? 만약 웹디자이너가 한다고 하면 기업에서 면접을 볼 때 브라우져 핵을 하지 못하면 뽑지 말아야 하나요?
XHTML은 1.1버젼에서 HTML4.0과 양립할 수 없습니다. 어떤 해결방법이 있을까요? 전 현실적인 문제로 인해 찾을 수가 없습니다.
난 XHTML1.1+CSS2.0을 반대하는 것이 아니다. 하지만 불편한걸 어쩌나?
CSS를 설명하는 블로그를 보면 보통 팁으로 설명합니다. 브라우져 핵도 마찬가지구요. w3schools.com은 CSS 초기버젼을 잘 설명해 주고 있습니다.
제가 의문을 제기하는 것은 CSS 레이아웃에 한정하는 문제입니다. 어떤 분은 가능하다, 어렵지 않다 라고 합니다. 우리는 CSS로만 레이아웃을 할 때 아래와 같은 기능을 해야 합니다.
- 모든 브라우져에서 같은 디자인이 출력되어야 한다.
- 디자이너가 디자인 한 것 그대로가 화면에 나와주어야 한다.
- CSS는 화면 크기를 변경했을 때 원하지 않는 동작을 하면 안된다.
- 가로 길이가 %로 정해졌을 때도 3번은 지켜져야 한다.
제 경험으로는 위의 것을 CSS 레이아웃만으로 구현하는 것은 가능은 할 지언정 절대 쉽지 않습니다.
<span style="font-weight: bold">이렇게 되면 하겠다.</span>
아래의 것들이 완벽히 작동된다면 CSS 레이아웃은 사용할 가치가 충분하지 않을까 합니다.
- 브라우져별 공통의 CSS 레퍼런스가 존재하고, 그것이 제대로 작동된다.
- 1번이 안된다면 공통 스타일 파일이 존재하고, 파일 레퍼런스만 지키면 대부분 브라우져에서 작동한다.
이 글은 Jay G님의 글에서 반론을 제기받고 답변으로 쓴 글입니다.
Comments