본문 바로가기

디자인

비디자이너를 위한 폰트 잘 쓰는 문서디자인 사용 설명서

비디자이너를 위한 폰트 잘 쓰는 문서디자인 사용 설명서

A Non-Designer’s Guide to Pairing Fonts

 

PPT, 블로그 포스팅, 문서 작성, 이력서를 작성할 때 폰트 사용의 한계가 부딪히곤 한다. 디자이너가 아니더라도 목적에 맞게 잘 읽히도록 디자인하는 것은 기본적인 문서 작성의 예의다. 보기에 좋은 포스팅은 글도 잘 읽힌다. 언제까지 기본 글꼴을 굴림체, 돋움체로만 쓸 순 없다. 지금부터 알려줄 몇 가지 규칙만 알면 이제 비디자이너도 매력적인 문서 작성의 기본소양을 갖추게 된다.

 


 

 

1 세리프와 산세리프의 결합 (명조와 고딕체의 결합)

 

영문에서의 세리프와 산세리프는 명조체와 고딕체로 이해하면 된다. 글꼴은 세리프와 산세리프를 결합해야한다. 대비가 클수록 좋기 때문이다. 이미지의 제목과 본문에 사용된 폰트를 관찰하며 오른쪽, 왼쪽 두 이미지를 비교해보자.

 

 

 

2 유사함을 피하라

 

왼쪽 slab vs slab 오른쪽 slab vs sans serif

1번과 동일한 규칙을 적용하는 또다른 방법은 스크립트, 슬래브와 같은 동일 범주의 서체를 선택하지 않을 것. 스크립트는 주로 머리글에 사용되며 슬래브는 문자 획의 끝이 두껍고 돌출있는 세리프 유형이다. 대비가 크지 않은 폰트의 사용은 눈에 잘 띄지 않는다.

 

 

3 대비되는 글꼴 사이즈

 

대비를 이용해 눈에 띄는 내용을 만들기 위한 세번째 방법은 폰트 간의 크기를 확연히 다르게 이용하는 것이다. 

왼쪽 텍스트는 헤더 24포인트, 본문 18포인트로 대비가 약해 중요한 것을 구별하기가 쉽지 않다. 정보를 읽는 순서는 디자인의 시각적 계층에 의해 명확하게 정의되어야 한다. 오른쪽처럼 충분히 큰 헤더를 사용해 상대적인 차이로 시각적 계층을 빠르게 인식하도록 설계되어야 한다.

 

 

 

4 대비되는 글꼴 두께

 

글꼴의 두께를 잘 활용하는 것도 대비를 만들어낸다. Didot과 Rockwell은 둘 다 존재감이 있어 함께 어울리지 않는다. 반면 위 그림처럼 Roboto Black과 Roboto light를 함께 사용하면 최상의 조합을 얻을 수 있다. 

 

 

 

5 각 폰트에 고유한 역할 지정하기

 

일관성은 디자인에 중요한 역할을 한다. 문서 전체에서 사용되는 각 글꼴에 역할을 할당함으로 충족시킬 수 있다. 예를 들어 기사 제목에 동일한 글꼴을 사용하고 본문에 다른 글꼴을 사용하는 방식이 그러하다. 위의 예에서 오른쪽 텍스트는 헤더 유형과 본문 유형이 일관되고 독점적으로 사용되므로 훨씬 깔끔해 보인다.

 

 

 

6 다른 분위기를 섞지 말라

 

글꼴을 페어링하는 또 다른 열쇠는 각 글꼴에 개성과 분위기가 있다는 것을 인식하는 것이다. 단순히 서로 어울리지 않는 글꼴을 페어링하는 실수를 저지르지 않는 것. 예를 들어 Impact와 MTF Cool Kid를 결합할 경우다. Impact는 대담하고 뭉개지지만 MTF Cool Kid는 장난스럽고 단순하며 아이처럼 보이기 때문이다.
오른쪽에서 Nexa Rust Slab과 Airstream은 정확히 완벽하게 일치하지는 않다. Snidely는 대략적인 모양의 디스플레이 글꼴이며 Airstream은 장식적인 복고풍 글꼴이다.

 

 

 

7 고유한 글꼴을 중립 유형과 혼합하기

 

폰트 중 하나에 많은 개성과 독특한 스타일이 있다면, 다른 폰트와 짝을 이룰 때 조심해야 한다. 가장 좋은 방법은 특징이 명확한 글꼴을 중립적인 글꼴과 연결하는 것이다. 위의 예에서 스크립트 글꼴인 Blackjack은 다른 스크립트 글꼴인 Milkshake와 결합되어 매우 왜곡된 디자인을 만든다. 그러나 오른쪽의 예는 보다 중립적인 Montserrat light를 사용하므로 훨씬 더 즐겁고 읽기 쉬운 디자인이다.

 

 

 

8 불일치한 조합 피하기

 

대조는 시각적 조화를 만들지만 독자를 쫓아버리기도 한다. 핵심은 언뜻 보기에는 매우 다른 것처럼 보이지만 비율과 x 높이 면에서 실제로 비슷한 글꼴을 결합하는 것이다. 
예를 들어, Times New Roman을 사용한 Futura는 너비 사이의 대비가 너무 커서 제대로 작동하지 않는다.

 

 

 

9 같은 서체의 글꼴 사용하기

 

같은 서체에서 다른 글꼴을 사용하면 많은 시간을 절약하고 원하는 모양을 만들 수 있다. 예를 들어, 머리글에는 Helvetica Black을, 몸에는 보통 Helvetica를 사용하면 좋다. 또는 위의 예와 같이 Raleway Black Head와 Raleway Thin을 결합 할 수 있다. 4번 팁과 비슷하다.

 

 

 

10 2~3개의 서체를 고수하기

 

올바른 폰트 조합을 위해 너무 열심히 찾는 것을 지나치게 생각하는 대신, 최대 3 개의 조합을 고수하고 무엇보다도 간단하게 유지하는 게 좋다. 고전적인 산세리프와 세리프 조합을 사용하여 두 가지 서체를 고수할 것. 이로 인해 각 서체마다 노멀, 볼드, 이탤릭체 및 볼드 이탤릭체와 함께 사용할 수 있는 글꼴이 최대 8 가지가 될 수 있다.

 

 

 

11 다른 크기로 실험하기

 

큰 글꼴은 좋아 보이지만 작은 글꼴은 거의 읽기 힘든 글꼴이 있다. 따라서 일부 글꼴 조합이 특정 포인트 크기로 떨어질 수 있으므로 다른 크기로 실험하는 것이 중요하다. 예를 들어 Helvetica는 더 크거나 작은 크기로 사용할 수 있지만 Impact와 같은 글꼴은 작을 때 가독성도 떨어지고 매력적이지 않다. 위의 예에서 스크립트 글꼴 Pacifico가 너무 압축되어 굵게 표시되어 본문용으로 적합하지 않다. 그러나 헤더로는 기능을 잘 한다.

 

 


원문글 A Non-Designer’s Guide to Pairing Fonts

 

  • 작은 차이 같아도 느낌이 완전히 다르네요~
    폰트의 유형과 크기 두께감 그리고 조화
    완전 공감 꾸~욱 !!!
    폰트를 채운 색감들과의 조화로움도 잘보고 가요~
    즐거운 하루 되세요~