웹에서 가독성이 높은 나눔고딕체는 네이버에서 만든 글꼴로 무료로 제공되며, 웹폰트로도 사용할 수 있다.

웹폰트는 서버에서 각 컴퓨터에서 보여주는 방식이기 때문에 내 홈페이지나 블로그를 보는 사용자의 컴퓨터에 폰트가 설치되어 있지 않아도 같은 폰트를 볼 수 있는 서버형 폰트다.

 

초기에 사용하던 굴림이 지겨워져 돋움으로 바꾼 후로 꽤 오랫동안 사용해왔는데 돋움체도 슬슬 지겨워져서 깔끔하고 가독성이 좋기로 유명한 나눔고딕체로 바꾸기로 결심~!!

아래 작업을 하기 전 'style.css' 내용을 미리 복사해놓길 권한다. 왜냐~내 블로그는 소중하니까~!

 

 

 

 

일단 글 본문의 폰트만 나눔고딕으로 바꾸는 건 아주 쉽다~!!

 

 

1. 구글 웹폰트 서비스에 접속한 후 Ctrl+F 를 눌러 'Nanum Gothic'을 찾는다.

'Link' 부분의 '@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);' 부분을 복사한다.

기타 다른 나눔글꼴도 제공하지만, 어짜피 제일 깔끔하고 사람들이 많이 쓰는 글꼴은 나눔고딕이라 블로그에서는 사용할 일이 없을 듯~

 

 

 

 

2. 복사한 내용을 티스토리 관리 페이지의 'HTML/CSS 편집' 메뉴의 'style.css'의 가장 윗부분에 붙여넣는다.

 

 

 

 

3. 블로그의 스킨에 따라 다르긴 하지만 첫 부분에 'style.css'의 'body...' 부분에서 'font-fanmily'의 돋움 앞에 'Nanum Gothic, '를 입력한다.

 

 

***  참고로 아래 코드의 뜻은 블로그를 보고 있는 사용자의 컴퓨터에 있는 폰트를 기준으로 왼쪽 폰트부터 우선순위가 적용된다는 뜻이다. 그러므로 뒤의 폰트를 지울 필요 없이 앞에 'Nanum Gothic'을 추가해준다면 최우선으로 'Nanum Gothic' 폰트를 표시해준다. 게다가 'Nanum Gothic' 폰트는 웹폰트이므로 사용자의 컴퓨터에 폰트가 있든말든 상관없이 표시해주게 된다 ***

 

 

 

 

 

 

 

 

만약 블로그의 모든 폰트를 모두 나눔고딕으로 변경하고 싶다면 아래의 방법을 따라해보자~!!

 

 

4. 'style.css'에서 Ctrl+F를 눌러 'font'라는 단어를 검색한 후 글꼴이 표시되는 부분은 모두 'Nanum Gothic'으로 변경해준다. 위의 3번처럼 기존 폰트가 많은 경우 앞에 추가해줘도 되고, 폰트가 하나인 경우 지우고 변경해도 된다.

'style.css' 파일은 스킨에 따라 매우 다르므로, 귀찮더라도 본인이 일일이 바꾸는 방법밖에 없다.

 

 

 

 

 

 

 

이렇게하면 글꼴이 아래 그림에서처럼 돋움에서 나눔고딕으로 변경되는데, 아무래도 더 깔끔해보이려면 글자 크기가 10포인트보다는 11포인트가 나을 듯하다.

 

 

 

 

 

 

 

 
 
 
 

 

Posted by 두여자 Y&S

댓글을 달아 주세요

  1. 좋은 정보 감사합니다

    2013.09.22 01:55 신고 [ ADDR : EDIT/ DEL : REPLY ]
  2. 좋은 정보 감사합니다 다른 블로그 정보로는 해결이 안되었는데 여기서 해결하고 갑니다 ^^

    2013.09.27 02:42 신고 [ ADDR : EDIT/ DEL : REPLY ]
  3. 비밀댓글입니다

    2013.10.09 09:05 [ ADDR : EDIT/ DEL : REPLY ]
    • 글쓸때 폰트 목록에 뜨는게 아니고
      폰트를 기본 폰트인 돋움으로 놔두시면
      글쓰고 바뀝니다.
      글쓰실때 미리보기하시면 아실거예요~^^

      2013.10.09 12:14 신고 [ ADDR : EDIT/ DEL ]
  4. 오늘 덕분에 글씨체 바꿨어요 ~ 감사감사@_@

    2013.10.10 21:31 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 오옷~블로그가 너무너무 색감이 예쁘고 글씨체도 잘 어울려요!
      글도 벌써 31개나 되고 제가 다 뿌듯~^^

      2013.10.10 21:38 신고 [ ADDR : EDIT/ DEL ]
  5. 감사합니다:D
    저도 이거 보고 잘 바꿨어요.
    정말 도움이 되었어요!!!!

    2013.10.11 02:18 신고 [ ADDR : EDIT/ DEL : REPLY ]
    • 나눔고딕체랑 블로그랑 잘 어울리네요.
      저희 블로그보다 잘 어울리는듯~쿨럭 ^^;;
      좋은 하루되세요~

      2013.10.11 10:34 신고 [ ADDR : EDIT/ DEL ]
  6. 20개의 글을 다살펴봤는데 이게 정확한 정보네요! 감사합니다! 잘보고가요 ㅎㅎㅎ 덕분에 무사하게 적용시켰네요 ㅎㅎ 추천꾸욱!

    2014.05.15 10:37 신고 [ ADDR : EDIT/ DEL : REPLY ]