본문용 서체를 선택하는 방법

웹용으로 조판할 때는 본문으로 시작하는 것이 좋습니다. 사람들은 대부분의 시간을 주요 콘텐츠를 읽는 데 보냅니다. 따라서 끊임없이 이어지는 경험을 제공하고자 합니다. 서체는 눈에 거슬리지 않고 쉽게 읽을 수 있어야 합니다. 웹용 본문 텍스트를 선택할 때 고려해야 하는 특성들은 다음과 같습니다. 넉넉한 x의 높이, 열린 공간, 균일한 간격, 명확한 끝 마무리, 구별 가능한 어센더와 디센더, 스타일과 무게감, 대비, 맥락입니다. 

 

넉넉한 x의  높이

높이는 소문자 x의 세로 측정값입니다. x의 높이는 종종 기준선과 대문자 상단 사이의 거리인 캡 높이의 절반보다 약간 큽니다. x의 높이가 짧을수록 글자가 작아져 글자를 읽을 수 없게 될 수 있습니다. 마찬가지로 x의 높이가 너무 높으면 가독성도 떨어집니다. 예를 들어, x의 높이가 크면 문자 n과 h를 구별하기 어렵습니다. 이상적인 소문자는 대문자 파트너와 조화를 이룰 만큼 충분히 높아야 합니다.

 

열린 공간

열린 공간은 c, e 및 s와 같은 특정 문자에서 발견되는 여는 간격입니다. 열린 공간은 독자가 글자를 해독하는 데 도움이 됩니다. 대조적으로, 닫힌 공간은 가독성에 부정적인 영향을 미칩니다. 예를 들어, Arial 및 Helvetica와 같은 기하학적 서체에서 c의 작은 간격은 더 작은 크기에서 o로 오인될 수 있습니다.

 

균일한 간격

웹용으로 잘 디자인된 서체는 일정한 간격으로 읽기 리듬을 설정해야 합니다. 글자 주변의 여백은 글자 안의 여백만큼 중요합니다. 글자들은 서로 너무 가깝거나 너무 멀어서는 안 됩니다. 간격을 두어도 읽기 속도가 빨라집니다. 간격의 균형이 잘 잡혀 있으면 독자가 모양을 더 빨리 고를 수 있습니다.

 

명확한 끝 마무리

터미널의 명확한 끝 마무리 방식은 볼(원형), 부리(박차) 및 눈물방울(구형)의 세 가지 형태로 제공됩니다. 문자 a, c, f, j, r 및 y에서 찾을 수 있습니다. 긴 형식의 텍스트에서 터미널이 명확한 글자(구, 부리 또는 눈물 모양을 구별할 수 있음)는 더 쉽게 식별할 수 있습니다. 따라서 터미널이 없는 문자보다 읽기 쉽습니다.

 

구별할 수 있는 어센더와 디센더

어센더는 평균선 위로 뻗어 있는 획을 나타내고 디센더는 기준선 아래로 연장되는 획을 나타냅니다. 어센더와 디센더를 구분하기 쉽도록 만들어진 서체는 글자를 더 잘 읽을 수 있습니다. 대부분의 세리프 서체는 어센더와 디센더의 눈에 띄는 획으로 인해 텍스트를 읽는 데 이상적인 선택인 경우가 많습니다.

 

스타일 및 무게감

구글 폰트와 같은 갤러리를 탐색할 때 본문 텍스트에 대한 선택 범위를 좁히는 가장 빠른 방법 중 하나는 스타일이 4개 미만인 서체를 필터링하는 것입니다. 패밀리 유형이 본문 텍스트로 작동하려면 최소한 일반, 기울임 꼴, 볼드체 및 볼드체 기울임 꼴이 있어야 합니다. 글꼴 파일에 기울임 꼴 스타일이 없으면 브라우저는 글꼴을 기울임 꼴로 지정하려고 시도합니다. 글꼴 모음에 볼드체 스타일을 포함하지 않으면 브라우저는 글꼴을 두 배로 늘려 볼드체로 만듭니다. 진정한 기울임 꼴과 굵은 글꼴이 없으면 결과가 눈에 거슬리게 됩니다.

 

대비

대비는 글자의 굵고 가는 획을 나타냅니다. Didot 및 Bodoni와 같은 고대비 서체는 포스터 및 패션 광고와 같은 더 큰 크기에서는 잘 작동하지만 텍스트를 실행하는 데에는 적합하지 않습니다. 이러한 글꼴에서는 얇은 획이 손실될 수 있고 작은 크기에서 두꺼운 획이 너무 두드러질 수 있습니다. 결과적으로 두꺼운 획과 가는 획의 조합이 읽기의 흐름을 방해합니다. 스펙트럼의 다른 쪽 끝에서 Arial 및 Helvetica와 같은 기하학적 서체는 대비가 거의 없기 때문에 유사한 읽기 경험을 제공하지 않을 수 있습니다. 이러한 글꼴의 균일한 문자 모양은 긴 형식을 지루하고 지루하게 만듭니다. 텍스트를 읽으려면 대비가 중간에서 낮은 서체를 선택하십시오.

 

유형

지금까지 본문 선택에 대한 기술적인 세부 사항을 다루었지만 텍스트를 설정할 유형을 아는 것도 중요한 고려 사항입니다. 모든 것은 자신의 디자인과 자연스럽게 맞아야 합니다. 반응형 웹 디자인을 고려할 때 다양한 플랫폼에서 어떻게 작동하는지 모바일에서 너무 넓게 보이는지 큰 화면 모니터에서 너무 좁아 보이는지 확인해야 하고  다양한 유형과 장치 사이의 균형을 맞출 수 있는 서체를 찾는 것은 사용자에게 일관된 경험을 보장합니다.