구글과 어도비의 합작품인 Noto Sans 폰트를 알아보자.
이미 알 사람들은 알겠지만 이 폰트가 전세계 언어를 (아직은 안나온 것은 추후할 예정) 무료로 배포할 예정이라서 관심을 많이 가지고 있었다.

 

Adobe Typekit Blog (한글)
Google Developers Korea

구글

  • 전반적 방향 설정
  • 글꼴 사양 및 요건 지정
  • 언어별 지역별 테스팅 리소스 제공
  • 비용부담

어도비

  • 오랜 경험에서 우러나온 잘 알려진 글꼴 디자인 전문성
  • 일본 가나 디자인
  • 유니코드 한자 디자인 원형 제공
  • 프로젝트 조율 및 한중일 글꼴 전문 업체 협력
  • 글꼴 파일 생성 및 테스트 자동화

샘플 이미지

폰트 설치하기

Install에 가면 설치 하는 방법을 알 수 있다.
설치방법은 윈도우와 맥만 설명하고 리눅스는 링크 타고 가서 보고 하면 될거 같다.

Windows

  1. 폰트 패키지(.zip)를 다운로드 한다.
  2. 패키지 압축 푼다.
  3. 시작메뉴에서 “글꼴(fonts)”을 검색하거나 시작 → 제어판 → 글꼴로 이동
  4. 모든 폰트를 선택하고 글꼴 폴더로 끌어다 놓습니다.

macOS

  1. 폰트 패키지(.zip)를 다운로드 한다.
  2. 패키지를 더블클릭하여 압축 푼다.
  3. 서체표 열기 (Finder → 응용 프로그램 → 서체 목록으로 이동)
  4. 모든 글꼴 파일을 선택하고 글꼴 책의 글꼴 열 (즉, 두 번째 열)으로 끈다.

이용방법

Early Access Noto Sans KR

Examples

font-family: "Noto Sans", "Noto Sans CJK JP", sans-serif;
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);
@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);
@import url(http://fonts.googleapis.com/earlyaccess/notosanssc.css);

/*  한국어 */
: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;
}
<div lang="ko"> ... 한국어 콘텐츠</div>
<div lang="ja"> ... 일본어 콘텐츠</div>
<div lang="zh-Hans"> ... 중국어 간체 콘텐츠</div>

 
폰트가 굵기가 다양하게 있어서 다른 폰트보다는 스타일 맞게 적용 할 수 있을 것 같다.

그외 한글 무료 웹폰트들

구글에서 제공하는 무료 웹폰트들도 알아주면 좋을 거 같아서 추가해본다.
※ ealry access 폰트들은 이름만 추가해서는 동작하지 않으므로 소스경로까지 import 해야만 한다.

  1. 하나체

    URL: @import url(http://fonts.googleapis.com/earlyaccess/hanna.css);

    적용: font-family: ‘Hanna’, serif;

  2. 제주고딕

    URL: @import url(http://fonts.googleapis.com/earlyaccess/jejugothic.css);

    적용: font-family: ‘Jeju Gothic’, serif;

  3. 제주한라산

    URL: @import url(http://fonts.googleapis.com/earlyaccess/jejuhallasan.css);

    적용: font-family: ‘Jeju Hallasan’, serif;

  4. 제주명조

    URL: @import url(http://fonts.googleapis.com/earlyaccess/jejumyeongjo.css);

    적용: font-family: ‘Jeju Myeongjo’, serif;

  5. KoPub 바탕체

    URL: @import url(http://fonts.googleapis.com/earlyaccess/kopubbatang.css);

    적용: font-family: ‘KoPub Batang’, serif;

  6. 나눔 Brush

    URL: @import url(http://fonts.googleapis.com/earlyaccess/nanumbrushscript.css);

    적용: font-family: ‘Nanum Brush Script’, serif;

  7. 나눔 고딕체

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

    적용: font-family: ‘Nanum Gothic’, serif;

  8. 나눔 고딕 코딩

    URL: @import url(http://fonts.googleapis.com/earlyaccess/nanumgothiccoding.css);

    적용: font-family: ‘Nanum Gothic Coding’, serif;

  9. 나눔 명조체

    URL: @import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);

    적용: font-family: ‘Nanum Myeongjo’, serif;

  10. 나눔 Pen Script

    URL: @import url(http://fonts.googleapis.com/earlyaccess/nanumpenscript.css);

    적용: font-family: ‘Nanum Pen Script’, serif;