미생체 웹폰트 적용하기

 

 

 

다음에서 미생체를 완전한 자유 라이센스로 공개했다. 사용처나 용도에 관계없이 완벽하게 무료다.

홈페이지 메인 폰트로 사용하긴 힘들겠지만 필요한 곳에 웹폰트로 적용해볼까 해서 방법을 찾아 보았다. (PC용 폰트는 여기에서 직접 받으면 된다)

 

미생체의 용량은 12MB 정도라서 이대로 웹폰트로 적용할 수는 없고 변환을 해야 하는데, 미생체 소개 페이지에 웹폰트로 이미 적용이 되어 있어서 그냥 소스를 좀 살펴보고 파일만 뽑아왔다. 어차피 프리 라이센스니까 괜찮겠지. 내가 맥을 사용하는 관계로 압축파일이 정상적으로 풀리지 않을 수 있는데 그런 경우에는 반디집을 사용하면 된다.

다운로드

 

(+ 2월 26일 수정)
실제로 테스트를 해보니 다음에서 직접 뽑아온 웹폰트로는 홈페이지 적용이 되지 않는 것 같다.
아래의 CSS코드는 그대로 써도 되겠지만 파일 다운로드 링크는 제거했다.
대신 이 블로그의 포스트를 참조하여 웹폰트를 다운로드하면 된다. http://martian36.tistory.com/1449

적용 방법

웹폰트 파일을 적당한 곳에 업로드하고 <style> </style> 블록 안에 아래와 같이 입력한다.

@font-face {
	font-family:SDMiSaeng;
	font-style:normal;
	font-weight:normal;
	src:url(http://업로드된 주소/SDMiSaeng.eot);
	src:url(http://업로드된 주소/SDMiSaeng.eot?iefix) format('embedded-opentype'),
	    url(http://업로드된 주소/SDMiSaeng.woff2) format('woff2'),
	    url(http://업로드된 주소/SDMiSaeng.woff) format('woff')
}

적용결과

네가 만약 오후 4시에 온다면, 나는 3시부터 행복해지기 시작할거야.
If you come at four in the afternoon, I'll begin to be happy by three.

적용결과 (이미지)

웹폰트가 제대로 적용되지 않는 환경을 위한 이미지 버전