블로그 관련

블로그, 폰트만 변경해도 가독성이 좋아진다. 블로그폰트 바꾸기

Kay~ 2010. 6. 22. 08:53
반응형

블로그, 폰트만 변경해도 가독성이 좋아진다.

블로그 폰트를 변경해봤습니다.
스킨을 만져본적이 아주 오래전인것 같습니다.
블로그를 처음 개설했을때는 스킨 변경한다고 참 많은 시간을 소비했었는데 이제는 귀차니즘과 함께 실력이 부족한 관계로 손대기를 포기하고 있다가 ....
스킨은 포기하더라도 "폰트라도 바꿔보자"라는 일념으로 폰트 변경을 시도했습니다.

변경할 폰트를 선택하는 것은 "나눔글꼴"과 "맑은 고딕"중에서 택일을 했는데 나눔글꼴도 깔끔하고 좋지만  윈도우 7 에서 디폴트로 잡혀 있는 "맑은 고딕" 폰트가 괜찮아서 보여서 맑은 고딕 폰트로 변경하기로 하고 변경을 시도하는데.. 그게 참 쉬울것 같으면서도 제대로 되지 않더군요!

올 3월쯤인가  Microsoft의 WEFT ver 3.2 (WEFTIII2b1.exe)를 이용하여 폰트 변경을 시도하였지만..
맑은 고딕 폰트는 깨져서 제대로 변환이 되지 않아서 폰트 변경을 시도하다가 포기를 했습니다...

하지만 폰트변경에 대한 마음은 머리속에서 사라지지 않고 블로그를 볼때마다 나를 재촉하곤 했지요!
그래서 최근에 다시 시도를 했습니다.
WEFT가 아닌 EOTFAST라는 프로그램을 이용하여 재시도한 끝에
아주 쉽게 폰트변경에 성공했습니다.
^^

폰트 적용하는데 2분도 안걸렸다면 믿으시겠어요? 

이렇게 쉬운것을 왜 몰랐을까 하는 허탈함과 함께 앓던 이가 쏙 빠지는 것 같은 시원함이 동시에 느껴집니다.
사실 무엇이든 모를때는 어렵지만 알면 쉬운것입니다. ^^

폰트만 변경했을 뿐인데 블로그 느낌이 다릅니다.

우선 폰트만 변경했는데도 느낌이 확 달라지네요!
밝은 컬러의 스킨까지 변경을 했다면 금상첨화겠지만..
능력밖이라 폰트변경으로만 만족하려고 합니다.

 

블로그 폰트를 변경하기 위해서는...

블로그 폰트를 변경하기 위해서는 eot 파일을 준비해야 한다.

TTF : 컴퓨터에서 사용하는 폰트
EOT : 웹페이지에 포함하여 TTF폰트가 PC에 설치되어 있지 않아도 볼 수 있는 폰트로 인터넷익스플로러에서만 사용이 가능함.

PC에서는 워드프로세서나 엑셀, 인터넷등 상관없이 폰트가 PC에 설치되어 있어야 화면에 해당 폰트가 표시된다. 기본적으로 window가 설치된 모든 PC에는 굴림체나 돋움체가 설치되어 있기때문에 블로그 스킨 역시 기본적으로 굴림체나 돋움체로 되어 있다. 하지만 기본폰트가 아닌 특정 폰트(예를 들어 네이버의 나눔글꼴이나 다음의 다음글꼴, 맑은고딕등)는 style.css에서 폰트를 아무리 변경해도 해당폰트가 PC에 설치되어 있지 않은 방문자에게는 변경한 폰트는 보이지 않는다. 그래서 폰트설치 유무와 관계없이 익스플로러 사용자라면 누구나 지정한 폰트로 볼 수 있도록 변형한 폰트가 EOT 폰트이다.

1. 원하는 ttf(True Type Font) 폰트를 eot(Embedded Open Type) 파일로 변환해야 한다.
2. eot 파일을 웹에 업로드한다. (티스토리의 경우 스킨자료실에 업로드)
3. style.css에서 폰트명과 경로를 정의해준다.
4. style.css에서 본문, 사이드에 해당하는 스타일별로 글꼴이름을 적어준다.

여기서 가장 중요한 것이 eot 파일을 준비하는 것입니다. eot파일로 변환해주는 대표적인 프로그램이 WEFT인데 제가 사용하려는 맑은글꼴이 제대로 변환이 되지 않더군요. 또한 다른글꼴도 제대로 변환이 안될뿐더러 사용법도 매우 복잡합니다. 또 변경을 해도 입력해준 사이트(블로그)에서만 사용할 수 있기 때문에 변환된 eot 파일을 공유할 수가 없습니다. 그런데 아주 간편한 프로그램을 하나 발견했습니다. 아니 우연히 관련 글을 보게 되어 아주 쉽게 변환 및 적용을 할 수가 있었습니다.

 

또 한가지 중요한 점은 위의 3번에 해당하는 style.css의 가장 상단에 아래와 같이 폰트를 정의해주는 부분입니다.

@font-face { font-family: "맑은 고딕"; src:url(images/malgun.eot); } 


방법은 폰트를 웹폰트로 변환하는 방법 - TTF를 EOT로 변환을 참조하세요!

 

블로그 폰트 변경전과 변경후

자 그럼 변환전하고 변환후를 비교해보도록 하겠습니다.
폰트만 바꾸었는데도 매우 깔끔해졌습니다. 비교해보시 평좀 해주세요! ^^

 

폰트 변경전

폰트 변경전 글씨체입니다.

폰트 변경전 글씨체

 

맑은 고딕으로 변경후 (12픽셀)

"맑은 고딕"으로 변경한 후의 글씨체 이며 현재의 글꼴입니다.
글자만 샘플로 캡춰 해놓으니 큰 차이가 없어보이지만 자세히 보면 가독성이 매우 좋아졌음을 알 수 있습니다.

폰트 변경후 글씨체(12픽셀)

 

13픽셀로 글꼴크기를 변경했을때

맑은고딕 글꼴이 조금 작아보여서 13픽셀로 했을때의 모습입니다.

13픽셀로 변경했을때의 폰트크기

여러분들의 의견을 듣고 싶습니다.
맑은글꼴이 더 보기 좋은지.. 아니면 이전 글꼴이 보기 좋은지..
맑은글꼴이 더 보기 좋다고 했을때 12픽셀이 가독성이 좋은지,
13픽셀이 가독성이 더 좋은지 생각을 달아주시면 글꼴크기에 참고하도록 하겠습니다.

제가 읽기 좋은것보다는 방문하시는 이웃님들이 읽기 좋게 설정을 하고 싶습니다.

반응형