이전
목록
다음
선

웹폰트 로딩 최적화

선택과집중
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 · 2025-06-27 (금) 09:43:56 · 1248 · 3

웹폰트 로딩이 느리면 화면에 기본 폰트가 깜빡 나타났다 바뀌는 FOUT(Flash of Unstyled Text) 현상이 발생

 

font-display: swap; 사용하여

@font-face {
  font-family: 'Pretendard';
  src: url('Pretendard.woff2') format('woff2');
  font-display: swap;
}
 

<link rel="preload">로  불러오기

<link rel="preload" href="/fonts/Pretendard.woff2" as="font" type="font/woff2" crossorigin="anonymous">

 

자주 쓰는 폰트는 CDN 말고 직접 호스팅하는 게 로딩 안정성에 더 좋음

|

댓글 3개

민트다이어리
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 2025-06-30 (월) 12:57:26

감사합니다 

아이스웨덴™
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 2025-06-30 (월) 17:37:57

감사합니다~

써맨
프로필 보기게시판 작성글 보기전체 작성글 보기전체 댓글 보기
 2025-07-07 (월) 10:30:18

감사합니다.

댓글을 작성하시려면 로그인이 필요합니다.

퍼블리셔팁

1,282건

퍼블리싱과 관련된 유용한 정보를 공유하세요. 질문은 상단의 QA에서 해주시기 바랍니다.

+
분류 제목 글쓴이 날짜 조회
CSS 25-12-27 조회 805
CSS 25-12-17 조회 590
CSS 25-12-07 조회 713
CSS 25-11-20 조회 636
CSS 25-11-15 조회 718
기타 25-09-21 조회 832
CSS 25-09-09 조회 1,100
CSS 25-09-05 조회 1,095
CSS 25-08-16 조회 1,146
기타 25-07-23 조회 989
CSS 25-07-17 조회 1,322
CSS 25-06-27 조회 1,249
CSS 25-06-12 조회 1,278
CSS 25-06-09 조회 1,218
CSS 25-06-07 조회 1,022
25-01-30 조회 1,197
HTML 25-01-23 조회 1,450
CSS 24-10-21 조회 1,352
23-12-10 조회 1,843
HTML 24-02-12 조회 1,292
CSS 24-02-11 조회 1,591
CSS 24-01-28 조회 1,532
HTML 23-11-05 조회 2,288
기타 23-10-21 조회 1,529
CSS 23-09-04 조회 2,113
HTML 23-07-13 조회 1,937
CSS 23-06-14 조회 1,834
23-05-04 조회 4,239
23-05-03 조회 5,999
23-06-01 조회 2,251
글쓰기