글자 간격을 넓혔는데 오히려 읽기 불편해진 이유

자간을 조금 올렸더니 왠지 정돈된 느낌이 날 것 같았다. 막상 화면에 띄워보니 글자가 흩어지고, 눈이 오히려 더 피로해진다. 이 실패가 낯설지 않다면, 이유가 있다.

어디서 무너졌는지를 실패 지점부터 거꾸로 짚어보자. 원인을 알면 다음번엔 같은 실수를 반복하지 않는다.

첫 번째 실패 지점, 폰트는 이미 자간을 계산해서 나왔다

폰트 파일을 만들 때 제작자는 글자 사이 기본 간격을 글꼴 내부에 미리 저장해 둔다. 커닝(kerning)과 메트릭(metrics)이라 부르는 이 값들은, 특정 글자 조합이 나란히 놓였을 때 시각적으로 균형 잡히도록 제작 단계에서 이미 미세 조정된 것이다.

CSS의 letter-spacing이나 자간 슬라이더가 하는 일은 이 내장값 위에 수치를 더하거나 빼는 것이다. 폰트가 이미 최적화한 균형을 출발점으로, 우리가 추가 조작을 얹는 구조다. 아무 근거 없이 양수를 올리면, 제작자가 공들여 맞춰둔 균형 위에 불필요한 공백이 쌓인다. "넓히면 여유롭겠지"라는 직관이 어긋나는 이유가 바로 여기다.

두 번째 실패 지점, 음절 블록 구조가 영문보다 훨씬 빨리 무너진다

영문은 단어 단위로 의미를 인식한다. "typography"를 읽을 때 열 글자를 하나씩 보는 게 아니라 단어 형태 전체를 패턴으로 파악하기 때문에, 자간이 조금 넓어져도 단어 내부가 시각적으로 묶여 있는 한 인식이 크게 흔들리지 않는다.

우리말은 다르다. 초성·중성·종성을 하나의 정사각형 블록 안에 담는 구조로 설계되어 있고, 그 블록 하나하나가 음절 단위 인식의 기본 단위다. 폰트 제작 단계에서 이미 블록 내부 자소 간 균형과 블록 간 시각 간격이 함께 조율돼 있는데, 여기에 letter-spacing을 추가로 올리면 블록 사이 공백이 단어 경계처럼 느껴지기 시작한다.

'안녕하세요'를 읽는데 '안 녕 하 세 요'처럼 음절이 낱개로 분리되어 보이는 그 느낌이다. 영문보다 훨씬 빨리, 그리고 더 확실하게 읽기 흐름이 끊긴다. 음절 블록 구조를 쓰는 언어에서 자간을 조금만 올려도 불편함이 급격히 커지는 이유다.

그래서 웹 타이포그래피 현장에서는 한글 본문에 기본값보다 약간 좁은 음수 자간, 대략 -0.01em 에서 -0.02em 수준을 적용하는 게 관행이다. 폰트 제작 방식 특성상 기본 간격이 다소 넓게 설정되는 경우가 많고, 이를 살짝 당겨 덜 흩어져 보이도록 보정하는 것이다.

세 번째 실패 지점, 제목에 양수 자간을 얹으면 가장 크게 무너진다

역직관적이지만, 글자가 클수록 자간을 좁혀야 자연스럽다.

폰트에 내장된 자간값은 특정 크기를 전제로 설계돼 있는데, letter-spacing의 절댓값은 글자 크기에 비례해서 시각적으로 함께 커진다. 12px 본문에서 적당하던 간격이, 36px 제목에 그대로 적용되면 물리적 거리가 세 배로 늘어난다. 의도한 것보다 훨씬 과하게 벌어진 결과가 나오는 것이다.

대형 헤드라인에 음수 트래킹을 쓰는 것은 영문 타이포그래피의 오래된 원칙이다. 국문도 마찬가지다. 제목이 클수록 letter-spacing을 0이거나 음수 값으로 조이는 편이 훨씬 정돈된 인상을 준다.

반대로 제목에 양수 자간을 주면, 음절이 낱개로 뜨는 그 무너짐이 더 크게, 더 눈에 띄게 일어난다. 본문보다 제목에서 먼저 망가지는 이유가 이 때문이다.

자간보다 먼저 확인해야 할 것들

자간을 조작해도 나아지지 않는다면, 더 근본적인 지점이 막혀 있다는 신호다.

가장 먼저 볼 것은 행간이다. 줄과 줄 사이가 충분히 벌어져야 눈이 다음 줄을 찾아가기 쉽다. 본문의 line-height는 1.5 이상이 일반적으로 권장된다. 행간이 좁으면 자간이 아무리 적당해도 읽는 내내 피로가 쌓인다. 행간을 먼저 잡고 나서 자간을 건드리는 순서가 맞다.

font-weight도 체감이 크다. 너무 얇은 100~200 웨이트는 작은 화면에서 선명하게 보이지 않고, 너무 굵은 800~900은 글자끼리 뭉쳐 보인다. 본문에는 Regular(400) 또는 Medium(500)이 대부분 무난하다.

더 근본적인 원인은 폰트 선택 자체다. 본문용으로 설계된 폰트와 제목용 폰트는 획 처리와 내부 공간 설계가 처음부터 다르다. 본문에 디스플레이 폰트를 쓰면 자간을 어떻게 조작해도 읽기 불편한 상태를 벗어나기 어렵다. 폰트비에서 각 폰트의 weight 스펙과 사용 범위를 확인하면 본문용인지 제목용인지 판단하는 데 도움이 된다. 조건을 말로 설명하기 어려울 때는 AI 폰트 찾기(/find)로 맞는 폰트를 추천받아볼 수 있다.

그래도 자간에 손대야 하는 경우

대부분의 본문 작업에서는 자간을 건드리지 않거나, 아주 미세한 음수 범위 안에서만 조정하는 것이 안전하다. 예외가 되는 상황은 다음과 같다.

기본 자간이 특히 넓게 설정된 폰트를 쓸 때다. 폰트마다 기본값 설계가 달라서 어떤 폰트는 그냥 놔둬도 흩어져 보인다. 약간의 음수 보정으로 충분하다.

영문 대문자나 약어가 섞인 제목도 다르게 접근해야 한다. 영문 대문자는 자간을 살짝 넓혀주면 더 읽기 좋아지는 경향이 있어, 국문 전용 본문과는 기준이 다르다.

레이아웃 제약이 있을 때도 마찬가지다. 좁은 칸에 글자를 맞추거나 제목이 특정 너비에 딱 맞도록 조정해야 할 때는, 가독성보다 레이아웃 요건이 우선되는 상황임을 인식하고 조정폭을 최소화하면 된다.

자간을 넓혔는데 뭔가 어색하다는 느낌이 드는 순간, 그 직관이 맞다. 그때는 되돌리고 행간·웨이트·폰트 선택부터 다시 보는 게 빠르다.