Web Guide웹폰트폰트 깜빡임로딩 최적화
웹폰트 깜빡임 해결하기
글자가 잠깐 안 보이거나 다른 글꼴로 떴다 바뀝니다.
폰트 파일이 늦게 도착하기 때문입니다.
01두 가지 증상
처리 방식에 따라 다르게 나타납니다.
글자가 안 보임
폰트가 올 때까지 빈 공간 · 깔끔하지만 내용을 못 읽음 · 느린 환경에서 길어짐
글꼴이 바뀜
기본 글꼴로 먼저 표시 · 읽을 수 있지만 화면이 튐 · 줄 수가 달라지기도
02줄이는 방법
파일을 가볍게 하고 빨리 가져옵니다.
필요한 글자만
쓰는 문자만 담아 용량 축소.
굵기 줄이기
쓰는 굵기만 불러옵니다.
최신 형식
압축률 좋은 형식 사용.
미리 연결
폰트 서버에 먼저 접속.
미리 불러오기
중요한 폰트는 우선 요청.
자체 제공
외부 대신 우리 서버에서.
03대체 글꼴 맞추기
튐을 줄이는 핵심입니다.
1
비슷한 글꼴 지정
기기 기본 글꼴 중 유사한 것.
2
크기 보정
대체 글꼴 크기를 맞춥니다.
3
자간 보정
폭 차이를 줄입니다.
4
줄 수 유지
바뀌어도 줄이 안 늘게.
5
표시 방식 지정
바로 보일지 기다릴지 선택.
6
시간 제한
오래 걸리면 대체 글꼴 유지.
04판단 기준
웹폰트가 꼭 필요한지부터 봅니다.
본문 폰트기기 기본 글꼴로도 충분할 수 있습니다.
제목만 적용제목에만 브랜드 폰트.
개수 제한한두 종류로 줄입니다.
굵기 제한두세 개면 충분합니다.
라이선스웹 사용 허용 범위를 확인.
측정적용 전후 속도 비교.
CHECK POINT
□ 웹폰트가 정말 필요한가
□ 쓰는 굵기만 불러오는가
□ 필요한 문자만 담았는가
□ 최신 폰트 형식을 쓰는가
□ 폰트 서버에 미리 연결하는가
□ 대체 글꼴을 지정했는가
□ 글꼴이 바뀔 때 줄 수가 변하지 않는가
□ 웹 사용 라이선스를 확인했는가
#웹폰트#폰트 깜빡임#로딩 최적화#대체 글꼴#라이선스#레이아웃 안정#성능#반응형#웹비스타#홈페이지 제작