작성일: 2011. 9. 2. 08:26 |
블로그를 운영하는데 있어서, 가장 기본이 되는 것중 하나는 바로 본문의 포스트입니다. (Article)
아무리 블로그를 열심히 꾸며봐야 블로그 본문 내용이 없으면 사실상 블로그라는게 있으나 마나이니까요...
그렇다보니 많은 분들이 블로그 본문 글을 열심히 쓰려고 노력하시는 경우가 많습니다.
그런데 정작 글을 쓰다보면 이건 왠지 글꼴이 별로인것 같아보이기도 하고, 왠지 가독성이 떨어져보입니다.
그래서 생각하게 되죠... '폰트'를 한번 바꿔볼까?... 라고 말이죠
하지만 보통 폰트라는 것을 바꾸려고 해도, 대부분은 블로그 자체적으로 지원되는 폰트 밖에 사용할수 없습니다.
물론 여러가지 다른 방법을 통해 폰트를 사용할 수는 있지만, (대표적으로 웹폰트)
직접 웹폰트에 대해 공부하고 이런 글을 쓰는건 참 힘든일이죠...
그래서 오늘은 간단히 웹폰트에 대한 정보와, 나눔 고딕등의 폰트를 별도로 업로드 하거나 할 필요 없이
블로그에서 간단히 적용하여 웹폰트로 사용하는 방법에 대해서 소개해드리겠습니다
굴림 12px 입니다
바탕 12px 입니다
돋움 12px 입니다
궁서 12px 입니다
나눔고딕 12px 입니다 |
웹폰트는?
웹폰트 적용 (나눔고딕) - 웹폰트 미적용 (굴림)
웹폰트는 말그대로 트루타입 폰트(TTF)를 인터넷에서 사용가능하게 변환하여 사용하는 폰트를 의미합니다
보통 PC에 있는 기본 폰트가 아닌 경우, 해당 폰트를 사용할때 그 PC에서 정상적으로 출력되지 않습니다.
이런 일을 미연에 방지하기 위해 폰트를 사용하는데, 일반적으로 만들어진 트루타입 폰트의 경우 용량이
큰 편에 속하기에 직접 업로드할 수가 없습니다. 그 대신 사용하는게 바로 '웹폰트' 입니다.
그동안 제일 잘 알려졌던 웹폰트는 바로 Internet Explorer 전용의 웹폰트인 EOT 였습니다.
하지만 최근들어 다양한 웹브라우저 호환성을 고려하는 만큼 다양한 웹폰트 확장도 등장하고 있습니다.
2009년 개발된 WOFF라는 웹폰트나, OTF 라는 웹폰트가 있는데요.
아쉽게도 이 모든 웹폰트들이 모든 브라우저에 대해서 확장성을 지니고 있지 않기에
IE와 크롬, 오페라 등 다양한 브라우저에 적용시키는게 그렇게 쉽지만은 않습니다
그러던 중 발견하게 된 간단히 웹폰트 적용하는 사이트
저도 최근까지 블로그를 갱신하면서 상단의 제목과 포스트 날짜에 대해서
깔끔하게 웹폰트를 적용하려고 이것저것 많이 알아보게되었습니다.
물론 예전같이 직접 EOT 웹폰트나, OTF 폰트 등을 찾아서 블로그에 적용시키려 했는데
전혀 다른 두 브라우저 (IE / 크롬)에 적용시키려하니 이게 막상 쉽지많은 않더군요.
둘다 지원하는 방법이 아예 없는 건 아니었지만, 방법이 복잡해서 사실상 거의 손을 놓고 있었습니다.
그러다가... 운좋게 한 사이트를 알게 되었습니다. 바로 소개해드릴 http://fontface.kr 이라는 곳입니다
fontface는 국내의 몇가지 대표적인 웹폰트들을 바로 사용 가능할수 있는 스크립트를 제공하고 있습니다.
대표적으로 '나눔고딕'이나 '나눔명조' '나눔손글씨' 등을 제공하고 있어서,
이런 글꼴들을 적용시키려는 분들에게 나름 괜찮은 사이트가 아닌가 싶더군요.
간단히 나눔 고딕 (웹폰트) 적용하기
1. 먼저 필요한 폰트를 위 fontface에서 복사하여 자신의 블로그 상단에 붙여 넣습니다.
2. <font face=@NanumGoothic"> 라는 <font> 테그를 사용하거나
<div id="yyy"></div> 테그등을 사용후
CSS로 yyy { font: NanumGothic } 등을 적용하여 해당 폰트를 사용합니다
3. 마지막으로 다양한 브라우저 (IE / 오페라 / 크롬 / 파이어 폭스) 등에서 테스트해가며 직접 확인하면 됩니다.
간단히 웹폰트 적용하기...
아마 보통 웹폰트를 적용하는 방법은 복잡하겠지만
이렇게 스크립트를 이용해서 유명 웹폰트를 간단히 적용시킬 수 있습니다.
그동안 굴림 글꼴등으로만 글쓰는게 지겨워 지신 분들이라면,
지금 이곳 http://fontface.kr 의 스크립트를 참조하셔서 다양한 웹폰트를 적용시켜보세요 ^^
