[CSS] 구글 폰트 (Google font) 이용하기


안녕하세요. 명월입니다.


이 글은 구글 폰트에 대한 소개하는 글입니다.


우리가 홈페이지던가 웹 페이지를 만들 때 폰트를 신경 안 쓸 수가 없습니다. 특히 블로그에 글을 작성할 때는 더욱더 신경을 씁니다.

왜냐하면 웹 문서가 아무리 사진과 동영상이 많아져도 아직은 주류가 글이고 글씨 폰트로 블로그에 대한 품격이 보이기 때문입니다.


예전에는 무료 폰트가 많지 않아서 한글날에 무료 배포 폰트던가 웹 사이트를 검색해서 폰트 나눔을 한다고 하면 받아서 사용하곤 했었습니다. 무료 폰트도 좋은 폰트가 많았는데 이상하게 오래 쓰지를 못하겠더라고요.

그나마 제가 블로그 개선 전에 필기체 같은 무료 폰트 구해서 사용했었는데, 글이 많아지면 눈이 아프더라고요.. 폰트 때문에 가독성도 많이 떨어지고 떨어지니 글을 끝까지 읽지를 못하더군요.


그러다 찾던 중 구글 폰트를 찾았습니다.

링크 - https://fonts.google.com/


막 화려하거나 엄청 이쁜 폰트는 아닌데 웹상에서 사용하기 딱 좋은 폰트들이 많습니다. 이제부터는 폰트 구걸 안 해도 되겠습니다. ㅠㅠ

사용할 언어를 선택하고 그 중 마음에 드는 폰트를 선택합니다.

그럼 오른쪽 하단에 링크와 css에 사용할 font-family가 표시됩니다.


사용할 css파일에 복사 붙여넣기 합니다.

@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR&display=swap');
body{
  font-family: 'Noto Sans KR', sans-serif;
}

적용한 화면이 지금 이 블로그입니다.

여기까지 구글 폰트에 대한 설명이었습니다.


궁금한 점이나 잘못된 점이 있으면 댓글 부탁드립니다.