많은 기업들이 자사 브랜딩을 강화하기 위해 그들만의 폰트를 배포하여 내놓습니다.
그런데 이런 폰트들이 참 탐이 나고, 웹에서 사용할 수 없을까 라는 고민을 하기도 하는데
웹폰트의 경우 용량 문제로 사용하기가 어렵습니다.
그래서 폰트 경량화 문제가 중요한데요, 일단 이 글은 아모레퍼시픽에서 내놓은 아리따글꼴의 웹폰트를 사용하는 방법에 대한 글입니다.
소스
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs.css
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaDotumMedium.eot
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaDotumMedium.woff
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaDotumMedium.ttf
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaDotumLight.eot
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaDotumLight.woff
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaDotumLight.ttf
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaSansMedium.eot
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaSansMedium.woff
http://www.amorepacific.com/etc/designs/company-ko-kr/clientlibs/fonts/AritaSansMedium.ttf
@font-face {
font-family:'aritadm';
src: url('clientlibs/fonts/AritaDotumMedium.eot');
src: local(※), url('clientlibs/fonts/AritaDotumMedium.eot?#iefix') format('embedded-opentype'),
url('clientlibs/fonts/AritaDotumMedium.woff') format('woff'),
url('clientlibs/fonts/AritaDotumMedium.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family:'aritadl';
src: url('clientlibs/fonts/AritaDotumLight.eot');
src: local(※), url('clientlibs/fonts/AritaDotumLight.eot?#iefix') format('embedded-opentype'),
url('clientlibs/fonts/AritaDotumLight.woff') format('woff'),
url('clientlibs/fonts/AritaDotumLight.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family:'aritasm';
src: url('clientlibs/fonts/AritaSansMedium.eot');
src: local(※), url('clientlibs/fonts/AritaSansMedium.eot?#iefix') format('embedded-opentype'),
url('clientlibs/fonts/AritaSansMedium.woff') format('woff'),
url('clientlibs/fonts/AritaSansMedium.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family:'aritadsb';
src: url('clientlibs/fonts/AritaDotumSemiBold.eot');
src: local(※), url('clientlibs/fonts/AritaDotumSemiBold.eot?#iefix') format('embedded-opentype'),
url('clientlibs/fonts/AritaDotumSemiBold.woff') format('woff'),
url('clientlibs/fonts/AritaDotumSemiBold.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
이런 식으로 폰트 파일을 정의해놓고,
font-family:'아리따돋움', aritadm, 'Apple Gothic', 'DroidSansFallback', '맑은고딕', 'Malgun Gothic', '나눔고딕', NanumGothic, '돋움', dotum, arial, sans-serif, helvetica;
이렇게 사용하면 됩니다.
픈트 용량이 2메가 선을 넘네요. 경량화 작업은 그다지 안된;; 그러니깐 올곧은 폰트네요 ㅎ;
제목 | 날짜 | ||
---|---|---|---|
깃헙 웹폰트 | 2018/05/15 | 240 | |
한글 폰트 직접 써보고 고르기 | 2018/05/15 | 658 | |
폰트 이야기 알림입니다. | 2010/05/15 | 282 | |
28 | [일반] 설치 폰트 목록 | 2003/10/13 | 976 |
27 | [한글] 아모레퍼시픽 아리따글꼴(아리따부리, 아리따돋움, Arita sans) | 2015/08/30 | 978 |
26 | [일반] 예전 자료 | 2005/03/05 | 996 |
25 | [웹폰트] 한글 웹 폰트 경량화해 사용하기 (Coderifleman, 2015.02), Noto Sans(본고딕) 웹폰트 | 2015/08/30 | 1000 |
24 | [다운로드] 다음체, 네이버고딕, 명조체 다운로드 | 2009/01/07 | 1032 |
23 | [일반] 윈도우즈 98 기본폰트 목록 (by 나우주 icosmos) | 2004/05/24 | 1034 |
22 | [한글] 한겨레결체 | 2005/10/10 | 1075 |
21 | [웹폰트] 윤디자인 웹돋움 | 2007/09/02 | 1144 |
[웹폰트] 아모레퍼시픽 아리따글꼴 웹폰트 | 2015/08/30 | 1172 | |
19 | [한글] 한글 none 스타일 글꼴 | 2005/03/05 | 1269 |
18 | [윤디자인] 윤디자인 서체 | 2007/09/20 | 1284 |
17 | [웹폰트] 현대U&I웹폰트, 구글 본고딕 노토산스 | 2016/06/26 | 1328 |
16 | [한글] 배달의 민족 한나체 주아체 | 2014/10/31 | 1336 |
15 | [한글] 나눔글꼴(나눔고딕, 나눔명조) | 2009/01/19 | 1405 |
14 | [영문] 세련된 디자인 표현에 유용한 가늘고 얇은 영문 폰트 | 2015/08/30 | 1434 |
13 | [웹폰트] 서브셋폰트메이커를 사용한 웹폰트 만들기 | 2015/08/30 | 1711 |
12 | [한글] 한양 백송체 | 2009/11/22 | 1797 |
11 | [돋움류] 고딕 계열 폰트 - 윤고딕, 산돌고딕 | 2005/03/04 | 2017 |
10 | [한글] 은글꼴(은펜체, 이니스프리폰트) | 2016/05/10 | 2129 |
9 | [웹폰트] 나눔스퀘어 웹폰트 | 2016/06/06 | 2295 |