본문 바로가기
웹프로그래밍/CSS

구글 Noto 한국어 글꼴을 웹에서 마음껏!

jihun202 2016. 5. 24. 16:00
반응형
훈민정음 반포 569돌을 맞이해서 자그마한 선물을 마련했습니다. 

작년 7월에 발표한 Noto Sans CJK 글꼴을 이제 여러분의 웹 사이트에서도 마음대로 쓸 수 있습니다. Noto Sans CJK 글꼴 패밀리 가운데 한국어 전용인 Noto Sans KR을 Google Fonts Early Access를 통해 제공합니다. Noto Sans KR은 현대 한국어 뿐 아니라, 옛한글도 완벽하게 지원하고 총 6가지 굵기(weight) 중에 마음대로 골라 쓸 수 있습니다. ( 데모 페이지 )



구글은 웹과 인터넷에서 한글을 보다 아름답고 다양하게 표현할 수 있도록 많은 노력을 기울여 왔습니다. 그 일환으로 국내 글꼴 제작사가 만든 여러 종류의 한국어 글꼴을 구글 웹 폰트 서비스에 더해 왔습니다.

이제 Noto Sans KR을 11번째 한국어 웹 글꼴로 내놓습니다.

웹 디자이너 여러분, 어떤 플랫폼이나 화면 배율에서도 미려하고, 웹 접근성도 우수하며 검색 엔진 친화적인 웹 사이트 디자인을 원하신다면 웹 글꼴을 적용해 보세요.

어떻게 쓰냐고요? 매우 간단합니다. 여러분의 웹 페이지 스타일 시트에 다음을 추가하시고, 글꼴로 'Noto Sans KR'을 지정하세요.
font-family: 'Noto Sans KR', sans-serif;



한중일 다국어 페이지를 만드신다고요? 문제 없답니다. html에서 콘텐츠의 언어를 'lang' 태그로 명시하고 다음을 스타일 시트에 더하시면 됩니다.



/*  한국어 */
:lang(ko) {
 font-family: 'Noto Sans KR', sans-serif;
}
/* 일본어 */
:lang(ja) {
 font-family: 'Noto Sans JP', sans-serif;
}
/* 중국어 (간체) */
:lang(zh-Hans) {
 font-family: 'Noto Sans SC', sans-serif;
}
... 생략 ...

<body>
.... 생략 ....
<div lang="ko"> ... 한국어 콘텐츠</div>
<div lang="ja"> ... 일본어 콘텐츠</div>
<div lang="zh-Hans"> ... 중국어 간체 콘텐츠</div>

 

출처: http://googledevkr.blogspot.kr/2015/10/noto.html

반응형
저작자표시

'웹프로그래밍 > CSS' 카테고리의 다른 글

안드로이드 웹뷰 스크롤바 안보일 때 (Android Webview scrollbar not visible, div overflow auto, scroll case)  (0) 2020.06.25
ios mobile 에서 터치시 background 색상 들어가는 문제  (0) 2017.03.07
IE에서 input text 박스 x 버튼 숨기기  (0) 2015.09.08
background-size cover only Y ?  (0) 2015.05.08
CSS3 for IE7, 8 {https://github.com/scottjehl/Respond/}  (0) 2015.04.27

'웹프로그래밍/CSS' Related Articles

티스토리툴바