ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • 웹폰트와 구글폰트
    카테고리 없음 2013. 10. 24. 00:50

    구글에 의존적인 것은 안드로이드 스마트폰 뿐만이 아니다. 내 블로그도 그렇다. 블로그에서 사용하는 폰트는 나눔명조를 사용하고 있는데, 인터넷 익스프롤러에서 사용하려고 ttf를 끌어다쓰기위해 Google Fonts를 이용하고 있다.

    원래는 티스토리 스킨 업로드 공간에 올려둔 웹폰트를 썼었다. 그런데 최신 익스프롤러에서는 eot, woff 등의 웹폰트가 적용이 안되는 것이 아닌가? ttf를 링크해야 적용이 되는 것 같은데, 티스토리의 스킨 업로드는 20MB가 제한이라 폰트 하나에 몇 메가씩 하는 ttf 형식을 올릴 수가 없었다. 결국은 구글 폰트를 링크하는 방식으로 손을 봤다. 아래처럼 웹폰트를 등록한다.

    @font-face {
      font-family: 'NanumMyeongjoWeb';
      font-style: normal;
      font-weight: 400;
      src: url('./images/NanumMyeongjo-Regular.eot');
      src: url('./images/NanumMyeongjo-Regular.eot?#iefix') format('embedded-opentype'),
           url('./images/NanumMyeongjo-Regular.woff2') format('woff2'),
           url('./images/NanumMyeongjo-Regular.woff') format('woff'),
           url(//themes.googleusercontent.com/static/fonts/earlyaccess/nanummyeongjo/v2/NanumMyeongjo-Regular.ttf) format('truetype');
    }
    

    구글 폰트를 이용하면, 단순히 내 css 파일에서 한줄만 입력하면 끝나기 때문에 간편한데 이게 좋은 점의 끝이 아니다.

    1. 내 호스팅 서버에서 폰트를 읽어가지 않으니까 트래픽이 줄어들고,
    2. 다른 블로그에서 링크했을 지도 모르는 구글 폰트가 캐시에 남아있을 수 있다. 즉, 웹폰트를 더 빨리 로딩될 확률이 높다.

    이렇게 좋은 구글폰트라면 어서 eot와 woff도 구글폰트 링크로 바꿔야할텐데 아직은 그냥 내버려두었다. 구글폰트를 이용한 웹페이지들이 접속하고 1–2초가 지나야 글씨가 나타나고 있기 때문인데… (내가 접속하는 환경에서) 이유는 잘 모르겠다. 일단 국내 인터넷 조건이라면 국내 호스팅 업체가 훨씬 빠를테고. 그리고 티스토리는 내가 호스팅 업체에 트래픽 만큼 돈을 내는건 아니니까 관련 없기도 하다.

    댓글

Copyright 2022 JY