국내의 많은 웹페이지들은 고정된 넓이값을 가지고 있다. 아무래도 웹디자인의 편리성이 이유일 것이다.

이러한 고정된 넓이값의 웹페이지들은 1024×768의 모니터 해상도가 90%를 육박하는 국내 웹 현실에서는 그다지 문제되지 않을 수 있다. 하지만, 올해초 W3CShool 통계에 의하면, 아직도 800×600의 해상도가 29%를 차지하는 미국에서는 꽤 큰 문제가 발생할 것이다.

단적으로 나는 노트북과 데스크탑에서 1280×1024 해상도를 사용한다. 대부분의 국내 웹사이트들이 1024×768의 해상도를 기준으로 제작되었기에 그다지 웹서핑에 문제가 없지만, 한쪽엔 내용들이 잔뜩 모여있고 다른 한쪽엔 여백들만 횡하게 있는, 800×600 해상도를 기준으로 제작된 해외 사이트를 방문하다보면 여간 불편한 게 아니다.

사실, 기존에 사용하던 내 블로그 테마를 수정하게 된 이유 중에 하나가 바로 800×600을 기준으로 레이아웃을 짠 블릭스 테마가 너무 횡한 느낌이었기 때문이다.

솔직히 고정된 넓이값에 비해 유동적인 넓이값으로 웹페이지를 제작하다보면, 웹디자인 측면에서 여러가지 제약이 생길 수 밖에 없다. 특히 1픽셀의 아름다움(?)을 강조하는 국내 웹사이트들에게서 유동적 size는 먼나라 이야기일 수도 있다.

물론 아직 모든 수정을 완료하진 못했지만, 이번에 고정된 넓이값의 CSS를 유동적 넓이값으로 수정하면서 많은 것을 느꼈다. 특히, 디자인적인 문제들은 기존의 테이블 기반의 레이아웃과 정반대로 사고함으로써 어느정도 해결할 수 있다는 것을 알게 됐다.

웹시안 작업을 하면서 사용하는 포토샵과 일러스트레이터과 애니메이션이나 네비게이션을 제작할 때 사용하는 플래시의 공통점은 무엇인가? 바로, 레이어 개념이다.

퍼즐 맞추기와 같은 테이블 기반 레이아웃의 사고를 탈피해서 포토샵, 일러스트레이터, 플래시에서 작업할 때처럼 CSS를 기반으로 레이어로 웹페이지의 레이아웃을 짜는 것이다. (말이 조금 복잡하넹)

유동형 레이아웃을 처음으로 시도해본 나이지만, 웹페이지는 사용자 측면에서의 디자인되어야 한다고 생각한다. 이미 RSS를 통하여 웹사이트를 굳이 방문하지 않아도 컨텐츠들을 구독할 수 있다. 또한 파이어폭스에서는 사용자 정의 CSS를 통하여 기존의 웹사이트를 전혀 다른 모습으로 볼 수 있다. 조만간 웹페이지의 디자인에 대한 개념이 바껴질 때(Web2)가 올 것이다.

더 많은 유동적인, 고정된 웹페이지 레이아웃에 대한 논의들은 Fixed Fashion by Jeremy Keith, Liquid vs. Fixed by Garrett Dimon, More on Fixed Widths by Richard Rutter, Arguments For Flexible Webpage Layouts by Mike Davies를 통해서 확인할 수 있다.