나눔 고딕 글꼴 웹폰트로 블로그 가독성 높이기 설정 적용시키기
최근 나눔고딕 글꼴로 웹폰트 설정을 통해 블로그 폰트를 수정하는 사람들이 속속들이 늘어나고 있는듯하다. 가독성을 위해서 바꾸는것이 대부분 블로거들의 생각이다. 필자 또한 기본 폰트인 굴림, 돋움체보다는 나눔고딕의 가독성이 높다는 느낌을 받아서 Connection Generator 블로그도 나눔고딕을 기본 서체로 설정하였다.


1. 나눔고딕 글꼴 설정 걸림돌

나눔고딕 글꼴의 설정은 스킨 수정 HTML/CSS 편집을 통해 쉽게 설정할 수 있다.
그러나 나눔고딕 글꼴의 설정에서의 문제점이 있다. Internet Explorer가 아닌 불여우, 크롬, 오페라 등의 IE가 아닌 브라우저에서 나눔고딕 글꼴을 제대로 표현하지 못한다는 문제점이 있다.
그러나 우리같은 블로거 몇명이 IE를 버리고 불여우, 크롬, 오페라 등을 사용한다고 하더라도 아직까지도 IE6에서부터 IE8까지 IE를 사용하는 사람은 여전히 많다.

 
2. 블로그 방문자 브라우저 사용 현황


Google Analytics (https://www.google.com/analytics)를 통해 필자의 블로그 Connection Generator를 방문해주는 방문객들의 트래픽을 분석한 결과이다. IE가 94.25%로 타 브라우저와 비교도 할 수 없을 정도로 점유를 하고 있으며, 그 뒤를 Chrome이 3.18%, Firefox가 1.81%로 뒤따르고 있다.
여기서도 알 수 있듯이 여전히 IE를 사용하는 사람들이 대다수이고, 이 때문에 Chrome과 Firefox에서 나눔고딕을 볼 수 없을지라도 IE를 통해 더 많은 방문객들의 가독성을 높일 수 있다는 결론이 나왔다. 


3. 나눔고딕 글꼴 적용 결과


나눔고딕을 설정한 후에는 위의 포스트 내용처럼 기존의 굴림, 돋움체와 같은 기본 글꼴보다 보는 사람의 눈이 편한 느낌을 받으며, 가독성 또한 높아졌다고 느껴진다.


4. 나눔고딕 글꼴 웹폰트 적용으로 블로그 가독성 높이기(설정 방법)

※ 설정방법은 매우 간단하고 쉬우며 많은 시간을 할애하지 않아도 된다.

나눔글꼴은 애초에 웹폰트로서 파일이 존재하지 않는다. 그러나 WWW상에 수많은 사람들이 이미 변환 프로그램을 통해서 웹에서 사용가능한 상태로 변환하여 재배포하고 있기 때문에 변환을 직접해주는 수고는 하지 않아도 된다.
NanumGothic.eot
위 나눔고딕 웹폰트 파일을 다운로드 받아서 나눔고딕체를 설정하기 원하는 블로그의 스킨 파일 업로드 공간에 업로드한다.

업로드를 정상적으로 완료하였으면 업로드한 나눔고딕 글꼴의 경로는 블로그 내에서 images/NanumGothic.eot가 될 것이다.(티스토리 기준)

나눔고딕의 웹폰트 파일의 업로드를 끝냈다면 그다음으로 스킨- HTML/CSS 편집에서 style.css부분을 수정해주어야한다.
@font-face {font-family:NanumGothic; src:url(images/NanumGothic.eot);}
위 내용을 style.css 부분에서 가장위에 붙여넣기 한다.
그 이후에는 스킨마다 다르지만, 본문, 메뉴, 방명록, 댓글 등에 설정되어있는 글꼴 설정에서 NanumGothic 글꼴로 설정을 바꾸어주면 된다.

저작자 표시 비영리

'Cantata@ BlogTip' 카테고리의 다른 글

나눔 고딕 글꼴 웹폰트로 블로그 가독성 높이기 설정 적용시키기  (14) 2010/08/29
티스토리 툴바:티스토리 로그인바 없애기  (7) 2010/06/24
Blog Tag Cloud IE에서 이상증세,,,  (9) 2009/07/14
Buzz this
Follow me!
태그 - , , , , , , , , , , , ,
카테고리 - Cantata@ BlogTip  |  2010/08/29 23:13
Trackback 0 | Comments 14
이 글의 트랙백 주소 :: http://ok-dj.com/trackback/141 관련글 쓰기
permalink
2010/08/30 05:05 댓글에 댓글수정/삭제
비밀댓글 입니다
BlogIcon Cantata
2010/08/30 10:13 수정/삭제
아녜요.괜찮아요
개인적인 의견이신데요.
나눔고딕은 실제 IE에서밖에 안보이는게 안타깝긴 하지만...
새벽 5시...ㅎ밤새셨네요?ㅎ
해피노리블로그에 요즘들어 자주 방문하고있습니다 ^ㅎ
앞으로도 좋은 포스트 부탁해요 ㅎ
permalink BlogIcon Genesispark
2010/08/30 14:28 댓글에 댓글수정/삭제
IE 전용이라는점을 제외하면...가독성좋은 폰트지요
BlogIcon Cantata
2010/08/30 15:03 수정/삭제
가독성도 좋고 눈이 보기에 편한 느낌이 들더군요
단지 IE에서만 가능하다는..ㅎ
그래도 IE사용자는 여전히 많으니...누군가는 잘 보고있겠죠
permalink BlogIcon 신사토리
2010/08/30 17:00 댓글에 댓글수정/삭제
나눔글꼴 정말 가독성 하나는 끝내주더군요~ㅎㅎ
저도 이거 적용하느라 얘좀 먹었지만 하고나니 정말 괜찮다는 생각이 듭니다.
BlogIcon Cantata
2010/08/30 17:09 수정/삭제
신사토리님 블로그도 보니 나눔고딕으로 설정되어있군요ㅎ
눈이 편한 글꼴인듯합니다 ㅎㅎ
적용하는게 처음에 할때는 뭐가뭔지 모를수도있죠 !
permalink BlogIcon 머니뭐니
2010/08/31 15:51 댓글에 댓글수정/삭제
나눔고딕 적용하고 싶은데...
스킨마다 다르지만, 본문, 메뉴, 방명록, 댓글 등에 설정되어있는 글꼴 설정에서 NanumGothic 글꼴로 설정을 바꾸어주면 된다라는 말에
급 좌절 하고 갑니다ㅡ.ㅜ
BlogIcon Cantata
2010/09/01 20:09 수정/삭제
스킨마다 다르죠..
그렇게 어렵지 않아요..
몇줄 바꾸는거라..쉽죠
permalink BlogIcon 백전백승
2010/08/31 19:13 댓글에 댓글수정/삭제
저는 웹폰트 설정으로 나눔고딕이 안 보이는 브라우저는 관심등에 두지 않게 되요. 우리나라는 IE 사용자가 워낙 많다보니 그런것 같아요.
BlogIcon Cantata
2010/09/01 20:09 수정/삭제
IE욕하면서도 IE를 쓸수밖에 없는 나라죠.. ㅎ
permalink BlogIcon 해커 C
2010/09/01 22:35 댓글에 댓글수정/삭제
안녕하세요!! 칸타타님 ㅎㅎ

좋은 정보 잘보고 갑니다!! IE에서만 보여진다는게 참 안타깝네요!!

웹폰트좀 봐꺼 볼까 하다가, 나눔고딕이 괜찮아 보였는데 말이죠 ㅠ

즐거운 하루 마무리도 즐겁게 하세요 ~
BlogIcon Cantata
2010/09/02 12:38 수정/삭제
웹폰트가 원래는 보기 어지럽고 그냥 귀여운 폰트들이 많았는데... ㅎ
나눔고딕은 참 괜찮은 글씨체네요 ㅎ
permalink BlogIcon Movey
2010/09/03 04:48 댓글에 댓글수정/삭제
블로그 방문 감사합니다.
브라우저마다 다르니까 웹폰트 쓰기가 힘들겠어요.ㅠ 전 컴퓨터 쪽을 잘 알지 못해서 더 복잡해보이네요 ^^; 그런데 칸타타님은 레뷰인가 어딘가에서 군대에 계시다고 언뜻 본 거 같은데 어떻게 컴퓨터를 자주 하시나요~ 궁금해요 ㅎㅎ
BlogIcon Cantata
2010/09/03 08:31 수정/삭제
그렇게 자주는 못하죠..
그래서 입대전에 1일 1포스팅을 하려 노력했었던 것이..
물거품이 되어버렸죠..
귀찮아지거니와, 시간과 사회 소식에 늦을수밖에 ㅎ




이전 목록   1   2   3   4   5   ...  120   다음 목록

Cantata's Blog is powered by Daum & tistory