폰트의 구성 및 폰트가 화면에 보여지는 과정

폰트의 구성

흔히들 폰트라고 생각하면, '그림'을 생각한다. 즉, 그림이 폰트의 전체라고 생각하기 쉽지만, 실제로는 그 이상의 것으로 구성되어 훨씬 복잡하다. 폰트는 일반적으로 글자 그림과 그 그림을 처리하기 위한 정보가 하나의 파일로 합쳐진 형태로 구성되어 있다.

폰트 = 글자 그림 + 그림을 처리하기 위한 정보

글자 그림
디자이너가 그린 글자 그림은 컴퓨터만 이해하는 형태(바이너리 형태)로 저장된다. 컴퓨터는 어떤 그림이 "가"에 해당하는 그림인지, "나"에 해당하는 그림인지 전혀 모른다.

 

그림들이 저장된 모습으로, 데이터만 쭈욱 저장된다. 어디부터 어디까지가 하나의 글자에 해당하는지 알 수는 없다.

그림을 처리하기 위한 정보

그림 데이터만 있으면, 필요에 따라 어떤 그림을 가져와야 할지 전혀 모른다. 따라서, 디자이너가 그린 그림들에 대한 정보가 필요한 것이고, 대표적인 정보들은 다음과 같다.

헤더 : 해당 폰트의 전반적인 특성에 대한 정보로, 해당 폰트가 대략적으로 어떤 폰트인지, 혹시라도 파일 자체의 오류는 없는지 확인하기 위한 정보가 저장된다.

 

여기에서는 폰트 자체의 버전 정보, 체크썸(파일이 깨졌는지 확인하기 위한 정보) 등이 있다.

이름 정보 :  폰트의 이름들을 담은 정보로, 폰트의 이름, 디자이너 이름, 저작권 등 다양한 정보를 저장하는 부분이다.

패밀리 이름, 스타일 이름, 버전정보, 제작자 등의 정보가 있다.

 

그림 위치 정보 : 글자 그림에서 각 그림들의  위치를 나타내는 정보, 즉, 그림 데이터의 어디부터 어디까지가 하나의 그림인지 구분하는 정보가 저장된다.

각 그림의 저장 위치, 즉, '어느 위치'(offset)에서 '얼만큼'(length)이 해당 글자의 정보인지 알려준다. 예로, 0번째 그림은 그림데이터의 시작부터 66바이트만큼, 1번 ~ 3번 자리는 그림이 없고(길이가 0이므로), 4번째 그림은 66바이트부터 100바이트 길이만큼 차지한다는 의미이다.

코드 연결 정보 : 어떤 글자를 어떤 그림과 연결할지 나타내는 정보, 즉, '가'라는 글자는 1번째 그림과 연결시키고, '나'라는 글자는 10번째 그림과 연결시키는 식의 정보이다. 이 부분이 잘못되면, 실제 나오는 그림과 입력된 글자가 서로 다르게 나오게 된다.

코드값(글자가 컴퓨터에서 처리되는 값) 0x0000은 첫 번째 그림과, 0x000d는 두 번째 그림으로 연결되었다.

글자의 폭 정보 : 각 글자들의 폭을 저장하는 정보, 즉, '10번째 글자의 폭은 ~ 값을 갖는다' 하는 정보가 저장된다.

0번째 그림의 글자폭은 1,357이고, 그림 왼쪽으로 여백이 170이 있다.

메트릭스 및 폰트 형태 정보: 폰트 형태가 어떤 형태인지 나타내는 정보 및 각종 수치 관련된 대한 정보를 저장한다.

 

첫 번째 글자, 맨 마지막 글자, 글자 행간 및 글자의 메트릭스 값 정보가 보인다.

커닝 정보 : 글자들이 서로 연달아 올때 글자와 글자 사이의 여백을 조절하는 정보이다. 예로, "A와 V가 연결되어 입격되면 V를 원래 위치보다 얼마정도 앞으로 이동시킨다" 는 식의 정보이다. 

 

A와 V가 만나면, V를 왼쪽으로 126만큼 이동시킨다는 정보가 보인다.

 

그 외에도 다양하게 많은 데이터들이 추가될 수 있다.

---

컴퓨터에서 글자를 치면 입력한 글자가 나오기까지의 과정

글자가 출력되는 과정

그럼, 컴퓨터에서는 글자가 어떻게 화면에 보여지는 걸까?

위의 내용을 이해했으면 쉽게 이해할 수 있다.

사용자가 '맑은고딕'이라는 폰트를 이용해, '가'라는 글자를 입력했다고 하면, 컴퓨터는 다음과 같이 작동한다.

폰트 찾기 -> 그림 위치 찾기 -> 그림 가져오기 -> 글자 그림 출력 -> 커서 이동

폰트 찾기 : '맑은고딕' 폰트 이름을 갖는 폰트가 어떤 건지?

그림 위치 찾기 : '가'는 몇 번째 그림인지?

그림 가져오기 : 이 그림은 그림 데이터의 어디부터 어디까지?

글자 그림 출력: 글자를 화면에 그리기(래스터라이징 처리)

커서 이동: 글자의 폭 정보를 읽어와서, 커서를 글자가 끝나는 위치에 맞추어 깜빡깜빡~

입력한 글자가 없으면?

만약, '가'를 입력했는데, '가'라는 글자가 해당 폰트에 없다면, 즉, '가'에 해당하는 그림이 있더라도 '가'와 그림과의 연결이 빠졌다면(즉, 코드 연결이 안되었다면), '가'라는 글자를 찾을 수 없다는 표시를 해준다. 그리고, 폰트에는 그 용도를 위해, '.notdef'라는 이름을 갖는 그림이 반드시 들어가게 되어 있다.

'not defined' 상태의, 즉, 정의가 되지 않은(없는) 글자들을 대신하는 그림이 보여진다.

 

일반적으로 .notdef로 그려야 한다고 추천되는 그림 형태이다.

만약에 글씨를 입력하던 도중에 저런 형태들 중 하나가 나온다면, 그 폰트에서는 입력하던 그 글자가 없다는 것을 의미하므로, 다른 폰트를 사용하는 것이 낫다.