웹폰트 우리새봄체, 블로그에 적용하니

어제 오후 완성형 벡터스크린 폰트 개발 기업 렉시테크로 부터 메일로 전달된 웹폰트 '우리새봄체'를 블로그에 적용해 보았습니다.

블로그에 웹폰트를 적용하는 과정은 첨부해 보내준 웹폰트 적용 가이드에 따라 별다른 어려움 없이 적용할 수 있었지만 블로그의 사이드바 콘텐츠 폰트까지 동일하게 적용해 일체감을 살리기 위해서는 스타일시트(CSS) 일부를 약간 수정하는 작업이 필요하기도 했었습니다.

우리민족에 한글의 자부심을 고취시키고 한글문화 창달을 위해 앞장서서 노력하는 폰트개발 기업 ‘렉시테크’에서 제공하고 있는 웹폰트는 ‘우리바탕’부터 지금 블로그에 적용시킨 ‘우리새봄’에 이르기까지 7종이 있지만, 나름 가독성과 감성적 미려함이 살아있는 웹폰트 ‘우리새봄’체가 마음에 들었습니다.

우리새봄 웹폰트 블로그 적용 모습

하지만 ‘우리새봄’체의 경우는 제목용 혹은 시니어세대를 위한 본문용 서체로 제작된 것으로, 명조체와 고딕체의 중간형태를 띄기 때문에 제목이나 본문 어디에서나 잘 어울리지만 블로그 포스팅에 있어 본문의 특정 구문을 강조할 경우, 강조하지 않은 본문과의 구분이 명확하지 않아 다른 색상이나 크기로 구분해야 한다는 것이 적지 않은 아쉬움으로 남기도 했습니다.

다음으로 남은 과제는 웹폰트의 경우 마이크로소프트(MS)의 인터넷 익스플로러(IE)만 지원하므로 파이어폭스나 구글크롬 사용자를 고려해야 했습니다. 인터넷 익스플로러(IE)를 기준으로 보기 좋게 하려는 마음이 앞서 우리새봄 웹폰트의 크기를 조정하게 되면 타 브라우저에서는 보는 블로그의 대체폰트의 폰트크기가 달라져 전체적인 조화가 흐트려질 수 있고, 그것으로 인해 레이아웃이 깨어지는 현상이 생길 수 있습니다.

그러므로 가급적 브라우저 상호 호환을 고려하여, 타 브로우저로 전환해 웹폰트 적용결과를 꼼꼼히 모니터링한 다음 가장 최적의 폰트사이즈를 찾아 대입하고 웹폰트를 인식하지 않는 브라우저에서 편안한 가독성을 유지할 수 있도록 대체 폰트를 적용시켜 놓는 것도 꼭 잊지 말아야 합니다. 참고로 IE6.0 버전에서는 클리어타입이 적용되지 않아 웹폰트의 가장자리가 깔끔하게 표현되지 않는 현상을 보이기도 했습니다.

현재 디자인로그 블로그에 적용된 웹폰트는 '우리새봄'으로 12px과 13px의 폰트 크기와 줄 간격 170%를 적용시킨 상황이며, 파이어폭스. 사파리. 구글크롬 그리고 애플의 맥 사용자를 위해 대체폰트로 애플고딕(Apple Gothics)이 적용되도록 CSS를 조정해 놓았습니다.

계속해서 우리새봄 웹폰트 적용으로 좀 더 개선된 블로그 콘텐츠의 가독성을 확보하기 위해 스타일시트(CSS)를 편집하여 변화를 살펴 보고 있지만, 웹폰트가 적용된 블로그의 현재의 느낌도 개인적으론 그다지 나쁘지 않은 것 같아 일단은 만족해 하고 있습니다. 그러나 독자들과 방문자들은 어떨지 모르기 때문에 블로그에 웹폰트 적용 전과 적용 후의 느낌을 댓글을 통해 들을 수 있었으면 하는 바람입니다.

혹시 블로그를 찾아주시는 방문자와 독자분들께서는 우리새봄 웹폰트가 적용된 후 불편한 점이나 개선되었으면 하는 점이 있으면 댓글을 통해 아낌없는 조언을 해주시길 부탁합니다. 여러분의 조언을 바탕으로 어느 정도 블로그의 웹폰트 적용이 안정이 되면 웹폰트와 관련하여 유익한 정보를 공개하여 함께 공유할 수 있도록 마련하겠습니다.

아울러, 지금까지 웹폰트 사용과 관련하여 액티브X 등 인터넷 브라우저간 지원 문제로 사용자들의 관심과 사랑을 많이 받지 못했지만, 사용자들의 웹폰트 관련 기대 요구가 커지면 개발 기업들도 다양한 웹폰트 개발과 다양한 브라우저의 지원을 위한 발빠른 대응을 할 수 있지 않을까 하는 생각을 갖게 됩니다.