블로그 폰트 변경하기전에 생각해볼것들

블로그 폰트 변경

무슨 바람이 불어서인지블로그 폰트를 한번 바꿔보고 싶었다. 그래서 쉬울줄 알았다. '대충 뭐 검색하면 되지 않겠어~'는 무슨 개뿔~이다. 영 귀차니즘의 연속이었다. 문제가 여러가지 있는데 일단 보도록 하자.

첫째, 유저가 쓰는 브라우저 종류가 다양하다. 익스플로러, 파이어폭스, 사파리, 기타등등. 흔히 말하는 웹폰트라는EOT 파일은 다른 브라우저에서는 인식을 안한다는거.

둘째, 익스플로러9 버전은 EOT가 동작하지 않는다. WOFF를 사용해야 한다. 뭐이래?

셋째, 웹폰트 파일 용량이 크다. 그래서 블로그 로딩 속도 저하의 주요 범인이다.

참 여러가지로 짜증스럽지 않을 수 없다. 그래도 써야겠다면? 여기 잘 설명이 나와있는 다른분의 포스팅이 있다. -->http://einmong.egloos.com/5415221

남들과 다른 폰트를 다양한 유저와 브라우저에서 보여줄려면EOT(Embeded Open Type),WOFF(Web Open Font Format),TTF를 모두 지원해야 한다!

나름 이정도 코드 삽입까진 해봤다.

@font-face {
font-family: 'NanumBrushWeb';
src: local('NanumBrush');
src: url('./images/NanumBrushWeb.eot');
src: url('./images/NanumBrushWeb.eot?#iefix') format('embedded-opentype'),
url('./images/NanumBrushWeb.woff') format('woff'),
url('./images/NanumBrushWeb.ttf') format('truetype'),
url('./images/NanumBrushWeb.svg#svgFontName') format('svg');
}

웃긴건 이렇게 블로그에웹폰트 적용하는법은 배웠는데 실상 쓰기는 모빌리스에서 제공하는 웹폰트를 썼다는거. 엄청 편하다!~

http://api.mobilis.co.kr/webfonts/

CSS에 한줄 적용하면 되고 또 기본 용량도 작아서 말이지.

@import url(http://api.mobilis.co.kr/webfonts/css/?fontface=NanumGothicWeb);

아 그래도 혹시 난중에 쓸지 몰라서 폰트변환 프로그램 첨부 해놔야징.