디지털 에이전시인 이롭게에서 디지털 환경에 최적화한 웹 전용 폰트인 이롭게 바탕체를 다운로드하는 방법을 살펴본다. 웹폰트 이외에도 기본 폰트도 무료로 사용할 수 있는 이롭게 바탕체를 윈도우 11에 설치하는 방법과 코딩 시에 사용하는 방법도 살펴본다.
이롭게 바탕체 다운로드
CONTENTS
이롭게에서 개인 및 기업 등 누구나 개인적인 용도 뿐만 아니라 상업적인 용도에도 무료로 사용할 수 있도록 제공하는 무료 폰트인 이롭게 바탕체를 소개한다. 이롭게 바탕체는 기본적으로 적은 용량으로 웹사이트 구축 시 빠른 로딩이 가능한 웹폰트를 기본으로 한다. 하지만 웹폰트 이외에도 기본 폰트인 이롭게 바탕체도 무료로 제공하고 있음으로 다양한 용도로 사용이 가능한 글꼴이다. 다음에서 제시하는 순서대로 따라 하면 이롭게 바탕체를 무료로 다운로드해서 사용할 수 있다.
이롭게 바탕체 사이트에 접속한다.
대부분 포털사이트에서 이롭게 바탕체로 검색하면 이롭게에서 직접 운영하는 이롭게 바탕체 사이트가 최상위에 랭크한다.
위의 이미지를 누르면 이롭게 바탕체 홈페이지로 연결하는데, 아래로 스크롤하면 이롭게 바탕체를 다운로드할 수 있는 버튼이 나온다. 이롭게 바탕체는 기본 폰트와 웹폰트 2가지로 제공하고 있는데, 이중 웹폰트는 디지털 환경에 최적화한 국내 최초이 웹 전용 바탕체이다.
이롭게 바탕체 다운로드
이롭게 바탕체 홈페이지에서 TTF 포맷 또는 OTF 포맷 글꼴을 다운로드하려면 폰트 다운로드 버튼을 누르면 된다. 이러한 TTF, OTF 포맷 글꼴은 기본 글꼴이므로 다양한 용도로 사용이 가능하다.
웹폰트 다운로드를 누르면 eot, woff 포맷을 지닌 명칭 그대로 웹에서 사용할 수 있는 웹폰트를 다운로드할 수 있다. 둘다 웹폰트 포맷이지만 eot 보다는 아직까지는 woff 포맷이 웹폰트로 주로 사용된다. 아래에 링크한 이롭게 바탕체 기본 폰트 다운로드 버튼을 누르면 ttf와 otf 글꼴을 담고 있는 압축 포맷 파일을, 이롭게 바탕체 웹폰트 다운로드 버튼을 누르면 eot, woff 폰트를 담고 있는 압축 포맷 파일을 각각 다운로드할 수 있다.
우선 다운로드한 네이버 나눔 글꼴 전체를 컴퓨터에 설치하는 방법을 살펴보고 나서, 개별 글꼴만 선별적으로 다운로드해서 사용하는 방법을 추가한다. 아래는 각각 다운로드한 이롭게 바탕체 기본 폰트와 웹폰트로 개인적인 보관용으로 첨부한다.
이롭게 바탕체 설치하기
파일 다운로드 폴더를 따로 설정하지 않았다면 화면 하단에 글꼴 압축 포맷 파일이 나타난다. 그렇지 않다면 컴퓨터 내 문서에서 다운로드 폴더 또는 설정에서 다운로드를 지정한 폴더에 가면 zip 확장자를 지닌 글꼴 파일을 찾을 수 있다.
우선 이롭게 바탕체 기본폰트를 먼저 살펴보고, 웹폰트는 마지막에 코딩 시에 사용하는 방법과 함께 살펴본다. 이롭게 바탕체 기본폰트를 다운로드했으면 알집 또는 반디집 등 압축해제프로그램을 사용하여 풀어준다. 그러면 이롭게 바탕체 기본 폰트에는 ttf와 otf 글꼴 파일과 누구나 사용이 가능하다는 라이선스를 담고 있는 pdf 파일이 담겨 있다. 기본적으로 ttf만 사용하면 되므로, ttf 파일을 더블 클릭한 후에 나오는 팝업에서 설치 버튼을 누르면 자동으로 윈도우 11 글꼴 폴더에 저장한다.
참고로, 글꼴은 일반적으로 트루타입인 TTF와 오픈타입인 OTF로 나뉘는데, 둘 다 모든 컴퓨터 운영체계와 인쇄 시에 사용이 가능하다. 하지만 TTF를 윈도우용 서체 그리고 OTF를 맥용 서체로 잘못 알려져 있는데, OTF가 워낙 고해상도이다 보니 구형 컴퓨터나 구형 윈도우 운영체계에서 오류를 발생하는 사례가 있어 맥용에만 OTF를 사용한다는 인식이 있다. 따라서 간단한 문서 작업이나 평이한 인쇄 시에는 트루타입인 TTF를 사용하면 된다. OTF는 조금 더 고해상도 디자인이나 인쇄물에서 사용하므로, 일반인들은 대부분 TTF만으로 충분하다.
만약 고해상도 디자인 작업이나 유료로 판매하는 출력물 인쇄용이라면 오픈타입인 OTF 글꼴을 설치한다. 하지만 앞에서도 언급했지만 일반적으로 윈도우 운영체계를 사용하는 일반인들이라면 굳이 OTF 말고 TTF를 설치하기를 추천한다. otf 글꼴이 한글을 제대로 인식하지 못하거나, 한글 문서를 PDF로 변환할 때 한글을 온전히 구현하지 못하는 사례가 많기 때문이다.
이롭게 웹폰트 사용하기
다운로드한 이롭게 바탕체 웹폰트 파일을 압축 해제하면 eot, woff 파일과 누구나 사용이 가능하다는 라이선스를 담고 있는 pdf 파일이 나온다. 웹폰트로 eot는 이제는 사용하지 않으므로 woff만 사용하면 된다. 하지만 woff가 웹폰트이긴 하지만 위에서 ttf, otf 글꼴 파일을 다운로드해서 설치한 대로 설치하는 글꼴이 아니다. woff는 기존에 컴퓨터에 설치해서 사용할 수 있는 ttf와 otf 글꼴 파일을 압축해서 웹에서 사용할 수 있도록 만든 폰트 포맷이기 때문이다.
이러한 이롭게 웹폰트인 woff는 컴퓨터에 설치하거나 바로 열어 볼 수 없다. 웹사이트를 제작 시에 서버에 woff 파일을 올려서 사용하도록 고안된 웹폰트이기 때문이다. 실제로 모바일 또는 브라우저 등 웹에서 보여지는 글꼴 포맷은 WOFF가 일반적이다. 코딩 시에는 대부분 웹과 인쇄에 모두 사용 가능한 TTF 포맷과 함께 웹에서 사용하도록 특별히 고안된 WOFF 포맷, 이 둘을 함께 사용한다. 위에서 웹폰트 woff를 다운로드했으므로 이 woff를 CDN으로 연결할 수도 있지만, 이건 개인이 하기에는 약간 무리가 있다. 대부분 웹폰트로 사용할 수 있는 폰트는 글꼴 개발사 또는 유통사에서 CDN으로 제공한다. 다음에서 이롭게 바탕체 woff 포맷으로 CDN 연결 방식을 활용하는 방법을 살펴본다.
이롭게 바탕체는 현재 폰트 사이트의 대명사처럼 자리한 눈누 사이트에서 CDN 방식으로 웹폰트를 지원하고 있다. 코딩에서 이롭게 바탕체 웹폰트를 사용하려면 눈누 사이트에서 가져온 코드를 CSS에 붙여넣기하면 자동으로 이롭게 바탕체 woff 포맷 글꼴을 다운로드한다.
@import url('//cdn.jsdelivr.net/font-iropke-batang/1.2/font-iropke-batang.css');
body { font-family: 'iropke batang', serif}
.iropke { font-family: 'iropke batang', serif}
따라서 이롭게 바탕체 웹폰트를 적용할 태그 또는 클라스를 활용해 font-family 속성과 속성값을 넣어준다. 예를 들어 코딩 시 모든 웹에 있는 텍스트에 이롭게 바탕체 폰트를 적용하려면, 위에 같이 body 태그에 폰트 스타일을 추가한다. 이를 통해 웹 상에서 다른 사람들도 자신의 컴퓨터에 글꼴을 설치하지 않아도 동일한 글꼴을 볼 수 있다. 또는 위에서 .iropke 클라스를 활용한 예시처럼, 웹 상에서 특정 영역만에 이롭게 바탕체 폰트를 사용하려면 해당영역 태그명 또는 클라스명을 활용하여 CSS에서 스타일을 설정한다.
