반응형

안녕하세요. 계속해서 Flatinum 스킨에 관해 다루어보겠습니다. 이번에는 글꼴 변경에 관한 포스트입니다.


Flatinum 스킨의 기본글꼴은 'KoPub Dotum' 이며 부분적으로 'RaleWay' 글꼴이 적용되어 있습니다.


기본 글꼴도 뭔가 운치있어보이고 몽환적인 글씨체라 나쁘지는 않습니다만 살짝 희미하기도 하고 네이버의 기본글꼴인 나눔고딕에 익숙해져있는 분들이 많다보니 나눔고딕을 선호하는 분도 있습니다.


실제로 나눔고딕이 가독성 면에서도 뛰어나다고 알려져 있기도 합니다. 때문에 디자인이나 분위기 보다는 철저하게 가독성 위주로 가려면 나눔고딕으로 변경하는것이 좀 더 좋습니다.


티스토리에서 나눔고딕을 적용하는것은 그리 어렵지 않으니 차근히 과정을 따라오시기 바랍니다.



1. 아래 사이트에 접속합니다. 구글 웹폰트 사이트로써 웹에서 적용되는 폰트들을 제공하고 있습니다.



https://fonts.google.com/earlyaccess



2. 사이트에 접속하면 Ctrl+F 키를 누르고 Nanum Gothic을 검색합니다.



그럼 위와 같이 검색이 가능합니다. 우리가 필요한것은 Link라고 되어있는 부분입니다.


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


이 것이 필요한데요. 현재 웹사이트에서는 조금 잘못된 링크를 제공하고 있습니다. // <- 앞에 http: 이게 빠졌습니다. 따라서 실제로 적용할때는 http:// 까지 같이 입력해주셔야 합니다.


이 부분을 긁어서 복사합니다.



3.  블로그 관리 -> HTML/CSS 편집 -> CSS 로 가서 링크를 붙여 넣습니다.



다만 CSS 코드에서 가장 위에 붙여넣기를 하셔야 합니다. 1번 줄에 보시는바와 같이 나눔고딕의 링크가 붙여져 있습니다.


그 다음 font-family 부분에서 'KoPub Gothic' 앞에 (반드시 앞이어야 합니다) 'Nanum Gothic'을 써 넣습니다. 따옴표도 반드시 같이 포함되어 있어야 합니다.


그리고 font-weight:300 이라는 코드가 있는데 이것을 지워줍니다. font-weight는 글씨의 굵기를 결정해주는데 가장 표준적인 굵기가 400입니다. 따라서 300은 약간 옅습니다. 그렇기 때문에 가독성을 위해서는 font-weight를 지워주세요.


그냥 위와 똑같이 따라하시고 저장버튼 누르시면 됩니다.






(위) 기존 글꼴체       (아래) 나눔고딕 글꼴체 



그럼 글꼴 적용이 모두 완료 됐습니다. 정확하게 적용이 됐는지 확인하고 싶으시다면 '그' 라는 글자를 보시면 확인이 가능합니다.


기존 Flatinum에서 쓰던 글꼴에서는 '그' 라는 글자를 보면 ㄱ 이 90도 직각이 아닙니다. 


그에 비해 나눔고딕은 '그'라는 글자를 보면 ㄱ이 90도 직각으로 되어 있습니다. 이 차이점이 존재하니 확인하시면 될것 같습니다.



제가 알려드렸던 사이트에 방문하면 더 많은 글꼴체가 존재합니다. 굳이 나눔 고딕만 쓰지 않아도 되니 다양한 글꼴체를 적용해서 원하는 스킨을 만드시기 바랍니다.


이것으로 포스팅 마치겠습니다.


+ Recent posts