'제어판>>글꼴'을 연후에 TTF 파일을 드래그해서 넣으면 됩니다
Windows 의 Fonts 에 직접 넣기도 하지만 위의 방법을 추천합니다
[포토샵에서 웹폰트용 TTF 사용]
웹폰트 생성용으로 제작된 TTF 파일은 특정 포인트로 제작됩니다.
이는 웹페이지 상에 임베드되어 사용될 수 있도록 하기위해 가능한 경량으로 만들필요가 있었기 때문입니다.
따라서 웹폰트용 TTF파일을 포토샵에서 사용하려면....
웹폰트의 포인트(pt)에맞춰 포토샵에서 픽셀(px)을 정의하면됩니다
이때 aa(안티얼라이싱)은 none 으로 설정해야 합니다.
........................................................................................
7pt 웹폰트용 TTF >> 10px aa(안티얼라이싱)은 none 설정
8pt 웹폰트용 TTF >> 11px aa(안티얼라이싱)은 none 설정
9pt 웹폰트용 TTF >> 12px aa(안티얼라이싱)은 none 설정
10pt 웹폰트용 TTF >> 13px aa(안티얼라이싱)은 none 설정
11pt 웹폰트용 TTF >> 15px aa(안티얼라이싱)은 none 설정
12pt 웹폰트용 TTF >> 16px aa(안티얼라이싱)은 none 설정
15pt 웹폰트용 TTF >> 20px aa(안티얼라이싱)은 none 설정
........................................................................................
이보다 큰 서체들은 적절히 픽셀수를 조정해서 사용해보세요
웹폰트제작용 TTF는 지원되는 특정 픽셀에서 정상출력됩니다.
[무료 웹폰트 다운로드 받기]
....................................................................................
1. http://soyafont.com (바른체,다듬체,나눔체,곧은체...etc.)
2. http://typoenter.net
(풀잎체,갈입체,솔잎체...)
3. http://font4u.com
(참사랑,유우병,박스체 등 )
4. http://kCOOKIE7.ivyro.net/
(쿠키폰트 시리즈)
5. http://flancho.ce.ro/
플란초 외 만년필, 라일락(웹폰트만)
6. http://nontoxic.cherilove.co.kr/
(nontoxic 시리즈)
한글폰트는 배포중지함 , 영문비트맵 nontoxic시리즈 배포중
7.
http://jeongjache.wo.to/ (김어진 정자체,엽토체)
8.
http://chungyeori9.wo.to (충여리체)
9. http://poty.pe.kr (포티정갈체,캐모마일체,펜넬체)
10.
http://white-day.pe.kr (화이트데이체)
11. http://ttcgi.com (티티보드-티티체)
12.
http://ifshop.fontbox.net/ (개나리, 신나리, 진달래체...etc.)
....................................................................................
[HTML 에서 웹폰트(eot등) 적용방법]
웹폰트의 확장자는 WEFT 프로그램으로 생성한 EOT파일이 대표적
입니디만 gwf,smf,mwf 등등 제작업체마다 각기 다를수 있습니다.
(1)웹폰트(eot 등등)를 자신의 홈페이지 계정에 올립니다.
(2)웹폰트를 html 내에서 스타일 시트로 정의합니다.
...............................................................................
...............................................................................
아래는 티티보드에서 배포하는 '티티체'를 등록하는 예입니다.
...............................................................................
...............................................................................
font-face 앞에 @가 붙는 것과 폰트의 경로를 지정하는 src:url(폰트url); 부분을 제외하고는 일반적인 스타일시트
정의부분과 동일한 문법이 적용될 수 있습니다.
.tt1 과 .tt2는 스타일시트의 class 정의인건 모두 아실듯...
class 적용은 원하는 테그에 class="클래스명" 추가하면 됩니다.
...............................................................................
tt1 으로 정의된 붉은색의 9포인트 티티체
tt2 으로 정의된 녹색의 9포인트 티티체
...............................................................................
[!]웹폰트 사용상의 주의점
웹폰트는 웹상에 존재하는 폰트를 html 에 첨부하는 형태이므로
많은 수의 웹폰트를 한 html 에 등록하는 것은 좋지않습니다.
가능한 2~3개 정도내에서 웹폰트를 등록할 것을 권합니다.
또한 같은 웹폰트파일 등록시 동일한 방식으로 url을 설정하세요
아래처럼 하나는 전체경로를 하나는 상대경로 형태로 등록한다면
웹브라우저에서 서로 다른 파일로 캐싱이 되어질 수 있습니다.
즉, 서로를 다른 파일로 인식하게 된다는 뜻입니다.
............................................................................
@font-face{font-family:tt; src:url(http://home.com/TTche.eot);}
@font-face{font-family:tt; src:url(TTche.eot);}
............................................................................
추천 : 