[티스토리 팁 #2]티스토리 블로그 나눔고딕 글꼴 적용하기

티스토리 블로그를 만들어만 놓고 그 동안 방치하고 있었는데, 오늘부터 조금씩 꾸며보기로 결심했습니다! 그 시작으로 오늘은 글의 가독성을 높이기 위해서 글꼴을 나눔고딕으로 바꿔보는 법을 알아보기로 합시다.

(신나는 정보통님의 글을 바탕으로 작성해 보았습니다. 출처 : http://berryjb.tistory.com/7 )

블로그 꾸미기1. 티스토리 블로그 나눔고딕 글꼴 적용하기

현재 티스토리에서 기본으로 사용가능한 폰트는 굴림,돋움,바탕,궁서로 되어있는데.. 따라서 좀 더 가독성이 좋다고 알려진 나눔고딕으로 폰트를 바꾸고자 합니다.

정보통님의 글에서는 두 가지 방법을 사용하고 있는데, 그 중 구글 웹폰트를 사용하는 법을 알아보았습니다.

생각보다 구글 웹폰트를 적용하는 법이 복잡해서, 더 쉬운 방법으로 다시 작성했습니다. 구글 웹폰트를 통해 바꾸는 법은 아래 남겨놓았으니 참고하세요.

1. 아래의 나눔고딕 폰트 파일을 다운로드 한다.

NanumGothic.eot

2. 티스토리 관리자 화면에 들어가서, HTML/CSS 의 파일업로드 창으로 들어간다. 다운받은 파일을 업로드해주면 아래와 같이 등록된다.

3. 저장한 후 다시 CSS 수정창으로 들어가서, 맨 윗부분에 아래소스를 추가해준다.

@font-face {font-family:Nanum Gothic; src:url(images/Nanum Gothic.eot)};

body{font-family:Nanum Gothic; font-size: 11px;}

div{font-family:Nanum Gothic; font-size:13px;}

4. 미리보기를 통해 확인해본다. (끝)

(아래는 구글 웹폰트를 사용하는 방법입니다.)

---

1. 먼저 아래의 사이트로 들어가서 'Nanum' 혹은 'Korean' 으로 검색한다.

구글 웹폰트 : http://www.google.com/fonts/earlyaccess

2. 위 화면에서 Link 아래의 소스코드를 그대로 복사한다.

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

3. 티스토리 관리자 화면 -> 왼쪽 메뉴 중 HTML/CSS 편집 들어가서 -> CSS 

4. @charset "utf-8"; 과 body 사이에 위 소스코드를 붙여넣기 해주면 된다. 

5. 마지막으로, 위의 CSS 설정에서 Ctrl+f 를 통해 모든 family-font 를 찾아서 'Nanum Gothic', serif; 을 추가해주면 된다. 

---

Tip. 각 방법은 웹 로딩 속도 등에서 나름의 장단점이 있다고 하니 원하는 방법으로 하시면 될 것 같습니다.

Tip. 최근에는 모바일로도 블로그를 많이 봐서, 글의 가운데 정렬보다는 양쪽정렬이나 왼쪽정렬로 읽기 쉽게 하는것도 가독성을 높이는 좋은 방법이라고 한다. 

(출처 : http://berryib.tistory.com/7)