메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의

기타 [특보] 웹폰트 만들기..

2002.03.06 01:48

mo2ni

웹 서핑을 하다가 좋을 것을 발견 했어요..
웹정체, 웹민체(폰트피아에서 유료로 파는 것) 같은 웹폰트를 직접 만드는 법입니다. ^^
아래글은 출처 사이트에서 그대로 퍼옴을 알려드립니다~
만약 글쓰신분이 원하시면 이글 지울테니 메일주세요~ ^^;

출처 : http://shelter.zoa.to/


일단 필요한 프로그램은 Font Creator Program과
Microsoft의 WEFT라는 프로그램입니다.

WEFT란 프로그램은 트루타입 폰트(확장자 .ttf)를
웹폰트(확장자 .eof)로 바꿔 주는 역할을 합니다.
하지만 현재 버전의 WEFT는 폰트의 이름이 한글일 경우
사용을 할수 없다는 치명적인 단점을 가지고 있습니다.

그래서 Font Creator Program으로 우선 폰트의 이름을 영문으로 바꿔줍니다.

폰트의 이름을 영문으로 바꿔주는건 의외로 간단 합니다.

Font Creator Program (Font Creator Program 3.0 - DOWN)을 설치 후, 실행 시킨뒤
웹폰트로 전환시키고 싶은 폰트를 엽니다. (File/Open)

Format/Naming을 선택하면 다음과 같은 창이 뜹니다.



폰트의 이름을 모두 영문으로 바꾸고 난 후에 저장해 주시면 됩니다.

저장한 후에는 폰트를 install 시키셔야 하는데,
Font Creator를 이용하여 install 하는 경우는 메뉴에 Font/Install을
선택 하면 자동으로 폰트 설치가 됩니다.

폰트의 이름을 영문으로 바꾸고 폰트를 설치 하셨다면,
WEFT (Microsoft Weft v3.0 - DOWN)을 설치 합니다.

처음에 Weft를 설치하면 이름과 E-mail등을 물어 보는데 무료이므로 그냥 원하시는데로
적어 주시면 됩니다. 그리고 Font DB를 만들겠냐고 물어볼때는 Yes를 선택하시면 됩니다.

그리고 나면 다음과 같은 화면이 나오는데,



그냥 컴퓨터 안에 있는 홈페이지의 위치를 적어주시면 됩니다.

Analyze Web Pages에서 skip analysis를 선택 하세요.
이 부분은 홈페이지에 어떤 폰트가 쓰여져 있는지를 검사하는 것인데.
만약에 홈페이지를 default폰트가 아니라 다른 폰트를 이용해서 만드셨으면
skip analysis를 선택하지 않으시면 웹폰트로 전환해야 할 리스트를 만들어 줍니다.

다음 창은 Fonts To Embed입니다.



여기서 Add를 선택해서 웹폰트로 만들고 싶은 폰트를 선택 하시면 됩니다.
저 같은 경우는 Subset을 따로 정해 줬습니다. 그게 귀찮으시면 subset 6번을 선택하고
Language에서 Hangul을 선택 하셔도 됩니다. 하지만 제가 웹폰트를 만들어본 결과
따로 Subset을 지정해 주는게 낳은것 같습니다. 참고로 Subset에서 지정해 주지 않은 문자를
웹에서 사용 하게 되면 그냥 네모 모양의 문자가 나옵니다.

제가 설정한: Subset Date

Subset을 지정해 주셨으면 다음 으로 넘어가서
Enter the location where the font objects will created란에
폰트를 저장할 위치를 설정합니다.
Font objects may only be used from pages under this root는 웹폰트를 사용할
루트를 지정해 주는 것인데

예를 들면, 웹페이지 주소가 http://shelter.zoa.to/lalalala/index.htm 이라면
루트는 http://shelter.zoa.to/lalalala로 설정해 주셔야 합니다.

저같은경우 루트 설정은
http://shelter.zoa.to/ (홈페이지 주소)
http://shelter.zoa.to/paint/ (오에카키 디렉토리)
http://shelter.zoa.to/zboard/ (제로보드 디렉토리)
file://c: (하드 드라이브)
file://c:My DocumentsNew_Home (홈페이지가 저장된 위치)
이렇게 설정을 했습니다.

그리고 다음을 설정 하신뒤
Publish Web Pages에서는 그냥 Do not upload modified pages to my server를 선택하세요

이렇게 하면 이제 웹폰트는 완성 된겁니다.

참고: http://www.microsoft.com/typography/web/


-mo2ni-
번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48031
1535 패스를 이용한 점선 그리기 [9] file 쭘's 2003.05.10 11026
» [특보] 웹폰트 만들기.. [18] mo2ni 2002.03.06 10992
1533 - 꼬냐닷컴 강좌 <한물체의 이쁜 그림자효과 주기> file 꼬냐닷컴 2005.09.21 10987
1532 금속액체같은 이미지 만들기 [18] file Diz 2003.02.12 10974
1531 [MaX。의 포토샵 강좌 01] - 그림자 효과 [20] file MaX。 2003.06.15 10971
1530 눈 초롱초롱 하게 만들기(?) [6] file 절사 2005.04.07 10954
1529 물방울 무비 시리즈(2) [1] 여어자 2003.10.10 10953
1528 스위시맥스 - 한글,영문 동영상강좌[초급~고급] [3] 에듀멘 2006.07.21 10947
1527 [포토샵] 모래알이 흩뿌려진 듯한 효과의 글자만들기 [6] file 최석원 2003.08.14 10933
1526 Dotory Style :-) 연분홍빛깔 꽃 그리기 [10] file 도토리™ 2003.05.24 10913
1525 [Minus Hand]바다위에 글씨떠있는 효과 [9] file 정성실 2003.08.25 10910
1524 [초간단]포토샾으로 일러스트 효과내기! [12] file 전치원 2002.10.05 10904
1523 이미지를 자기만의 Shape로 만들어보자! (Define Custom Shape) [9] file endless 2007.02.14 10902
1522 이미지를 원하는 모양으로 잘르기 [3] file L O V E # 2003.05.13 10902
1521 신비스러운 이미지 효과내기 [13] file 리체 2002.12.11 10901
1520 [웹사이트만들기]사용자를 위한 디자인 file HomeBox™ 2004.04.29 10875
1519 [초보] 글씨에 테두리주기^_____^ [17] 블르 2002.12.31 10872
1518 비내리는 효과 [1] file 이하늘936 2007.11.03 10857
1517 하트 그리기 다른방법..... [5] file 오승민 2004.04.13 10857
1516 하회탈 만들기(일러+포토샵) [8] file 무어 2003.03.18 10852