한글 최초의 힌팅 폰트, 맑은고딕을 말한다-2

폰트의 종류와 그 특징

맑은 고딕의 의의라면 ‘한글 최초의 힌팅 UI 폰트’라 할 수 있다. ‘힌팅’이라는 단어를 들어본  독자도 있겠지만, 듣지 못한 독자들이 대부분일 것이다. 힌팅이라는 기술의 의미를 알아보기 이전에, 힌팅이 적용되기까지 어떤 기술들이 어떻게 발전되어 왔는지 대략적으로라도 알아보는 것이 순서라 생각한다.

일반적으로 폰트는 크게 비트맵(bitmap) 폰트와 아웃라인(outline) 폰트로 나뉘어질 수 있다. 먼저, 그 각각의 특징을 살펴보고자 한다.

 

비트맵(Bitmap) 폰트

특징

출력의 최소 단위인 점(dot) 또는 픽셀(pixel)들의 집합으로 문자를 표현하는 폰트라 할 수 있다. 즉, 점을 찍어 글자를 만들어 넣은 폰트라 할 수 있다.

비트맵(bitmap)이란 의미는 말 그대로, 'bit' + 'map'으로, 비트의 지도라 할 수 있다. 비트란, 말 그대로, 컴퓨터에서 처리되는 최소 단위로 0 또는 1로 처리되는 값으로, 폰트에서는 글자를 그리는 하나의 '점'과 같은 의미라 할 수 있다. 즉, 비트맵 폰트란, 점이 켜지고(on / 1) , 꺼진(off / 0) 위치 정보로 이루어진 폰트를 의미하며, 컴퓨터의 개발과 함께 한 가장 원초적인 형태의 폰트라 할 수 있다. 

<검은 부분은 bit가 on(1)으로, 흰 off(0)로 저장된다>

 

장점

디자인된 이미지 = 화면에 출력되는 이미지 : 비트맵 이미지의 한 점은, 화면에서의 한 픽셀로 표현된다.

화면에서의 고품질 : 품질의 왜곡 없이, 그대로 화면에 표현되어 좋은 품질을 낼 수 있다.

화면으로의 고속 출력 : 특별한 처리없이 바로 화면에 출력하므로 속도가 빠르다.

 

단점

확대 시, 앨리어싱이 나타난다 : 사선의 경우, 계단현상이 두드러지게 나타난다.

글자 크기마다 각각 디자인을 해야 한다 : 앨리어싱 현상으로 인해, 다른 크기의 글자를 출력하기 위해서는 각 크기에 맞는 폰트가 필요하다.

화면 출력은 가능하나 인쇄물 출력이 불가능하다 : 방법이 있긴 하지만, 그다지 사용되지는 않는다. 도트 프린터 방식을 이용하면 출력이 가능하지만, 일반적인 프린터는 해상도가 높아 매우 작게 출력되어 출력이 어렵다.

앤티앨리어싱 적용이 어렵다 : 일반적인 폰트 엔진에서는 비트맵의 앤티앨리어싱을 지원하지 않는다.

 

주용도

고품질의 폰트 출력이 어려운, 저성능의 전자 기기 및 저용량의 폰트 용량이 필요한 경우에 사용

 

 

아웃라인(Outline) 폰트

특징

점과 선을 이용해 윤곽선을 그려 문자를 만든 폰트라 할 수 있다. 비트맵 폰트는 글자가 그려질 부분을 점을 찍었다면, 아웃라인 폰트는 글자로 ㅂ 영역을 점과 선(곡선 포함)을 이용해 그린 폰트라 할 수 있다.

<아웃라인 폰트의 일반적인 모습으로, 글자로 보일 영역을 그리는 것이라 할 수 있다>

장점

확대 및 축소가 가능, 모든 크기에서 사용이 가능 : 아웃라인의 정보를 이용해 확대 및 축소하기 때문에, 크기에 상관없이 사용이 가능하다. 

확대 및 축소 시 글자가 깨끗하게 보여지며, 출력 또한 가능 : 기계적으로 아웃라인의 정보를 계산하므로 축소 및 확대시 고품질의 출력이 가능하다.

앤티앨리어싱을 통해 부드러운 윤곽선 처리가 가능 : 앤티앨리어싱(anti-aliasing) 기술을 이용, 경계선의 계단현상을 보완할 수 있다.

 

단점

작은 크기의 글자들은 원래 디자인 의도와 다르게 왜곡이 발생한다 : 아웃라인을 화면에 출력하기 위한 래스터라이징(아웃라인 정보를 이미지로 변환하는 작업) 과정에서 원치 않는 왜곡이 발생하여, 보정이 필요하다.

화면 출력 시 부하가 크다 : 복잡한 수학적 처리과정인 래스터라이징 과정을 거치므로 시스템의 부하가 크며, 점과 선의 수가 많으면 많을수록 부하가 더욱 커진다.

 

주용도

출력용도 및 아웃라인 폰트엔진이 들어있는 고성능 기기에 주로 사용

 

 

---

 

아웃라인 폰트의 사용과 문제점 및 그 보완

 

새로운 기술의 개발은 기존 기술의 한계나 효율성에 대한 문제 제기 및 새로운 요구와 함께 시작되었다. 그와 마찬가지로, 폰트분야에서도 비트맵 폰트 대신에 아웃라인 폰트가 사용되기 시작한 것은, ‘출력’이 중요한 이슈가 되면서라 할 수 있다. 기존 출력은 활자를 이용한 출력방식이었다면, 컴퓨터의 발전과 함께 DTP가 발전하였고 그 결과 고품질 출력을 위한 폰트가 중요해지기 시작했다.

 

아웃라인 폰트의 출현과 문제점

 

아웃라인 폰트의 시작은 DTP 시장을 주름잡고 있던 Adobe에 의해 개발된 Type 1 폰트 포맷이다. 그러나, Adobe가 OS 업체가 아니다 보니, OS에서 Type 1 폰트를 래스터라이징할 수 있는 기술이 없었기에, 초창기의 아웃라인 폰트는 프린터에서만 사용되었다. 그로 인해, 당시에는 화면에서는 비트맵 폰트를, 출력은 아웃라인 폰트를 사용하는 방법이 많이 사용되었다.

그러나, OS 업체들이 Type 1 폰트 포맷에 대항하기 위해 TTF 폰트 포맷을 개발하면서, 아웃라인 폰트를 디스플레이에서도 사용할 수 있는 기술이 개발되었다. 그러나, TTF 폰트는 일반적인 프린터나 출력기 같은 고해상도 기기에서는 크게 문제가 없었지만, 저해상도의 디스플레이에서는 래스터라이징 과정에서 생기는 왜곡현상이 단점으로 나타났다. 특히, 이러한 문제는 그동안 디스플레이를 장식했던 비트맵 폰트들과 비교하면 그 품질이 매우 낮았다. 일반적으로, 화면에서의 폰트해상도가 Mac OS는 72dpi, Windows는 96dpi로 일반적인 프린터에 비해 해상도가 터무니 없이 낮아, 왜곡이 더욱 두드러져 보일 수밖에 없었다. 그러자, 그러한 아웃라인 폰트의 단점을 보완하기 위해 다양한 방법들이 적용되기 시작했다. (여기에서는 문제점 보완에 대하여 적도록 하겠다. 왜곡현상이 발생하는 이유에 대해서는 다음 포스트에서 적도록 하겠다.)

 

아웃라인 폰트의 문제점 보완

아웃라인 폰트에 비트맵 폰트를 임베딩하는 방법

아웃라인 폰트의 단점은, 작은 크기에서 왜곡현상이 발생한다는 것이다. 반면, 비트맵 폰트의 장점은 작은 크기에서 디자이너가 그린 형태대로 보여진다는 것이다. 즉, 아웃라인 폰트의 장점을 살리고, 단점은 비트맵 폰트의 장점을 활용하는 방식으로 접근한 기술이다. 즉, 왜곡이 심한 크기에서는 비트맵 폰트를 아웃라인 TTF에 추가하여(임베딩하여) 해당 크기에서는 래스터라이징 결과물 대신에 비트맵 폰트를 보여주는 것이다. 이 기술을 이용하면, 화면에서는 디자이너가 작업한 비트맵 폰트를 이용해 깨끗한 화면 출력이 가능하고, 인쇄물에서는 아웃라인 폰트를 이용한 고해상도 출력이 가능하다.

 

이런 방식으로 제작된 대표적인 폰트들이 Windows 95에서 UI 폰트로 사용되기 시작한 굴림체 및 바탕체 등이라 할 수 있다. 실제로, 굴림체의 경우는 8pt(포인트)부터 18pt까지 비트맵 폰트가 들어 있는 상태이다. 즉, 우리가 Windows에서 보는 8pt ~ 18pt의 굴림체 글자들은 실제 아웃라인이 래스터라이징된 결과가 아닌, 비트맵 글자들인 것이다. 실제 아웃라인을 이용해 기계적으로 래스터라이징한 결과와 비트맵으로 보정된 결과는 다음과 같이 많은 차이가 있다.

<굴림체 '가'의 아웃라인 모습>

 

 

<아웃라인 래스터라이징 결과>

<비트맵 폰트>

  

<비교 결과>

10pt  / 파란색 : 기계적인 래스터라이징 결과 / 빨간색: 비트맵 폰트 / 검정색 : 공통적인 부분

 

 

<아웃라인 래스터라이징 결과>

<비트맵 폰트>

  

<비교 결과>

18pt  / 파란색 : 기계적인 래스터라이징 결과 / 빨간색: 비트맵 폰트 / 검정색 : 공통적인 부분

 

위 2개 크기의 그림을 보면, 실제 기계적인 래스터라이징의 결과와 비트맵 폰트의 차이를 볼 수 있다. 실제 아웃라인이 기계적으로 래스터라이징되어 보이는 결과는 디자이너가 직접 그린 비트맵 폰트보다 그 품질이 낮고, 가독성이 떨어지는 것을 볼 수 있다. 위의 그림을 보면, 아웃라인 폰트의 품질저하를 비트맵 폰트를 통해 보완할 수 있다는 사실을 알 수 있다.

그러나, 비트맵 데이터를 폰트에 넣고자 할 때, 꼭 아웃라인이 들어있어야만 하는 것은 아니다. 아웃라인이 없이 비트맵 폰트만 임베딩될 수도 있다. 한 때 싸이월드에서 서비스되었던 웹폰트의 경우, 몇몇 회사를 제외하고는 대부분이 아웃라인 데이터 없이 비트맵 데이터만을 갖고 있었다. 그러나, 이럴 경우에는 프린터를 통한 글자의 출력이 안되어, 화면용으로만 사용이 가능하다는 단점이 있다.

 

그렇다면, 이렇게 비트맵 데이터를 임베딩하면, 무조건 장점만 있는가? 자칫 큰 단점이 될 수 있는 것이, 바로, 폰트파일의 크기이다. 작은 크기 1개의 비트맵 폰트의 용량은 아웃라인에 비해 상대적으로 작은 편이지만, 여러 크기의 비트맵 폰트를 동시에 임베딩할 경우, 파일 크기가 상당히 커질 수 있다. 실례로, 굴림체의 경우도 비트맵 폰트 정보를 빼고 나면, 실제 아웃라인의 용량은 생각보다 그리 크지 않다. 따라서, 비트맵 폰트가 임베딩되는 폰트의 경우, 폰트 파일의 크기를 고려하여 임베딩될 비트맵 폰트의 크기들을 고려하여야 한다.

 

힌팅 기술을 적용하는 방법

그럼, 비트맵 데이터를 임베딩하지 않고 폰트의 품질을 개선할 수 있는 방법은 없을까? 이런 생각하에 만들어진 것이 바로 힌팅(Hinting) 기술 이라 할 수 있다. 아웃라인 폰트에 특정 정보(명령어)를 추가하여, 글자가 래스터라이징 과정에 특정 효과를 주도록 하는 것이라 할 수 있다. 즉, 글자가 래스터라이징 될 때, ‘글자에게 이러 이러한 효과를 주어라’라는 일종의 힌트(Hint)를 주는 것을 말하며, 그러한 정보를 폰트에 넣는 작업을 바로 힌팅(Hinting)이라 한다. 그리고, 그러한 정보는 대부분이 왜곡을 보정하는 용도로 사용하기 때문에, 힌팅을 ‘아웃라인의 래스터라이징 과정에서 발생하는 왜곡을 보정하는 기법’이라 생각해도 무난할 것 같다. 힌팅에 대해서는 뒤에서 다시 알아보도록 하고, 여기에서는 간단한 예를 보도록 하자

 

<래스터라이징 결과>

    

<힌팅명령>

  

<힌팅 적용 결과>

 

위의 그림을 보면, 단순 기계적인 래스터라이징을 통한 결과물은 'ㄱ'과 'ㅏ'의 가로 획의 두께는 1픽셀이고, 'ㅏ'의 세로 획의 두께는 2픽셀로 되어, 획의 두께가 일관적이지 않은 문제가 있다. 이런 왜곡이 있는 폰트에, 이를 두 획의 두께를 같게 설정하는 명령을 추가함으로써, 두 글자의 획 두께가 일정하게 하여, 가독성을 높일 수 있게 되었다.

 

이렇듯, 작은 크기의 글자에서 발생하는 왜곡현상은 비트맵 폰트가 없음에도 힌팅명령을 추가함으로써, 충분히 해결할 수 있게 된다. 이러한 힌팅 기법의 장점은 비트맵 폰트를 크기 별로 일일이 제작하지 않으므로, 비트맵 폰트가 여러 개 임베딩된 폰트보다는 파일 용량이 작다는 점이다. 반면, 단점은 힌팅 기술이 디자이너가 제대로 이해하고 작업하기에는 많은 어려움이 있고, 시간이 많이 소요된다는 점이다.

 

---

이번 포스트에서는 아웃라인 폰트의 출현과 더불어, 아웃라인 폰트의 장단점을 살펴보았습니다. 그리고, 그러한 아웃라인의 단점을 보완하는 방법으로, 폰트 자체에 적용되는 기술들에 대해 알아 보았습니다. 다음 포스트에서는 화면에서 글자들을 처리하는 방식인 렌더링 방식에 대하여 알아보도록 하겠습니다.