본문으로 바로가기

Noto Sans(본고딕) 웹폰트

category 웹코딩/CSS 2015. 8. 14. 11:41

Noto Sans를 웹폰트로 만들어 배포되고 있는 것들을 테스트하고 이를 소개하는 내용입니다. 웹폰트 사용을 고려하시는 분들께 도움이 되길 바랍니다.

Noto Sans 웹폰트 소개

Noto Sans 웹폰트는 Noto Sans CJK를 웹폰트로 사용하기 위해 한국어 버전인 Noto Sans CJK KR에서 자주 쓰이는 완성형 한글 2,350자(KS X 1001 표준) 만 추출하여 만들어지고 있다. 이 제작과정은 한글 웹 폰트 경량화해 사용하기에 자세히 설명되어 있으며, 이를 이용해 NotoSansKR-Hestia라는 웹폰트가 공유 되고 있다(이하 Noto Sans Korean 이라고 칭함).

또한, 본고딕(Noto Sans) 웹폰트 사용하기에서도 비슷한 웹폰트를 배포(이하 notokr 이라 칭함)하고 있으며, NotoSansKR-Hestia와 비교해서 약간의 차이를 보이고 있다. 둘 중에 원하는 것을 선택하여 사용하되 아래에서 그 차이를 참고하도록 하자. Noto Sans CJK는 무료로 제공되는 폰트이기에 웹폰트로 사용하는 것에 제약사항은 없다.

Noto Sans의 원본은 Google Noto Fonts에서 다운로드 받을 수 있다.

Noto Sans Korean

Noto Sans Korean의 자세한 정보는 NotoSansKR-Hestia에서 확인할 수 있다.

See the Pen Noto Sans Korean by Douglas Ham (@uzugoer) on CodePen.

  • IE8 (윈도우 XP) : 지원 않함.
  • IE9 (윈도우 7) : 21px 이상부터 글자의 깨짐없이 제대로 표현
  • IE11 (윈도우 7) : 어느 크기든 이상없이 제대로 표현
  • IE11 (윈도우 8.1) : 어느 크기든 이상없이 제대로 표현
  • Chrome : 어느 크기든 이상없이 제대로 표현
  • Firefox : 어느 크기든 이상없이 제대로 표현
  • Opera : 어느 크기든 이상없이 제대로 표현

notokr

notokr의 자세한 정보는 본고딕(Noto Sans) 웹폰트 사용하기에서 확인할 수 있다.

  • IE8 (윈도우 XP) : 힌팅이 적용되지 않아 비추천.
  • IE9 (윈도우 7) : 어느 크기든 이상없이 제대로 표현
  • IE11 (윈도우 7) : 어느 크기든 이상없이 제대로 표현
  • IE11 (윈도우 8.1) : 어느 크기든 이상없이 제대로 표현
  • Chrome : 어느 크기든 이상없이 제대로 표현
  • Firefox : 어느 크기든 이상없이 제대로 표현
  • Opera : 어느 크기든 이상없이 제대로 표현

Noto Sans Korean과 비교했을때 전체적으로 Noto Sans Korean이 좀 더 굵게 표시된다.

Noto Sans 웹폰트의 한계

비단 Noto Sans 웹폰트의 문제라기 보다는, XP에서 웹폰트를 사용하는 것에 대한 문제이기도 하다. 우리가 흔히 힌팅(Hinting)이라고 부르는 기능이 XP에서는 적용되질 않는 것 같다. 이에 대한 자세한 것은 알지 못하지만 XP가 오늘도 걸림돌이 되는 건 변함없는 사실이다. XP... 포기하면 편하다.

Noto Sans Korean은 XP의 IE8에서는 적용되지 않는다. 표면적으로는 이를 지원하는 eot 파일을 포함하고 있으나 Windows 7에서 IE8을 사용하는 사람을 위한 파일이지 XP를 위한 것은 아니라는 것이다. 어짜피 적용되도 힌팅이 적용되지 않는 한 제대로 표현되는 글꼴은 많지 않다.

반면, notokr은 XP의 IE8에서도 적용되나, 앞서 언급했듯이 힌팅이 되질 못한다.

notokr XP IE8


'웹코딩 > CSS' 카테고리의 다른 글

트위터의 fave 애니메이션 - 즐겨찾기 버튼  (3) 2015.09.03
Normalize.css - CSS 초기화  (6) 2015.08.24
CSS3 이면가시성(backface-visibility) 속성  (2) 2015.07.29
CSS3 외형(Appearance) 속성  (0) 2015.07.28
CSS 크기 단위  (0) 2015.06.17