6
웹 사이트에서 관리 할 수있는 .woff 파일이 각 글꼴마다 하나씩 있습니다. 로드 시간을 절약하기 위해 요청 횟수를 줄이려고합니다. 이러한 woff 파일을 하나의 리소스로 결합 할 수 있습니까?여러 개의 .woff 파일을 하나의 파일로 결합하십시오.
A
답변
9
woff 에셋을 base64로 CSS에 묶을 수 있습니다. 당신 @ 글꼴 얼굴 선언 내부
는 :
url('data:application/x-font-woff;base64,myVeryLongBase64StringGoesHere...');
이 자산의 파일 크기를 증가시킬 수있다. 내 경험에 의하면 이것은 대개 약 20 % 정도입니다. 대략 TTF 파일과 크기가 같습니다. 대부분이 gzip 가능 서버로 복구 될 수 있습니다. 절충안은 저에게는 받아 들일 만하지만 YMMV입니다.
블롭을 CSS에 삽입 할 때 종종 권장되는대로 - 모두 별도의 스타일 시트에 보관하십시오. 기본 스타일 이후에 을 인용하십시오. 그렇지 않으면 클라이언트가 내용이 의도 한대로 표시되기 전에 글꼴로드를 기다리는 중일 수 있습니다.