Adobe Fonts 웹사이트에 추가하기
Adobe Fonts 웹 서비스를 이용하려면 해당 서비스가 제공하는 임베드 코드를 통해 웹 글꼴을 사용해야 합니다. 사용 약관에서는 웹 글꼴 파일을 자체적으로 호스팅하거나 웹 사이트 디자인 플랫폼에 업로드하는 것을 허용하지 않습니다.
Adobe Fonts는 크게 두가지 방법으로 다운로드를 할 수 있습니다 .
웹사이트에서 글꼴을 추가하거나 creativecloud 앱을 활용하여 글꼴을 추가할 수 있습니다.
이 컨텐츠에서는 웹에서 글꼴 추가 방법이에 관련하여 내용을 다룰 것이며,
참조문서 웹 사이트에 글꼴 추가 에서도 확인할 수 있습니다.
① 어도비 폰트 에 로그인후, 원하는 글꼴을 찾아 </> 버튼을 클릭하여 웹 프로젝트에 모음을 추가 합니다.
참고: 언어 지원 및 하위 집합
② 웹 프로젝트에 글꼴 추가 창에서 웹 프로젝트의 이름을 지정하고 포함할 글꼴을 결정합니다.
확인란을 사용하여 포함할 글꼴 두께와 스타일을 선택후 우측 하단의 만들기 버튼을 눌러주세요.
▷글꼴을 웹 사이트에 로드하기 위한 임베드 코드가 제공됩니다. 다른 옵션은 임베드 코드 도움말 페이지에 설명되어 있으며 기본 임베드 코드는 대부분의 프로젝트에서 제대로 작동합니다. 임베드 코드를 복사하여 웹 사이트에 있는 <head> 태그에 추가합니다.
▷웹 프로젝트가 완성되었다면, 크게 두가지 방법으로 표시 될 것 입니다.
①기본 문자 세트 (ex: 영어, 프랑스어, 독일어등)
@Import 임베드 코드는 CSS 스타일시트에서 바로 사용할 수 있습니다.
웹사이트의 <head> 에 있는 스타일 태그 사이에 추가g하거나 css 파일의 맨위에 배치합니다.
> 참조 : 임베드 코드
② 동적 하위 집합 : 동아시아권 폰트(ex: 한국어, 일본어, 중국어 등)
동아시아 글꼴은 *동적 하위 설정이 제공되어야 하는 반면, 다른 글꼴에는 언어 기반 하위 설정 옵션(기본, 모든 문자 또는 사용자 정의 언어 하위 집합)이 있습니다.
Adobe는 동아시아 웹 글꼴 서비스를 제공하기 위해 동적 하위 집합을 개발했습니다. 대부분의 경우 글리프가 10,000개 이상인 대규모의 동아시아 글꼴을 로드 시간에 큰 영향을 주지 않고 웹 사이트에 로드하는 것은 매우 어려운 일입니다. 따라서 동아시아 웹 글꼴 제공에 사용되는 동적 하위 설정 에는 JavaScript 내장 코드가 필요합니다 .
추가 참조 :
내 웹 글꼴을 use.typekit.net에서 가져오는 이유는 무엇입니까?
JavaScript 임베드 코드
AdChoices
