글꼴 서브셋터

현대 폰트 파일(OTF, TTF, WOFF, WOFF2)에는 문자 모양 이상의 것이 포함되어 있습니다. 일반적인 라틴 폰트에는 대문자와 소문자, 숫자, 구두점, 악센트 문자, 합자, 대체 글리프, 커닝 쌍 및 OpenType 기능(소형 대문자, 올드스타일 숫자, 문맥 대체)이 포함됩니다. 포괄적인 폰트 패밀리는 1,000개 이상의 글리프를 포함할 수 있습니다. 영어 텍스트만 표시하는 웹사이트에서 폰트를 사용하면 폰트 데이터의 90%를 사용하지 않고 전송하게 되어 대역폭이 낭비되고 페이지 로드가 느려집니다.

폰트 서브셋은 필요한 글리프만 추출하여 이 문제를 해결합니다. 영어 전용 웹사이트의 경우 95개의 인쇄 가능한 ASCII 문자만 필요할 수 있습니다. 폰트를 500 KB에서 20-50 KB로 줄일 수 있습니다. 기본 라틴 + 일반 악센트 문자를 사용하는 사이트의 경우 약 200개의 글리프가 필요할 수 있습니다. 서브셋 도구는 HarfBuzz (hb-subset)를 사용하여 폰트의 바이너리 구조를 파싱하고, 지정된 글리프와 관련 메트릭(커닝, 전진 너비)을 추출하여 유효한 폰트 파일을 해당 글리프만으로 다시 빌드합니다.

WOFF2 형식은 서브셋 위에 추가 압축을 제공합니다. WOFF2는 Brotli 압축을 사용하여 WOFF보다 20-40% 작은 파일을 생성합니다. 모든 최신 브라우저(Chrome, Firefox, Safari, Edge)가 WOFF2를 지원합니다. 최적의 접근 방식은 폰트를 필요한 글리프로 서브셋한 다음 최대 압축을 위해 WOFF2로 인코딩하는 것입니다. 500 KB TTF 폰트를 15 KB WOFF2 서브셋으로 줄일 수 있습니다. 97% 감소입니다.

대부분의 웹사이트에서 가장 간단한 전략은 모든 ASCII 문자를 포함하는 Unicode Basic Latin 범위(U+0020 ~ U+007E)로 서브셋하는 것입니다. 이는 영어 콘텐츠에 충분합니다. 다국어 사이트의 경우 각 언어에 필요한 특정 Unicode 범위로 서브셋하고 unicode-range CSS 속성을 사용하여 각 페이지에 관련 서브셋만 로드하세요. Google Fonts는 이 기술을 사용합니다. 페이지 콘텐츠를 기반으로 다른 서브셋을 제공합니다.

서브셋할 때 OpenType 기능에서 참조하는 글리프를 제거하지 않도록 주의하세요. 예를 들어, 소형 대문자 기능(smcp)은 소문자를 소형 대문자 버전으로 대체합니다. 소형 대문자 글리프를 제거하면 기능이 작동하지 않습니다. 저희 도구는 폰트의 기능 정의를 보존하지만 지정한 글리프만 포함합니다. OpenType 기능이 필요한 경우 해당 기능이 참조하는 모든 글리프를 포함하세요. 웹의 본문 텍스트에는 복잡한 OpenType 기능을 비활성화하고 기본 문자 형태만으로 서브셋하는 것이 가장 좋습니다.