영문 타이포그래피, 실패하지 않는 법 - 2부
지난 글에서는 디스플레이용과, 본문용으로 적합한 폰트를 고르는 방법에 대해서 알아봤는데요,
이번 글에서는 타이포그래피라는 용어가 아직은 생소한 일반인 분들과 이제 디자인을 막 공부하기 시작한 분들을 위하여 타이포그래피의 중요성과, 활용법에 관하여 집중적으로 이야기하려고 합니다.
타이포그래피, 뭐가 그렇게 중요한데?
그래픽 디자인에서 타이포그래피는 크게 두 가지 역할이 있습니다.
1) 높은 정보 전달력
좋은 타이포그래피는 정보를 체계적이고 명확하게 보여주어, 사용자가 원하는 정보를 빠르고 쉽게 이해하도록 도와줍니다. 아래 교통표지판을 예를 들어볼까요?
왼쪽 표지판의 경우 정보의 종류와 중요성에 따라 글자의 크기, 두께가 다르게 세팅되어 운전자가 정보를 파악하고 습득하기 쉬운 반면, 오른쪽 표지판은 읽다가 길을 잘못 들거나 어딘가를 박은 자신의 모습을 보고 있을지도 모릅니다.
2) 흥미 유발 & 집중력 증가
좋은 타이포그래피는 사용자의 흥미를 유발하고 콘텐츠를 지속적으로 소비하게 도와줍니다. 이것이 바로 타이포그래피가 편집디자인에서 가장 중요한 요소로 고려되는 이유입니다. 아무리 좋은 콘텐츠여도 읽기 불편하면 더 이상 보고 싶지 않으니까요. (읽기 싫은 글이면 더더욱이요...!)
전공책이 왼쪽 단락과 같은 글자로 쓰여 있다고 상상해보세요!고려해야 할 점들.
타이포그래피를 성공적으로 사용하려면, 가독성(Readability)과 판독성(Legibility)을 필수적으로 고려해야 합니다. (흔히 영문 자료를 번역하는 과정에서 두 용어를 모두 가독성으로 오역하는 경우가 많으니 유의하시길 바랍니다.)
가독성 (Readability): 텍스트가 얼마나 편하고 쉽게 읽히는가의 기준
판독성 (Legibility): 글자를 인식하고 다른 글자와 구별하기 쉬운가의 기준
가독성을 높이는 방법들
가독성은 정보전달 혹은 오랜 집중력을 요하는 문서에 가장 필수적인 요소입니다. 가독성이 높은 글은 본문(body text)에서 정보 전달력을 높이고 글을 읽는 데 있어 집중을 도와주지만, 가독성이 낮은 글은 눈이 쉽게 피로해지고 집중력을 저하시킵니다.
알맞은 서체 및 폰트 선택
프로젝트 목적에 맞는 서체와 서체 안에서 폰트를 고르는 일은 가장 작업의 퀄리티를 책임지는 핵심적인 요소입니다. 저의 이전 글에서 자세한 정보를 확인해보세요.
https://brunch.co.kr/@jmlee9762/2
최소 글자 크기 유의하기
항상 폰트의 최소 크기를 유의해야 합니다. 글자가 너무 작아지면 가독성이 크게 저하되며 인쇄물의 경우 잉크 번짐으로 제대로 프린트가 되지 않을 수도 있습니다.
해결법
작업물의 일부를 샘플로 프린트해보시거나 혹은 실제 크기로 확인해 보시기를 권장합니다.
자간 조정하기 (두 가지 방법)
영문 타이포그래피는 모든 글자의 간격을 일정하게 조정하는 Tracking과 두 글자 사이의 간격을 조정하는 Kerning이 있으며, 글자의 크기와 소문자인지 혹은 대문자인지를 항상 고려하면서 신중하게 조절해야 합니다.
타이틀(소문자)
글자가 커지면서 자간도 증가하기 때문에, 본문과의 조화를 위해 자간을 3~5% 줄이는 걸 추천합니다.
타이틀(대문자)
타이틀이 대문자의 경우 자간을 늘리면 좀 더 정교해 보이고 단어 간의 구분이 쉬워집니다. 추천 자간 조정은 5~10%입니다.
본문
타이틀의 자간 조정과 마찬가지로 본문은 글자가 작아질수록 Tracking 값을 높이고 글자가 커질수록 Tracking 값을 줄입니다.
Kerning과 Tracking
Tracking for Title (Lowercase) 타이틀을 위한 자간 세팅
Tracking for Title (Uppercase) 타이틀을 위한 자간 세팅행간 조정하기
행간은 줄 사이의 공간으로 너무 좁거나 넓을 경우 가독성을 해치는 주요 원인이 됩니다. 아도비 프로그램의 경우, 기본 행간이 소문자에서 ascender와 descender의 크기를 시각적으로 고려하여 폰트 크기의 1.2x로 설정되어 있습니다. Google Material Design에서는 본문의 경우 행간을 폰트 크기의 0.75x에서 1.25x로 권장합니다.
글줄 길이 조정하기
단락에서 한 줄에 있는 글자 수를 일컫습니다. 기본적으로 단어 사이의 공간을 포함하여 40 ~ 60 자가 최적의 가독성 경험을 주며 이는 폰트의 디자인에 따라 달라질 수 있습니다.
글줄 길이에 따라 눈이 머무는 시간을 시각적으로 표현한 그래프글줄 길이가 길어질수록 사이트 이탈률이 크게 증가합니다.
텍스트 정렬 방법
영문의 경우 글자의 읽는 방향 때문에 특별한 디자인 의도가 없는 경우에는 항상 좌측 정렬을 기본으로 합니다.
중앙 정렬 예시
짧은 타이포 요소를 시각적으로 구분하기 위해서만 사용하며 인용구를 예시로 들 수 있습니다. 문장이 2~3개를 넘어갈 경우는 좌측 정렬을 권장합니다.
우측 정렬 예시
아랍어나 히브리어 같이 오른쪽에서 왼쪽으로 읽는 언어의 경우에 우측으로 정렬합니다. 영문의 경우 노트 같은 짧은 텍스트처럼 레이아웃 안에서 구분시켜야 하는 상황에서만 우측 정렬을 사용합니다.
배경색과 타입 세팅
배경색은 텍스트의 자간과 행간 조절만큼이나 중요한 요소입니다. 타입 세팅 또한 배경색이 무엇인지에 따라 알맞게 조정되어야 합니다.
2부를 마치며
지난번 영문 타이포그래피 글에 부족함에도 불구하고 많은 분들이 관심을 가져주셔서 이렇게 2부를 진행하게 되었습니다. 사실 더 빠르게 찾아뵈려고 하였으나, 최근 이사와 취업을 동시에 하려니 늦어지게 되었습니다. ㅠㅠ
이번 글에서 서체 체계와 판독성에 관한 내용까지 다루기에는 너무 길어질 거 같아 나머지는 3부에 이어서 진행하려고 합니다. 궁금한 점은 댓글로 달아주세요!
함께 읽으면 좋은 글
https://pearsonified.com/golden-ratio-typography-intro/
https://creativepro.com/legibility-and-readability-whats-the-difference/
https://practicaltypography.com/what-is-good-typography.html
https://material.io/design/typography/understanding-typography.html#type-properties
https://yeun.github.io/2016/03/09/font-weight-and-color.html
https://canvas.uw.edu/courses/966147/pages/analyze-legibility-and-readability
canvas.uw.edu
