Tistory 웹폰트 제거

오늘따라 티스트로 페이지가 너무 늦게 로딩이 되어서 원인을 찾아보기로 했다.

결론을 먼저 이야기 하자면 기본 웹폰트 다운로드가 너무 느려서 나는 문제였다.

 

엉뚱한 곳에서 문제를 찾다.

원인을 알기 전까지 우선 내가 무언가를 최근에 변경한 것이 있는지 생각해 보는 것이 먼저였다. 내가 무얼 바꿨을까? 가장 최근에 바꾼 것은 스킨이다. 스킨을 적용하고나서는 무엇을 했지? 생각해보니 SyntaxHighlighter 를 다시 적용하기 위해서 스크립트 등의 파일을 업로드하고 HTML/CSS 수정으로 들어가서 HTML를 일부 수정했었다.

소스코드를 보기좋게 하기 위해서 적용한 SyntaxHighlighter 는 소스종류별로 구문강조를 하기위하여 예약어나 명령어등을 나열해 놓은 스크립트 파일들을 링크해야 한다. 게시글 작성중 어떤 종류의 소스가 쓰여질 지 모르기 때문에 현재 버전으로 정의된 모든 스크립트 파일을 링크해 놔서 여러개의 스크립트 파일을 다운로드 받아야해서 적용할 때 부터 고민을 했던 것이다.

이 녀석이 문제구나 라고 생각해서 해당 부분을 제거해 보았지만 느린 문제는 여전히 있었다. 그렇다면 스킨변경이 문제일터인데 이 번에 적용한 스킨은 용량이 큰 배경이미지가 있는 것도 아니여서 다시 이전 스킨을 적용하기에는 고민이 되었다. 그래서 무턱대고 이전 것으로 스킨을변경하기 보다는 원인을 알아보자는 생각이 들었다.

 

페이지 로딩 시 받는 파일은 무엇들이 있을까?

브라우저라는 것은 페이지 내용을 받게되면 위에서 부터 순차적으로 해석이 들어가게 된다. 그래서 좌우로 긴 페이지가 세로로 긴 페이지보다 더 빨리 내용이 보이게 되는 것이다.

하이튼 해석을 하다가 중간에 외부로 연결된 파일이 발견되면 해당 파일을 달라고 파일이 링크된 주소로 요청을 하게되는데 이때 하나의 패킷으로 최대 3개의 파일까지 요청이 가능하다. 그래서 아주 오래전 모뎀통신을 하던 시절에는 파일을 어떻게 하면 3의 배수로 링크를 걸게 줄일 수 있을까? 에 대해서 고민하던 시절이 있었다.

해당 파일을 요청하게되고 인터넷 환경에 따라서 파일이 늦게 다운로드 될 수도 있기에 어느정도 시간을 기다리다가 파일이 없다고 최종 판단하게 되면 파일없음을 나타내게 되는데 이 기다리는 시간 동안 브라우저는 계속 기다리게 된다. 물론 이 문제를 해결하기 위해서 페이지를 우선 보여주고 동적으로 파일을 다운로드 하는 여러 방법들이 존재하지만 특별한 파일이 아닌 이상 보통은 그냥 기다리게 한다.

 

웹폰트 대체 뭐하는 녀석이지?

인터넷 임시파일들을 전부 삭제하고 브라우저의 개발자도구 > 네트워크를 열어놓은 상태에서 페이지를 호출해 봤다. 요즘 워낙 빠르니 대부분의 파일들은 금방 응답이 온다. 하지만 한참뒤에 응답이 오는 파일 3개가 있는데 그게 웹폰트 였다.

난 이런것을 사용한 일이 없지만 친절하게도 스킨에 적용되어 있었다. CSS 편집에 들어가 보니 font-family에 'Noto Sans' 라고 되어있고  Font.css 파일에는 해당 폰트들의 다운로드 링크가 적혀있었다. 난 font.css 링크를 제거하고 font-family 에서도 'Noto Sans' 를 제거했다.

그렇다고 웹폰트가 문제가 있는 것은 아니다. 지금 다음사이트에서 웹폰트 파일 다운로드가 안되는 것일 뿐 잘 사용하면 사용자의 PC에 상관없이 웹페이지 제작자가 원하는 폰트로 보여지게 되는 것이니 웹디자이너나 퍼블리셔 에게는 아주 좋은 것이다. 그냥 내가 필요없을 뿐인 것이다.

 

꼭 필요한 사람은 다음사이트로 가보자.

http://www.google.com/get/noto/