mir.pe (일반/밝은 화면)
최근 수정 시각 : 2024-09-14 00:56:14

웹 폰트

글꼴 관련 문서
{{{#!wiki style="margin:0 -10px -5px; min-height:calc(1.5em + 5px)"
{{{#!folding [ 펼치기 · 접기 ]
{{{#!wiki style="margin:-5px -1px -11px; word-break:keep-all" 		손글씨
서예 · 캘리그래피 · 필기체 · 서명 · 필기 · 필적
필기도구 · 문방사우
분류
한글 바탕 · 돋움
라틴 문자 Vox-ATypI 분류 · 세리프 · 산세리프 · 이탤릭 · 블랙 레터
한자 관련 틀 참조
인쇄 / 디자인
활자( 금속활자) · 합자 · 타이포그래피
포스트스크립트 · OTF · TTF · 웹 폰트 · 클리어타입 · 가변 글꼴
목록
글꼴 목록 · 상업용 목록 · 분류:글꼴
기타/관련 항목
속기 · 문자 체계 · 문장 부호 · 전각과 반각 · 볼드
}}}}}}}}} ||

1. 개요2. 특징
2.1. 장점2.2. 단점
3. 웹 폰트 제공 서비스4. 웹 폰트 대안

1. 개요

웹 폰트는 서체 파일을 서버에 탑재해 클라이언트로 보내주는 방식의 기술이다.

웹 폰트로 사용되는 파일 형식으로는 EOT, WOFF, WOFF2 등이 있다.

2. 특징

2.1. 장점

해당 서체가 설치되지 않은 기기에서도 해당 서체를 볼 수 있다. 컴퓨터에 기본적으로 설치되어 있는 글꼴인 웹 안전 폰트(web safe font)만으로 웹페이지를 구성한 것에 비하면 웹 디자이너들에게는 정말 달가운 발전이 아닐 수 없다. 특히 모바일에서 큰 장점으로 작용하는데, 같은 제조사라도 폰 기종마다 탑재된 서체가 다르기 때문에 웹 쪽에서 서체를 적용하기 어려웠던 문제가 단번에 해결된다.

2.2. 단점

트래픽이 많이 증가한다. 그나마 영문 웹폰트는 수십 KB 정도의 수준이나 한글 웹폰트는 수백 KB ~ 2천 여 KB 수준으로 용량이 크다. 따라서 해당 폰트를 사용하기 전에 정말 그 폰트가 필요한지 고민해보는 게 좋을 것이다. 특히 모바일에서 큰 단점으로 작용하는데, 무제한 요금제가 아니면 용량은 금액과 직결되므로 욕먹기 딱 좋은 상황이 벌어진다.

요즘에는 인터넷 속도가 그래도 많이 나아졌지만 그래도 여전히 사용자의 환경에 따라 속도는 많이 느려질 수 있다. 2021년 기준으로도 열악한 통신환경이 제공되는데, 가령 무제한 데이터 요금제의 400kbps QoS 환경이 있다.[1] 웹폰트 로딩 전까지 기본 시스템 글꼴을 로딩하다가 로딩이 완료되면 해당 웹폰트로 바뀌는 FOUT(Flash of Unstyled Text) 현상이나, 글이 아예 안 보이다가 웹폰트 로딩후 글이 나타나는 FOIT(Flash of Invisible Text) 현상 등이 생기기도 한다.

용량문제와 이로 발생하는 사용자불편(화면 깜박임, 일부 텍스트만 보여지는 문제등)를 최소화하기 위해서 여러 기술들이 표준으로 도입되고 있다. subset, unicode-range, font-display등이 있다. 이를 사용하여 극단적으로 폰트를 쥐어짜면, 사용자 불편은 해소할 수 있다.

저작권 문제도 있기도 하다. 웹상에 올려서 배포해야만 하는데, 폰트 구입에서 사용권만 얻을뿐, 배포권을 주지 않는 경우가 부지기수이기 때문. 비영리적 사용이라면 인터넷 사용도 허가하는 폰트를 사용하는게 좋다. 이를 해결하기 위해 나온 확장자가 WOFF이며, 구글 폰트 같은 서비스를 사용하면 저작권 문제는 걱정하지 않아도 된다.

3. 웹 폰트 제공 서비스

4. 웹 폰트 대안

타이틀, 소제목 등에 개성있는 폰트를 사용하고 싶은 경우, 이미지를 사용하는 경우가 많다. GIF, PNG-8, SVG 형식의 이미지를 주로 사용한다. 일반적인 이미지 파일이라면 JPG의 용량이 작고 효율적인 경향이 있지만, 이는 사진에 주로 맞는 이야기이다. 같은 색이 많이 반복되는 단순한 그래픽이나 글씨를 대체하는 용도에 특히 저해상도(작은 크기)의 이미지는 무손실 압축 포맷의 이미지를 사용하는 것이 이미지가 선명도가 좋아 읽기 좋은 것은 물론 용량도 더 작다.

다만 이러한 텍스트 이미지를 사용하는 방식은 접근성 면에서 좋지 않다. 특히 이러한 경향은 우리나라 사이트에서 많이 보이는데, 일반적인 사용자에게는 보기에 문제가 없을지 몰라도, 스크린 리더를 사용하는 시각장애인들이나 브라우저의 번역 기능을 사용하는 외국인들은 해당 글자를 읽기 힘들다는 문제가 있다. 전자의 경우 대체 텍스트를 사용하는 방법이 있지만, 여전히 후자는 해결하지 못한다. 따라서 로고와 같은 특별한 경우가 아니라면 웬만하면 텍스트는 텍스트로 표시하는게 훨씬 좋다.

[1] 페이지 하나 띄우는데 5~8초까지 걸릴 수 있다.

분류