30일, 30개의 생각 1. 웹에서의 글꼴 선택과 타이포그래피 | 2009/02/14 23:31

이번에 개인 프로젝트인 drawStories를 진행하면서 글꼴에 대해 세 번 정도의 실험을 했다ㅡ실험이라기보단 글꼴을 여러 개 바꾸어 보는 것이었지만ㅡ 실험의 주제는 '웹에서의 산세리프체 사용과 안티앨리어싱' 이었다. 물론 제목의 경우에는 크게 상관이 없다. 스크린 상에서도 디테일이 정확히 살아 잘 만들어진 폰트를 사용했을 시 뿌듯한 느낌마저 난다.

하지만 문제는 본문이다. 컴퓨터 그래픽스에서는 곡선이나 디테일한 곳을 렌더링할대 재기Jaggy가 생기는 문제를 해결하기 위해 안티-앨리어싱Anti-Aliasing이라는 기법을 사용하여 왔다. 컴퓨터를 하는 사람은 익숙한 기법으로 주로 배경과 오브제 사이를 자연스럽게 해주는 기술이다.

이 안티앨리어싱의 경우 제목체에서는 무리없이 작동한다. 픽셀 특유의 까끌까끌함을 잘 없애준다. 하지만 본문체의 경우에는 이 안티앨리어싱이 걸림돌로 작용한다. 게다가 운영체제별로 폰트를 렌더링하는 방식도 다르다. 윈도에서 잘 맞추어 온 타입 세팅이 맥에서는 완전히 다르게 나온다. 게다가 이미지로 만들 수도 있는 제목체와 달리 본문은 각자의 유저가 가지고 있는 폰트로 제각각 렌더링한다. 해상도는 또 어떤가? 1900*1200 풀HD로 작업하며 웹서핑을 하는 사람도 있고, 아직도 800*600으로 겨우겨우 네이버에 들어오는 사람도 있다. A 사이즈나 레터 사이즈에서 작업하던 그래픽 디자이너에겐 너무나도 생소하고 벽에 부딫히는 부분이 아닐 수 없다.

하나하나씩 짚고 넘어가 보자. 먼저 안티앨리어싱의 경우 브라우저마다, 운영체제마다 렌더링하는 것이 너무 달라서 먼저 이 방식을 통일할 필요가 있다. 혹은 이것이 어렵다면 아티스트 프로젝트로 브라우저를 만들거나, 혹은 '어디서나 똑같이 보이는 웹사이트'를 만들어봐도 좋겠다. 또한 CSS에서 안티앨리어싱을 조정하는 기능이 추가되어야 한다. 물론 이것도 OS에 따라 다르기는 하지만ㅡMS의 클리어타입은 내가 생각하던 안티앨리어싱의 문제를 인식을 했는지 뭉개지지 않는 글꼴에 최대한 초점을 맞춘 듯 보이고, 맥의 경우엔 조금 더 풍부한 안티앨리어싱을 보여주지만, 산세리프 본문체의 경우 디테일이 죽어버리는 단점이 있다.ㅡ조금 더 디자이너의 의도대로 작업을 진행하는데 도움이 될 것이다.

폰트가 유저의 컴퓨터에 깔려 있지 않아 깨지는 경우에는 어떨까? 웹 디자인에 나른 일가견이 있는 사람들은 웹폰트의 완벽한 유연성을 강조한다.
예를 들면

body
{
  font-family:sans-serif
}

와 같은 식이다. 이 CSS 코드는 브라우저에게 유저가 기본으로 산세리프체 중 하나를 정해놓은 것으로 렌더링한다고 명시하는 것이다. 글쎄, 브라우저에 기본 폰트로 자신이 좋아하는 폰트를 정해놓을 수도 있고 웹이 가지는 미디어의 유연적 특성상 그렇게 하는 것이 미디어를 올바르게 사용하는 것일수도 있다. 하지만, 기존에 폰트를 다루어 온 그래픽 디자이너들을 설득하기는 쉽지 않아 보인다. 나 역시 창작물의 컨셉에 있어 글꼴의 선택 권한과 적용이 굉장히 중요하다고 믿는 사람인다. 이런 상황에서 나는 무엇을 할 수 있을까? 일단은 이러한 디자이너들의 반응을 인터뷰하는 것이 추후 계획이 될 수 있겠다.

해상도는 어떨까? 역시 가변적인 웹 환경의 특징을 그대로 보여준다. 점점 큰 화면으로 환경이 변하지만 이것을 활용하지 않는 것도 큰 낭비이고, 가독성이 떨어지게 글줄을 무리하게 넓히는 것도 타이포그라퍼에겐 테러 행위이다. 이때야말로 조금 균형을 지켜야 할 부분이다. 첫 번째 방법으로는 어떤 환경에서도 모든 화면을 사용하게 만드는 것이다. 가변적 스크린 활용이라고 볼 수 있을텐데 이것은 기술적 부분이 조금 뒷받침되야 한다. 지금 당장 생각나는 것으로는 필요한 부분을 모듈화하여 크게크게 배치하는 것이다. 그러면 일단은 모든 스크린에서 보이면서도 가독성을 유지할 수 있을 것이다.

마지막으로 안티-앨리어싱을 자세히 조정할 수 있도록 해야 할 것이다. 흔히들 그래픽 디자이너/타이포그래퍼는 변태라고들 한다. 그런 변태들의 욕구(?)를 웹에서 충족하기 위해서는 브라우저/플래시 단에서 안티앨리어싱을 조정할 수 있도록 해야 한다. 그리고 그래픽 디자이너는 그러한 조정법에 익숙해져야 한다. 스크린에서의 가독성이 떨어지는 것은 다른 것이 아니라 그래픽 디자이너의 손길이 미칠 수 없는 부분의 것이기 때문이다. 그래픽 디자이너가 맘껏 스크린에서 실험할 수 있으려면 그런 낮은 단계에서의 지원이 필요하다.

TAG : , ,






media art vjing Flash 미디어아트 vvvv 30개의생각 Processing typography Graphic Design xna ccrealmixter creative commons typesql 정재형 interaction Bon Jovi 희망청 as3 adaa data visualization Seoul Media Jam 2nd DirectX composition randomwalks interactive vjing project randomwalks wearable bust this ccSalon 미디어아트워크샵

메뉴 (92)
Media Art (35)
Graphic Design (6)
Flash (6)
Works (34)
Experiment (3)
Music (6)

Recent Articles : 30일, 30개의... (6) // 30일, 30개의... (1) // 30일, 30개의... (1) // 30일, 30개의... (2) // 30일, 30개의... //
Recent Replies : The basis of stu... writing jobs 07/22 // This is the grea... ringtone 07/20 // Thanks for nice... certified resume writers 07/14 // I guess, this in... book report help 07/14 // Thank you for su... dissertation 07/14 //
Recent Trackbacks : US free slot cas... US free slot cas.. 10:51 / USA players onli... USA players onli.. 10:49 / Free deal or no... Free deal or no.. 10:48 /
Site Link : HYPERCORTEX.   it's the re...   take-off.   venux.   피 패러다임.   해멍대발견!!!.  

Total 117065   Today 13   Yesterday 13