TTF웹폰트에 대해서

웹폰트라고 하면 IE의 eot를 생각하시는 분들이 많을 겁니다. 그도 그럴 것이 '웹폰트'라는 건 IE에서만 eot로 계~속 지원되었으니 말이죠. 그런 웹폰트를 현재는 오페라, 파이어폭스, 크롬, 사파리 최신버전에서 사용할 수 있습니다. eot형식이 아닌 TTF형식으로 말입니다.

제가 처음 TTF웹폰트에 대해 알게 된 건 오페라10 알파버전에서 막 지원되었을 때였습니다. 지원이 된다고 했을 때 저는 믿기지 않았지만 예제를 보고 대충 따라 했더니 실제로 되더군요.
그 뒤부터는 계속 블로그에 TTF웹폰트를 적용시켰습니다. 현재는 렉시굴림을 사용하고 있습니다.

TTF웹폰트를 사용하려면 먼저 폰트를 적당히 어딘가에 올린 뒤 CSS에 아래의 내용을 추가시키면 됩니다.

그냥 eot웹폰트 적용하는것과 거의 같다고 보면 되죠. 이름(렉시굴림)과 경로지정(./images/LEXIGULIM.TTF)만 잘하면 됩니다. 이 이후로는 eot적용과 별반 차이가 없으므로 넘어가겠습니다.

TTF웹폰트를 적용시켜서 다른 브라우저에서는 폰트가 나오지만, IE에서는 나오지 않는 문제가 발생해서 어떻게 하면 될까 하다가 아래와 같이 하니 해결이 되더군요.

간단하게 eot를 아래에 붙여주기만 하면 끝이었습니다. 물론 TTF웹폰트와 eot웹폰트의 이름은 달라야겠죠.

이렇게 TTF와 eot를 사용해봤더니 각각 장단점이 있더군요. 아래 표를 보시면 이해가 빠르실 겁니다.

	TTF	eot
장점	변환이 필요 없다 많은 웹브라우저에서 지원한다.	파일크기가 매우 작다 원하는 주소에만 적용이 가능하다
단점	파일크기가 크다 암호화되지 않는다	번거로운 변환이 필요하다 IE를 제외하면 지원하는 브라우저가 없다.

TTF는 변환 없이 그냥 웹 상에 업로드 하는 것만으로도 사용준비 완료이지만, eot는 MS의 Weft라는 프로그램을 이용해서 변환시켜야 합니다. 그리고 TTF의 최대강점은 eot와 다르게 여러 브라우저에서 지원한다는 점이죠.

하지만 TTF는 파일크기가 너무 큽니다. 영문폰트는 그나마 작은 편이지만 한글폰트는 영어와 한글을 모두 담아야 하기 때문에 벌어지는 현상이죠. 지금 적용한 렉시굴림도 2메가가 약간 넘는 크기입니다.(이것도 그나마 작은 편이죠ㅠㅠ) 파일크기가 크면 그만큼 웹페이지 접속에 시간이 더 걸리기 때문에 상당한 단점이라고 볼 수 있습니다. 반면에 eot는 변환하면서 크기가 매우 작아지기 때문에 속도는 빠르죠.

그리고 TTF는 암호화 되어있지 않습니다. 지금 인터넷임시파일 폴더를 뒤져보시면 아실 겁니다. 따라서 상용폰트로는 사용 불가능합니다. eot는 변환하는 도중에 사용할 사이트주소를 입력해서 그 이외의 사이트에서는 적용되지 않도록 합니다. 그렇기에 싸이월드에서 판매 할 수 있는 것입니다.

오페라에서는 안보이는 eot-_-+ IE점유율이 떨어지면 싸이월드의 수익도 떨어질것이 분명합니다(?)

이렇게 TTF와 eot모두 부족한 점이 많습니다. 아직 웹폰트는 갈 길이 멀죠ㅎㅎ TTF웹폰트에 대해 궁금하신 분들이 꽤 계셔서 일단 제가 아는 내용을 적었는데 의문이 풀리셨는지 궁금하네요:)