Web Font

웹페이지에서 사용하기 위한 폰트를 의미하며, Truetype(ttf), Opentype(otf), Embedded-Opentype(eot), Open Web Font Format(woff)등의 확장자를 가짐.

사용하기(구글 웹 폰트)

@import url(http://fonts.googleapis.com/earlyaccess/hanna.css);

h1 {
  font-family : 'Hanna', sans-serif;
}

웹폰트 url을 import해 주고, font-family에 폰트 명을 적어주면 된다.

웹 폰트 만들어주기

1. 가지고 있는 폰트를 웹폰트로 만들어준다.
   • 각 브라우저에서 사용 가능한 웹 폰트 확장자가 다르다.
   • IE 6~9에서는 EOT 지원, 그 이후는 WOFF를 지원하는 등.
   • 그러니, 가지고 있는 폰트를 woff, eot 등으로 변환해준다.
2. css로 font-family를 만든다.

   @font-face {
      font-family:Aspirin;
      src : url(location/좋은아스피린.eot) format('embedded-opentype');
      src : url(location/좋은아스피린.woff) format('woff');
   }
   

3. 쓴다.

   body {
    font-family : Aspirin, serif;
   }