티스토리 페이지 로딩속도 향상: 웹폰트 제거 방법 총정리

안녕하세요! 오늘은 티스토리 블로그에서 페이지 로딩 속도를 높이기 위한 방법 중 하나인 웹폰트 제거에 대해 알려드릴게요. 웹폰트는 블로그 디자인을 돋보이게 해 주지만, 사용하지 않는 경우 불필요하게 로딩 속도를 느리게 할 수 있어요. 이번 글에서는 웹폰트가 속도에 미치는 영향을 살펴보고, 웹폰트를 제거해 속도를 최적화하는 방법을 자세히 알아볼게요!

---

페이지 로딩속도 향상 - 웹폰트 제거 방법

 

 

웹폰트란?

웹폰트는 블로그의 텍스트 스타일을 꾸미기 위해 외부 서버에서 가져오는 글꼴 파일이에요. 이런 파일은 보통 몇 KB에서 수백 KB까지 크기가 다양하며, 블로그 페이지가 로딩될 때마다 추가로 다운로드되기 때문에 속도 저하를 유발할 수 있어요. 특히 페이지 뷰가 많은 블로그나 이미지가 많은 포스팅에서는 웹폰트 로드 시간이 누적되어 방문자가 이탈하는 원인이 되기도 해요.

 

웹폰트 제거 장점

웹폰트를 제거하면 다음과 같은 장점을 얻을 수 있어요:

1. 로딩 속도 개선: 웹폰트 파일을 로드하지 않아 페이지 로딩 시간이 줄어들어요.
2. 방문자 이탈 감소: 페이지 로딩 속도가 빨라지면 방문자가 페이지를 떠나는 비율이 낮아져요.
3. 모바일 환경 최적화: 모바일 데이터 사용량을 줄일 수 있어 방문자 만족도가 높아져요. 

티스토리 블로그 CSS 버튼 추가하는 방법

 

 

티스토리 웹폰트 제거 방법

웹폰트를 제거하면 블로그가 기본적으로 시스템 글꼴을 사용하게 되며, 이는 브라우저가 미리 로드하고 있는 글꼴이기 때문에 별도의 로딩 시간이 필요하지 않아요. 아래에서 웹폰트를 제거하는 방법을 단계별로 설명드릴게요.

 

1. HTML/CSS 편집 화면 이동

티스토리 블로그 관리 페이지에서 꾸미기 > 스킨편집 > HTML 편집으로 들어가. 이화면에서는 블로그의 HTML 및 CSS 코드를 수정할 수 있어요.(위 CSS 버튼 추가하는 방법 글을 참고하세요)

 

 

2. CSS 수정하기

위 CSS 탭을 선택한 후 아래의 CSS 부분을 수정해요. 수정은 해당라인을 주석처리하는 것으로 주석의 시작 부분은 <!-- 을 이용하고 끝 부분은 -->을 이용해요.

 

CSS 수정

 

• 22번 라인 부근: /* Web Font Load */ 아래 1 또는 2줄 전체에 대해 주석처리(@import 구문)
• 30번 라인: <!-- font-family: 'AppleSDGothicNeo", 'Noto Sans KR', sans-serif; -->
• 57번 라인: <!-- font-family: 'Noto Sans KR', sans-serif;-->
• 128번 라인: <!-- font-family: 'Nanum Myeongjo';-->

 

웹폰트 제거 확인하기

웹폰트를 제거한 뒤에는 반드시 블로그가 정상적으로 표시되는지 확인해야 해요. 다음 사항을 점검해 보세요:

• 블로그 텍스트가 깨지거나 이상한 글꼴로 보이지 않는지 확인하기.
• 브라우저의 개발자 도구(Chrome의 경우 F12 키)에서 페이지 로딩 속도가 개선되었는지 확인하기.

 

 

마치며...

오늘은 티스토리 블로그에서 웹폰트를 제거해 페이지 속도를 향상하는 방법에 대해 알아봤어요. 웹폰트는 보기에는 좋지만, 속도 저하를 일으킬 수 있으니 사용 여부를 신중히 결정해야 해요. 특히 로딩 속도가 중요한 블로그라면 시스템 글꼴을 활용해 최적화된 환경을 만들어 보세요.

함께 읽으면 좋은 글

애드센스 가입 자격, 애드포스트와의 차이점은?

티스토리 블로그 운영. 도메인, 2차 도메인이란?