Back_to_Basics

{3줄 요약}

텍스트 간격은 글자 자체보다 읽는 리듬과 피로도를 좌우하는 설계 요소예요.
행간과 자간이 어색하면 내용이 좋아도 문장이 막히고 읽기 속도가 떨어져요.
간격 원칙을 알면 글자를 바꾸지 않고도 가독성을 크게 개선할 수 있어요.

공간이 글자를 읽히게 만들어요

같은 서체, 같은 크기의 텍스트라도 간격이 달라지면 완전히 다르게 읽혀요.

가장 빠르게 확인하는 방법이 있어요.
네이버 뉴스 기사를 열고, 브라우저 확대율을 150%로 올려보세요.
글자만 커지는 게 아니라 행간도 함께 커지면서 훨씬 읽기 편해지는 걸 느낄 수 있어요.
이게 행간의 역할이에요.

많은 사람들이 타이포그래피를 배울 때 서체 선택에는 신경 쓰면서 간격 설정을 소홀히 해요.
하지만 실무에서 가독성 문제의 상당수는 서체보다 간격에서 와요.

줄 사이에 숨 쉴 공간이 필요해요

행간(Line Height)은 한 줄의 기준선에서 다음 줄 기준선까지의 거리예요.
글자 크기 대비 비율로 표현하는 게 관리하기 편해요.

권장 범위: 본문 텍스트는 글자 크기의 1.4~1.6배 - 16px 본문 → 행간 24~26px

18px 본문 → 행간 26~29px

이 범위 밖에서 생기는 문제를 보면:

행간이 너무 좁을 때 (1.1~1.2): 줄들이 서로 붙어 덩어리처럼 보여요.
눈이 현재 줄을 잃고 같은 줄을 두 번 읽거나 줄을 건너뛰기 쉬워요.
글자 위아래에 '어센더(ascender, 소문자 위로 튀어나온 부분)'와 '디센더(descender, 소문자 아래로 내려온 부분)'가 서로 닿을 것 같은 느낌도 나요.

행간이 너무 넓을 때 (2.0 이상): 같은 문단 안의 줄들이 따로 떠다니는 느낌이에요.
문단 구조가 흐려지고, 기사나 설명 글에서 흐름이 끊겨요.

제목·부제목은 본문보다 행간을 좁게 잡아도 돼요.
1.1~1.3 정도면 충분해요.
제목은 짧고 크기 때문에 넓은 행간이 오히려 이상해 보일 수 있어요.

건드리지 않는 것이 대부분의 정답이에요

자간(Letter Spacing)은 글자와 글자 사이의 간격이에요.
CSS에서는 letter-spacing 속성으로 조정해요.

많은 사람들이 타이포그래피를 "개성 있게" 만들려다 자간을 건드려요.
하지만 본문 텍스트의 자간은 특별한 이유 없이 조정하지 않는 게 원칙이에요.

서체 디자이너는 글자 사이 간격을 이미 최적화해서 출시해요.
이걸 커닝(Kerning)이라고 해요.
임의로 전체 자간을 늘리거나 줄이면, 특정 글자 쌍(예: VA, To, AV)의 균형이 깨지거나 단어 형태가 이상해져요.

자간을 조정해도 되는 경우:

대문자로만 쓴 텍스트: 대문자는 본래 자간이 맞지 않아요. 0.05~0.1em 정도 넓히면 훨씬 읽기 편해요.
매우 작은 텍스트 (10px 이하): 좁은 공간에서 글자가 뭉쳐 보일 때 조금 넓히는 게 도움이 돼요.
장식용 Display 서체의 헤드라인: 시각적 효과를 위해 음수 자간을 쓰는 경우도 있어요.

자주 무시되는 요소예요

단어 간격(Word Spacing)은 단어와 단어 사이의 공간이에요.
서체에 이미 내장되어 있어요.

보통 건드릴 필요 없지만, justify(양쪽 정렬)를 쓸 때 문제가 생길 수 있어요.
영어처럼 단어 길이 편차가 큰 언어에서 양쪽 정렬을 쓰면 일부 줄에서 단어 사이가 과도하게 벌어지는 '리버(river, 단어 사이 공백이 수직으로 연속되는 현상)'가 생겨요.

한국어는 양쪽 정렬을 써도 비교적 자연스럽지만, 아주 좁은 컬럼에서는 역시 어색한 간격이 생길 수 있어요.

이 개념들이 함께 작동하는 방식

행간·자간은 독립적으로 작동하지 않아요.
서체 크기, 줄 길이, 서체 종류와 함께 조율돼야 해요.

예를 들어: 서체가 크면 행간을 상대적으로 좁혀도 돼요.
줄이 길면 행간을 조금 넓혀야 다음 줄 찾기가 쉬워요.

이걸 하나의 시스템으로 만든 게 Typography 계층이에요. 제목·소제목·본문·캡션 각각의 크기, 행간, 자간을 미리 정의해두면 매번 결정하지 않아도 돼요.

참고 문헌

Robert Bringhurst, 《The Elements of Typographic Style》(1992) - 행간과 자간의 기준 수치와 그 이유를 가장 상세히 다뤄요.
Jason Santa Maria, 《Web Typography》(2014) - CSS 환경에서 행간·자간을 어떻게 구현하는지 실무 관점으로 설명해요.

Line Height와 Letter Spacing