1. 글꼴(ttf → woff, eot) 변환 및 Dropbox 업로드 오랜만에 블로그 스킨을 바꾸려고 CSS를 편집하는데 유독 IE9, IE10에서만 웹폰트가 적용이 되지 않았다. IE9 이후로는 EOT뿐 아니라 WOFF도 지원한다는데 왜 안될까 고민하던 중 Google Fonts가 문득 생각나서 적용해보았다. 이상하게 CSS의 내용은 내가 작성한 것과 완전히 똑같은데 Google Fonts는 적용이 되고 내껀 안된다. 이런저런 테스트를 하다보니 IE9, 10에서는 티스토리 스킨에 업로드한 글꼴 파일을 불러오지 못하고 외부 링크에서만 제대로 읽어왔다. 그래서 클라우드 서비스를 활용하기로 했다. 웹폰트를 적용해봤던 적이 있다면 방법은 아주 간단하다. 외부에 woff 파일을 올리고 CSS @font-fac..

* 이 글엔 웹폰트 적용을 위한 다양한 코드와 그 코드를 사용하는 이유 등 다소 지루한 내용이 포함되어 있습니다. 과정이 아닌 결과만이 궁금하신 분은 이 글을 클릭하면 맨 아래 결론 부분으로 이동합니다. 블로그에 유용한 태그 3 - 티스토리 블로그에 웹폰트 적용하기 게시물에서 웹폰트 적용에 대해 이야기했다. 그때 이야기한 코드는 다음과 같다. @font-face { font-family: "글꼴 이름"; src: url('./images/글꼴파일.eot'); src: local('컴퓨터의 글꼴 이름'), url('./images/글꼴파일.ttf') format('truetype');} 위 코드를 CSS에 추가하거나 style 태그를 사용해서 HTML 문서에 삽입하면 해당 웹폰트를 사용할 수 있다. 먼저 ..

** 꽤 지루한 글이 될 것 같습니다. 웹폰트에 관심 없으신 분은 읽지 않으셔도 좋습니다. ** 이 글이 블로그에 유용한 태그라는 범주에 포함되는지 아닌지 모르겠다. 티스토리가 아닌 다른 블로그엔 적용해보지 않아서 사용할 수 있는지 없는지도 알지 못한다. 어쨌든, 티스토리 블로그 또는 개인 홈페이지에선 적용할 수 있다. 인터넷을 돌아다니다 보면 웹폰트라는 단어를 볼 수 있다. 쉽게 생각하면 싸X월드 글꼴과 비슷한 것이다. 도토리를 주고 글꼴을 구매하면 자신의 미니홈피를 표시하는 글꼴이 바뀐다. 이와 비슷하게 블로그 스킨(skin.html/ style.css)을 만들 때도 내 블로그를 표시할 특정 글꼴을 사용하도록 지정한다. 그러면 내 블로그를 방문하는 사용자의 컴퓨터에 내가 지정한 글꼴이 설치되어 있을 ..