웹폰트 시대 — 이미지로 만들던 글자를 텍스트로

오랫동안 국내 웹에서 예쁜 글씨를 쓰는 방법은 하나였습니다. 디자이너가 원하는 폰트로 제목을 만들어 이미지로 저장해 넣는 것이었죠. 방문자의 PC에 그 폰트가 없으면 깨지기 때문에, 텍스트 대신 그림으로 글자를 넣는 편법을 쓴 것입니다. 그런데 이제 이 오랜 관행을 바꾸는 기술이 자리 잡고 있습니다. 바로 웹폰트(Web Font)입니다.

웹폰트란 무엇인가?

결론부터: 방문자의 컴퓨터에 폰트가 없어도, 사이트가 폰트를 함께 불러와 원하는 글씨체로 보여주는 기술입니다. 예전에는 방문자 PC에 설치된 폰트만 쓸 수 있어서 선택지가 좁았지만, 웹폰트는 사이트가 폰트를 직접 제공하므로 어떤 글씨체든 텍스트 그대로 쓸 수 있습니다.

왜 지금 웹폰트인가

웹폰트 자체는 이전에도 있었지만, 한글은 글자 수가 많아 폰트 파일이 무거웠습니다. 영문 폰트가 수백 글자면 되는 데 비해 한글은 수천 자가 필요해, 파일이 커서 느렸던 것입니다. 하지만 통신 속도가 빨라지고 폰트를 가볍게 제공하는 방식이 발전하면서, 이제 한글 웹폰트도 실용적인 수준이 됐습니다.

여기에 무료로 쓸 수 있는 좋은 한글 폰트가 늘어난 것도 큰 계기입니다. 예전에는 폰트 저작권과 비용이 부담이었지만, 이제는 상업적으로도 자유롭게 쓸 수 있는 폰트가 많아졌습니다. 기술과 환경이 함께 무르익은 것입니다.

글자를 이미지로 만들면 잃는 세 가지

1. 검색이 안 된다

이미지 속 글자는 검색엔진이 읽지 못합니다. 회사명이나 핵심 문구를 예쁘게 이미지로 만들어 넣으면, 그 중요한 단어가 검색에서 사라지는 셈입니다. 웹폰트로 텍스트를 쓰면 예쁜 글씨체를 유지하면서도 검색에 잡힙니다.

2. 수정이 번거롭다

이미지로 만든 글자는 문구 하나 고치려 해도 디자인 파일을 열어 다시 만들어야 합니다. 텍스트라면 몇 초면 될 일이, 이미지라면 디자이너의 손을 거쳐야 합니다. 관리의 문턱이 높아지는 것입니다.

3. 반응형에 불리하다

이미지 글자는 화면 크기가 바뀌어도 유연하게 대응하지 못합니다. 작은 화면에서 뭉개지거나 잘립니다. 웹폰트 텍스트는 화면에 맞춰 자연스럽게 흐르므로, 반응형 웹과 잘 맞습니다.

웹폰트가 브랜드에 주는 것

웹폰트의 가치는 검색이나 관리 편의만이 아닙니다. 브랜드의 인상을 만드는 데도 큰 역할을 합니다. 글씨체는 목소리의 톤과 같아서, 같은 문구라도 어떤 폰트로 쓰느냐에 따라 신뢰감·세련됨·친근함이 달라집니다. 예전에는 이 표현을 이미지로만 할 수 있었지만, 이제는 텍스트로 하면서도 브랜드에 맞는 글씨체를 유지할 수 있습니다.

특히 회사 전체가 일관된 폰트를 쓰면 사이트 전반에 통일된 인상이 생깁니다. 제목은 개성 있는 폰트로, 본문은 읽기 편한 폰트로 — 이런 조합을 텍스트로 구현할 수 있게 된 것이 웹폰트의 힘입니다. 브랜드 아이덴티티를 웹에서도 온전히 표현할 수 있게 된 셈입니다.

무료 폰트, 어떻게 고를까

최근 상업적으로 자유롭게 쓸 수 있는 좋은 한글 폰트가 많아졌습니다. 다만 아무거나 고르기보다 몇 가지 기준을 두는 것이 좋습니다. 우선 본문용은 화면에서 읽기 편한 것을, 제목용은 브랜드의 성격에 맞는 것을 고릅니다. 너무 많은 폰트를 섞으면 산만해지므로, 제목용과 본문용 두세 종으로 제한하는 것이 깔끔합니다.

그리고 반드시 '웹폰트 사용이 허용된' 라이선스인지 확인해야 합니다. 화면에 예쁘게 보인다고 저작권을 어기면 나중에 문제가 됩니다. 라이선스를 확인하고, 무게가 가벼운지도 함께 보면 실패하지 않습니다.

웹폰트를 쓸 때 주의할 점

웹폰트도 만능은 아닙니다. 폰트 파일을 불러와야 하므로, 무거운 폰트를 여러 개 쓰면 페이지가 느려질 수 있습니다. 그래서 꼭 필요한 폰트만 골라 쓰고, 가볍게 제공하는 방식을 적용하는 것이 중요합니다. 특히 모바일에서는 폰트 무게가 속도에 직접 영향을 주므로 신중해야 합니다.

또 폰트가 로딩되기 전 잠깐 다른 글씨로 보였다가 바뀌는 현상도 관리해야 합니다. 이런 세부를 잘 다루면 웹폰트의 장점만 취할 수 있습니다. 기술을 쓰는 것과 잘 쓰는 것은 다릅니다.

실제 사례 — 제목을 텍스트로 바꾼 회사

한 회사의 사이트는 모든 제목이 이미지로 만들어져 있었습니다. 디자인은 깔끔했지만 두 가지 문제가 있었습니다. 제목에 담긴 핵심 키워드가 검색에 전혀 잡히지 않았고, 문구를 바꿀 때마다 디자이너에게 요청해야 했습니다. 웹폰트를 적용해 제목을 텍스트로 바꾸자, 같은 디자인을 유지하면서도 검색에 잡히기 시작했고 담당자가 직접 문구를 수정할 수 있게 됐습니다. 보기에는 똑같은데 '일하는' 사이트가 된 것입니다.

자주 묻는 질문

Q. 웹폰트를 쓰면 사이트가 느려지지 않나요?

무거운 폰트를 무분별하게 쓰면 느려질 수 있습니다. 하지만 꼭 필요한 폰트만 골라 가볍게 제공하면 체감 속도에 큰 영향 없이 쓸 수 있습니다. 속도는 웹폰트 여부보다 어떻게 적용하느냐의 문제입니다.

Q. 저작권 문제는 없나요?

웹폰트로 쓰려면 '웹폰트 사용이 허용된' 폰트여야 합니다. 최근에는 상업적으로 자유롭게 쓸 수 있는 좋은 한글 폰트가 많아졌으니, 라이선스를 확인하고 쓰면 됩니다.

Q. 기존 이미지 제목을 다 바꿔야 하나요?

한 번에 다 바꿀 필요는 없습니다. 검색에 중요한 제목과 자주 수정하는 문구부터 텍스트로 바꾸고, 나머지는 개편 때 정리하는 것이 현실적입니다.

Q. 디자인 자유도가 떨어지지 않나요?

오히려 좋은 웹폰트가 늘면서 선택지가 넓어졌습니다. 예쁜 글씨체를 텍스트로 쓸 수 있으니, 디자인과 실용성을 동시에 얻습니다.

웹폰트 기반의 홈페이지가 필요하면 디자인러버스가 함께합니다.