핵심 비유
'목소리 톤' 비유 — 같은 말도 크게/작게, 굵게/부드럽게 하면 의미가 달라진다. 친구를 부를 때와 속삭일 때 목소리가 다르듯, 글씨도 크기·굵기로 "이건 제목(큰 목소리), 이건 설명(작은 목소리)"를 구분한다. 폰트를 여러 개 섞는 건 한 문장을 여러 사람이 번갈아 외치는 것과 같아 산만하다. 타이포그래피 = 글씨로 목소리 톤을 조절하는 기술.
핵심 포인트
- 폰트는 1~2종이면 충분 — 폰트 3종 이상 섞으면 산만하다. 한 폰트 안에서 굵기(weight)로 변화를 준다.
- 굵기만으로 계층 — 제목 600(굵게) / 본문 400(보통) / 캡션은 연한 색. 크기를 안 바꿔도 굵기로 구분 가능.
- 줄 간격(line-height) 1.5~1.7 — 너무 붙으면 답답하고, 너무 벌어지면 한 덩어리로 안 읽힌다.
- weight는 2~3단계로 제한 — 굵기가 너무 많으면 계층이 무너진다.
- 제목엔 살짝 좁은 자간(-0.01em)이 깔끔. 한글은 Pretendard 같은 가독성 좋은 폰트가 안전.
- 본문이 너무 길면 한 줄에 글자 수도 관리한다 — 한글은 한 줄 25~40자 정도가 읽기 편하고, 화면 끝까지 꽉 차면 다음 줄을 놓치기 쉽다.
교사 팁
같은 문장을 다른 크기·굵기로 3줄 보여주고 "어떤 게 제목 같나요?"를 물으면, 학생이 '크기·굵기 = 계층'을 스스로 말한다(design-sense typography classGuide). 그다음 폰트 3종을 마구 섞은 '나쁜 예'를 보여주면 절제의 필요가 와닿는다. design-sense 내디자인 탭의 폰트 옵션(sans/round/serif)과 굵기를 바꿔가며 같은 카드가 어떻게 달라지는지 라이브로 보여주고, 학생이 본인 앱의 글씨 위계(제목/본문/캡션 3단계)를 직접 설정한다.
좋은 예 vs 나쁜 예
- ✅ 제목 600 + 본문 400 + 캡션 연한 색: 굵기로 계층, 일관된 폰트, 줄 간격 1.5~1.7. (design-sense
typography)
- ❌ 다양한 폰트 + 비슷한 크기: 폰트 3종+ 혼용으로 산만, 계층 불가, 줄 간격 불균일.
- ✅ 카카오톡 채팅: 이름은 굵게, 메시지는 보통, 시간은 작고 연하게 — 폰트 한 종류로 세 단계 위계. ❌ 손글씨체 제목 + 명조 본문 + 고딕 버튼: 한 화면에서 글씨가 따로 노는 느낌.
실습·평가
- 실습: 내디자인 탭에서 폰트 1종 선택 + 제목/본문/캡션 3단계 위계 구성 → 짝과 비교하며 "어디가 제목인지 한눈에 보이나?" 점검.
- O/X 퀴즈: "다양한 폰트를 많이 섞을수록 개성 있고 좋다." → X (1~2종으로 제한, 굵기로 변화)