영삼넷IT 강국 = 김영삼 블로그에 오신걸 환영합니다.

웹폰트란 개념이 나온 이래로 어느새 인터넷 깜찍글꼴이 대거 등장하게 된 그때 그시절.
하지만 웹개발자는 너무나 슬플 수밖에 없는게 바로 IE에서만 지원한다는거.
그래서 아예 웹폰트 쓰지 말자는 웹표준 프로그래머들의 목소리가 높아지는 가운데...

하지만, CSS3가 아직 확정도 안된다는 제안 중 TTF 파일을 지원하는 브라우저가 속속 등장하였으니... 이제 웹폰트의 갈망을 씻어 던지긴 개뿔 저작권 문제는 아직도 난항.

어쨌든, IE는 뭐 상관없고 최신 브라우저를 사용한다면 웹폰트를 사용하고자 하는 갈망을 씻어낼 수 있는 좋은 기회가 될 것입니다.
네. 최신 브라우저입니다. 단, IE는 빼고.
IE는 4 이상이면 됩니다. 하지만...
Firefox 3.5 이상,
Opera 10 이상,
Safari 3.1 이상,
크롬은 아직 지원안되고 대신 베타 3에서 수줍게 지원.

흠.. 근데 여기 님들중에 브라우저 옛버전을 고수하는 분은....응?

어쨌든, 본론으로 들어가서, 웹폰트를 설정하게 해드립니다.
잘 알려진 무료 폰트인 엔터 튤립체로 그 예를 들어봅니다.

    @font-face {
                /* IE를 위한 배려는 개뿔 제일 귀찮아. */
        font-family:TULIP09;
        src: url('typoenter_090201_TULIP09.ewf');
                /* 그외 브라우저는 TTF 파일 정하고 포멧 정의해야. */
        src: local('TULIP09'),
        url(typoenter_090201_TULIP09.ttf) format('truetype');
    }
    body div{font:9pt TULIP09,gulim,sans-serif;}

IE의 경우는 뭐 많이들 널리고 널린 경우니까 설명은 구찮아서 패스.
비IE의 경우는 먼저 글꼴 이름을 클라이언트 컴퓨터에서 불러옵니다.
만약에 없다면, 서버에서 TTF 파일을 불러오죠. 그럼 끝입니다. 참 쉽죠~잉.

근데.. 문제는 이쇼키는 IE에서 굵게는 지원되지만 그 외에서는 지원 안해줍니다.
그래서 굵게 표시되는 글꼴을 또 따로 정의해 줘야 하죠.
@font-face {
    font-family: 'Droid Sans';
    src: local('Droid Sans Bold'),
        local('Droid Sans-Bold'),
        url('/shared/fonts/DroidSans/DroidSans-Bold.ttf') format('truetype');
    font-weight: bold;
}
이런 식으로요. 하지만 예제에 사용한 엔터튤립은 따로 굵게 표시하는 글꼴이 없어서 안타깝게도 굵게 표시하는건 물건너갔군요..

결국 팁을 줘도 욕먹는 케이스가 되겠습니다. 응?

어쨌든, 뭐 어느정도 웹폰트에 대한 욕구는 씻을 수 있지만, 뭔가 2% 부족한 이런..
흠.. 아직 확정이 되고 어느정도 자리가 잡혀야지 크로스 브라우저에 대한 웹폰트가
성행될 것 같은게 그걸 어느천리에 기다려.................................

링크 #1은 제 팁의 원문이 되겠으며, 라이센스 또한 원문에 따릅니다.
그리고 링크 #2는 제가 직접 엔터튤립체를 사용해 테스트해본 페이지입니다.

P.S 아놔 EWF라는 듣보잡 확장자가 IIS에 걸려가지고 MIME 헤더 등록으로 겨우 해결.(IIS 7.5)