글자가 모여 예술이되는 웹타이포 디자인 적용 분석 가이드

제1장 타이포그래피의 기본

1. 무엇을 타이포그래피라 말할까?
1)타이포그래피라는 말은 어디서부터
2)지금의 타이포그래피가 되기까지

2. 글자에도 기본이 있다
1) 글자의 구조
①알파벳의 기본구조 용어>
②한글의 기본구조 용어>
2)글자의 크기
3)글자의 가족
①글자의 무게
②글자의 폭
③글자의 변형

3. 타이포그래피의 구성 원리 11가지
1) 기능과 형태
2)비례
3)대비
4)리듬
5)변화
6)운동감
7)여백
8)명암
9)균형
10)통일
11)조화

제 2 장 웹 환경의 특징 -인쇄매체와 웹의 차이점

1. 공간 -종이와 모니터

2. 글자의 형태(형식)
(1)비트맵 방식(HTML 폰트)
(2) 벡터 아웃라인 방식
ⓛ트루타입(Truetype) ②포스트스크립트(Postscript) ③플래쉬(플래쉬)
(3)안티 알리아싱
(4)폰트 임베딩(Embedding) 방식
①오픈타입(Opentype) ②트루독(Truedoc)

3. 컬러
(1) CMYK와 RGB
(2)파일의 포맷과 컬러
(3)컬러 모드
①RGB컬러모드 ②CMYK컬러모드 ③인덱스(Indexed) 컬러 모드
④그레이스케일(Grayscale) 모드 ⑤듀오톤(Duotone)모드 ⑥비트맵(Bitmap)모드

4. 파일의 저장과 해상도
(1)해상도
(2)파일의 저장
①GIF(Graphic Interchange Format) ②JPEG(Joint Photographic Experts Group)
③PNG(Portable Network Group) ④EPS(Encapsulated Postscript)
⑤TIFF(Tag Image File Format)

제 3 장 웹 타이포그래피의 적용

1. 글자의 공간과 가독성
(1)그리드
①테이블(Table)
>>웹사이트에서의 그리드
②프레임(Frame)
>>웹사이트에서의 그리드
(2)글줄의 길이
>>웹사이트에서의 글줄의 길이
(3)행간
>>웹사이트에서의 행간
(4)글자의 선택
>>웹사이트에서의 글자의 선택
(5)글자의 크기
>>웹사이트에서의 글자의 크기
(6)자간
>>웹사이트에서의 자간
(7)어간
>>웹사이트에서의 어간
(8)여백
>>웹사이트에서의 여백

2. 글자와 컬러
(1)배경색과 글자색
>>웹사이트에서의 배경색과 글자색
(2)표제어와 본문의 컬러
>>웹사이트에서의 표제어와 본문의 컬러
(3) 사이트로 본 컬러의 조화
>>웹사이트에서 본 컬러 배색

3. 웹 타이포그래피의 조화
(1) 한글과 한글의 조화
(2) 영문과 한글의 조화
(3) 영문과 영문의 조화

4. 웹 타이포그래피의 실제
(1) HTML을 활용한 문서의 제작
(2) CSS(Cascaded Style Sheet)를 활용한 문서
(3) 그래픽을 이용한 타입(type)
1. 벡터이미지 문자의 실제
(1)벡터프로그램을 이용한 문자제작의 장점
(2)벡터프로그램을 이용한 문자제작의 단점
(3)벡터 기반 문자의 실제
-새로운 문자의 제작(학생작품)
2. 레스터 이미지 문자의 실제
(1)레스터프로그램을 이용한 문자제작의 장점
(2)레스터프로그램을 이용한 문자제작의 단점
(3)레스터 기반 문자의 실제
-웹사이트에서 본 레스터 문자의 실제
3. 웹사이트에서의 그래픽 타입(type)
(4) 키네틱 타이포그래피의 실제
(1)플래쉬를 이용한 키네틱타이포그래피의 장점
(2)플래쉬를 이용한 키네틱타이포그래피의 단점
(3)키네틱 타이포그래피의 실제

제 4 장 웹사이트에서의 타이포그래피

1. 컨텐츠에 의한 분류
1) 엔터테인먼트, 스포츠
2) 예술, 문화
3) 생활
4) 패션, 디자인

2. 표현방식에 의한 분류
1) 텍스트의 이미지화
2) 다양한 텍스트의 변화
3) 그리드와 여백의 미학