Day 109 - 안전한 폰트 선택

Day 109 - 안전한 폰트 선택

EPUB2 365일 마스터 과정

Week 17: 글꼴 바꾸기 (Day 105-111)

Day 109: 어떤 기기에서도 잘 보이는 웹 안전 폰트를 알아봅시다!

학습 목표

• 웹 안전 폰트(Web Safe Fonts)의 개념 이해하기
• 영문 안전 폰트 목록 파악하기
• 한글 안전 폰트 목록 파악하기
• 폰트 호환성 확인 방법 익히기
• EPUB2에서 안전한 폰트 선택하기

핵심 개념

웹 안전 폰트란?

웹 안전 폰트(Web Safe Fonts)는 대부분의 운영체제에 기본으로 설치되어 있는 폰트입니다. 별도 설치 없이도 거의 모든 사용자가 동일하게 볼 수 있습니다.

왜 안전한 폰트가 중요한가요?

• 사용자 기기에 폰트가 없으면 다르게 표시됨
• EPUB2는 웹폰트 지원이 제한적
• 전자책 리더기마다 지원 폰트가 다름
• 안전한 폰트를 사용하면 일관된 표시 보장

핵심! 웹 안전 폰트는 "어디서나 작동하는 폰트"입니다. EPUB2에서는 특히 중요합니다!

영문 안전 폰트

세리프 (Serif) 안전 폰트

폰트명	특징	안전도	샘플
Times New Roman	가장 널리 사용되는 세리프	매우 안전	ABC abc 123
Georgia	화면 가독성 최적화	매우 안전	ABC abc 123
Palatino	우아하고 고급스러움	안전	ABC abc 123
Garamond	클래식한 느낌	보통	ABC abc 123

산세리프 (Sans-serif) 안전 폰트

폰트명	특징	안전도	샘플
Arial	가장 범용적인 산세리프	매우 안전	ABC abc 123
Helvetica	디자인의 표준 (macOS)	안전	ABC abc 123
Verdana	화면용으로 설계됨	매우 안전	ABC abc 123
Tahoma	좁고 깔끔함	안전	ABC abc 123
Trebuchet MS	현대적인 느낌	안전	ABC abc 123

고정폭 (Monospace) 안전 폰트

폰트명	특징	안전도	샘플
Courier New	가장 범용적인 고정폭	매우 안전	ABC abc 123
Consolas	코드용 (Windows)	안전	ABC abc 123
Monaco	코드용 (macOS)	보통	ABC abc 123

한글 안전 폰트

Windows 시스템 폰트

한글명	영문명	유형	안전도
맑은 고딕	Malgun Gothic	고딕	Windows 필수
바탕	Batang	명조	Windows 기본
돋움	Dotum	고딕	Windows 기본
굴림	Gulim	고딕	Windows 기본

macOS/iOS 시스템 폰트

폰트명	유형	안전도
Apple SD Gothic Neo	고딕	macOS/iOS 필수
AppleMyungjo	명조	macOS 기본

범용 한글 폰트 (웹폰트 사용 시)

폰트명	유형	특징
Noto Sans KR	고딕	Google Fonts, 무료
Noto Serif KR	명조	Google Fonts, 무료
나눔고딕 (NanumGothic)	고딕	네이버, 무료

EPUB2 주의! 웹폰트(@font-face)는 EPUB2에서 지원이 제한적입니다. 시스템 폰트 중심으로 설계하세요!

코드 예제

안전한 영문 폰트 스택

/* 안전한 세리프 스택 */ .safe-serif { font-family: Georgia, 'Times New Roman', Times, serif; } /* 안전한 산세리프 스택 */ .safe-sans { font-family: Arial, Helvetica, Verdana, sans-serif; } /* 안전한 고정폭 스택 */ .safe-mono { font-family: 'Courier New', Consolas, monospace; }

안전한 한글 폰트 스택

/* 안전한 한글 고딕 스택 */ body { font-family: 'Malgun Gothic', /* Windows */ 'Apple SD Gothic Neo', /* macOS */ Dotum, /* 구형 Windows */ sans-serif; } /* 안전한 한글 명조 스택 */ .korean-serif { font-family: Batang, /* Windows */ AppleMyungjo, /* macOS */ serif; }

EPUB2 권장 폰트 스택

/* EPUB2 본문용 - 최대 호환성 */ body { font-family: 'KoPub Dotum', /* 전자책 최적화 */ 'Malgun Gothic', 'Apple SD Gothic Neo', Dotum, Arial, /* 영문 대체 */ sans-serif; }

비유로 이해하기

공용어

웹 안전 폰트는 영어가 세계 공용어인 것과 같습니다. 어느 나라를 가도 영어로 의사소통이 가능하듯, 웹 안전 폰트는 어떤 기기에서도 표시됩니다!

표준 규격

웹 안전 폰트는 USB 규격과 같습니다. 어떤 컴퓨터든 USB 포트가 있으면 연결할 수 있죠. 안전 폰트도 어떤 시스템이든 기본으로 가지고 있어 항상 작동합니다!

국민 반찬

웹 안전 폰트는 김치와 같습니다. 어느 한식당을 가도 김치는 있죠! Arial은 "폰트계의 김치"입니다. 어디서나 찾을 수 있는 기본 중의 기본이에요!

폰트 선택 가이드

상황별 안전 폰트 선택

상황	추천 폰트	이유
최대 호환성 필요	Arial, Times New Roman	거의 100% 설치율
화면 가독성 중요	Verdana, Georgia	화면용으로 설계됨
한글 전자책	맑은 고딕 + Apple SD	Win/Mac 모두 지원
코드 표시	Courier New	거의 모든 시스템에 있음
격식 있는 문서	Times New Roman, 바탕	공식 문서 느낌

주의사항과 팁

주의사항

• 안전 폰트라도 100%는 아님 - 항상 폴백 준비
• 오래된 시스템에는 최신 폰트가 없을 수 있음
• 모바일 기기는 폰트 지원이 더 제한적
• EPUB 리더기마다 폰트 지원이 다름

실무 팁

• 안전 폰트 + 제네릭 폰트 조합이 가장 안정적
• 여러 기기에서 직접 테스트 해보기
• 가독성을 최우선으로 생각하기
• 너무 화려한 폰트보다 기본 폰트가 안전

실습 과제

미션: 최대 호환성 폰트 스택 작성

다음 조건을 만족하는 폰트 스택을 작성해보세요:

1. 영문 세리프: 3개 이상의 안전 폰트 포함
2. 영문 산세리프: 3개 이상의 안전 폰트 포함
3. 한글 고딕: Windows + macOS 폰트 포함
4. 각각 마지막에 제네릭 폰트 포함

체크리스트:

Times New Roman 또는 Georgia가 포함되었나요?

Arial 또는 Verdana가 포함되었나요?

Malgun Gothic이 포함되었나요?

Apple SD Gothic Neo가 포함되었나요?

제네릭 폰트(serif, sans-serif)가 마지막에 있나요?

요약 정리

Day 109 핵심 정리

• 웹 안전 폰트: 대부분 시스템에 기본 설치된 폰트
• 영문 안전 폰트: Arial, Times New Roman, Verdana, Georgia
• 한글 안전 폰트: Malgun Gothic(Win), Apple SD Gothic Neo(Mac)
• 고정폭 안전 폰트: Courier New
• EPUB2: 시스템 폰트 중심 설계 필요
• 황금 규칙: 안전 폰트 + 제네릭 폰트 조합

퀴즈

오늘의 퀴즈

Q1. 웹 안전 폰트란 무엇인가요?

정답: 대부분의 시스템에 기본으로 설치되어 있는 폰트

Q2. 가장 널리 사용되는 영문 산세리프 안전 폰트는?

정답: Arial

Q3. Windows의 기본 한글 고딕 폰트는?

정답: 맑은 고딕 (Malgun Gothic)

Q4. 코드 표시에 가장 안전한 영문 폰트는?

정답: Courier New

Q5. EPUB2에서 폰트 선택 시 가장 중요한 원칙은?

정답: 시스템 폰트 중심으로 설계하고 항상 폴백(대체 폰트) 준비

참고 자료

• CSS 웹 안전 폰트 목록
• 운영체제별 기본 폰트 목록
• 폰트 호환성 테스트 사이트
• EPUB 폰트 지원 가이드

다음 학습 예고

Day 110 - 실습 - 다양한 글꼴 테스트

배운 내용을 총동원! 다양한 폰트를 적용한 페이지를 직접 만들어봅시다!