KMO200501353 권 호 :
발행년 : 2005
발행처 : 성안당

서 명 : 웹사이트 최적화 테크닉


목차
Ⅰ HTML과 XHTML 최적화
Chapter 01 HTML 최적화 기법 = 30
01 HTML 최적화란 무엇인가? = 30
이상적인 웹페이지 = 31
02 HTML 최적화 기법 = 31
화이트스페이스(Whitespace)를 제거하자 = 32
불필요한 인용 부호(" ")를 생략하자 = 33
불필요한 종료 태그를 생략하자 = 34
불필요한 태그와 속성을 제거하자 = 35
불필요한 태그 제거하기 = 35
불필요한 속성 제거하기 = 36
범위가 지정된 속성에서 콤마(,) 전후의 여백을 없애자 = 37
컬러와 문자 엔티티를 최소화하자 = 38
문자 레퍼런스 = 38
컬러 = 38
주석(comment)을 압축하자 = 39
요소(element) 안에 포함된 라벨(Labels) = 40
웹페이지는 문자를 함부로 쓰는 곳이 아니다 = 41
alt 값을 최소화하자 = 41
head를 최소화하자 = 41
〈meta〉태그 최소화하기 = 42
HTTP 리퀘스트(Request)를 최소화하자 = 43
최적화된 예 = 44
03 요약 = 47
Chapter 02 고급 HTML 최적화 기법 = 48
01 테이블(Table) 최적화 방법 = 48
복잡한 테이블은 웹페이지의 속도를 느리게 만든다 = 48
셀 그룹화를 통한 디스플레이 속도를 높이자 = 49
가로 방향의 셀 그룹화 = 49
세로 방향의 셀 그룹화 = 50
셀 개수 계산하기 = 50
셀의 너비 계산하기 = 50
테이블 속성을 합치자 = 51
빠르게 디스플레이 되는 테이블을 만들자 = 54
고정된 테이블 레이아웃 = 54
셀을 초과하는 Overflow 속성 제어하기 = 56
고정된 테이블 레이아웃 예 = 56
복잡한 중첩 테이블을 반대로 풀이하자 = 59
큰 테이블을 여러 개의 분리된 테이블로 분해하자 = 60
웹사용자가 느기는 체감 속도 = 60
스리-패널(Three-Panel) 레이아웃 = 61
테이블 트릭을 사용하자 = 62
종료 태그를 선택적으로 사용하자 = 64
〈td〉 태그 후에 줄바꿈과 여백을 제거하자 = 64
채색되어 있는 셀들을 백그라운드 컬러로 바꾸자 = 65
02 HTML 폼 최적화 기법 = 66
자바스크립트와 폼 사용하기 = 66
폼 컨트롤 = 67
숨겨진 필드 제거하기 = 67
펼침 목록 메뉴를 DHTML 계층 메뉴로 바꾸자 = 68
〈optgroup〉 태그를 이용해 만든 펼침 목록 메뉴 그룹 = 68
〈optgroup〉 태그로 만든 그룹화된 메뉴의 실례 = 70
03 URL 생략을 통한 최적화 기법 = 73
URL은 짧을수록 좋다 = 73
URL의 맨 뒤에 slash(／)를 포함시키자 = 74
04 HTML과 압축 = 75
HTML 압축 예 = 75
05 요약 = 76
Chapter 03 XHTML 최적화 기법 = 78
01 XHTML의 장점 = 79
02 XHTML 문서 해부하기 = 80
프롤로그(선언문) = 81
DOCTYPE 선언 = 82
DTD = 82
네임 스페이스 = 83
중복되는 다수의 네임 스페이스 = 84
03 XML의 문장 구성 법칙 = 85
모든 태그는 종료 태그가 있어야 한다 = 85
모든 속성은 인용 부호로 인용되어야 한다 = 86
속성은 최소화할 수 없다 = 86
요소명, 속성명은 모두 소문자를 사용한다 = 87
스크립트(script)와 스타일(style)의 차이를 구별해서 사용한다 = 87
내부 스타일시트와 XHTML = 88
외부 스타일시트 = 89
XHTML에 내포된 스크립트 = 89
프래그먼트(조각) 식별자 : name 속성과 id 속성을 사용한다 = 90
04 HTML을 XHTML로 변환하기 = 91
HTML Tidy로 변환하기 = 91
드림위버 익스텐션으로 변환하기 = 91
05 XHTML 최적화 기법 = 92
웹 페이지 코드를 변형하자 = 92
아웃라인을 생각하자 = 92
테이블을 CSS로 대체하기 = 93
06 요약 = 95
Chapter 04 최적화 사례 분석 : PopularMechanics.com = 96
01 자동화 툴로 최적화하기 = 100
02 수작업으로 최적화하기 = 102
CSS 최적화 = 102
자바스크립트 최적화 = 103
불필요한 테이블을 손질하자 = 105
주석을 짧게 잘라내자 = 105
상대 URL 주소를 짧게 사용하자 = 107
GIF 파일명을 간결하게 줄이자 = 108
03 요약 = 109
Ⅱ DHTML 최적화 : CSS와 자바스크립트
Chapter 05 CSS 최적화 기법 = 112
01 현명하게 스타일을 적용하자 = 113
02 화이트스페이스를 제거하자 = 114
03 주석을 짧게 하자 = 114
04 단순한 선택자(Selector)와 치환을 사용하자 = 115
타입(Type) 선택자를 사용하자 = 115
선택자의 하위 요소를 확실하게 지정하자 = 116
class와 id 선택자 이름을 짧게 사용하자 = 116
유사 선택자를 사용하자 = 117
CSS2 기반의 롤오버로 대체하자 = 118
05 그룹핑(그룹화)을 사용한 최적화 기법 = 118
그룹 선택자 = 118
그룹 선언 = 119
그룹 선택자와 선언을 사용하자 = 120
공통의 스타일을 그룹화하기 위해 다중 클래스를 사용하자 = 120
06 스타일의 상속(Inheritance) = 121
상속을 이용해서 스페이스를 줄이자 = 121
생소한 상속 = 121
07 스피드 향상을 위한 레이어 스타일 = 122
media 타입을 사용하자 = 122
08 단축형 속성(properties)을 사용한 최적화 기법 = 122
font 단축형 속성을 사용하자 = 123
background 단축형 속성을 사용하자 = 123
margin 단축형 속성을 사용하자 = 126
값의 복제 = 126
border 단축형 속성을 사용하자 = 127
border-width 단축형 속성 = 127
border-top, border-right, border-bottom, border-left 단축 속성 = 128
border 단축형 속성 = 129
padding 단축형 속성 = 130
list-sytle 단축형 속성 = 131
09 CSS 컬러 최적화하기 = 132
16진 컬러 = 132
단축형 16진 컬러 = 132
이름으로 명명된 컬러 = 133
10 길이 단위 : 모든 것은 상대적이다 = 134
상대적인 길이 단위 = 134
절대적인 길이 단위 = 136
길이 단위 요약 = 136
11 요약 = 136
Chapter 06 고급 CSS 최적화 기법 = 138
01 그룹화와 단축형 Font 속성으로 CSS 최적화하기 = 138
02 대역폭 부담이 큰 그래픽 롤오버를 CSS 롤오버로 대체하기 = 141
CSS2 이미지 롤오버 = 142
순수한 CSS2 롤오버 = 143
단순한 텍스트 롤오버 = 143
CSS2로 만든 세로 메뉴 = 144
CSS2 롤오버를 사용한 실제 예제 = 147
Designmeme.com = 147
CSS2 가로 롤오버 = 148
동적인 CSS2 메뉴바 = 151
List 기반 메뉴들 = 153
03 CSS를 사용하여 백그라운드 컬러를 테이블 셀에 스타일하기 = 156
04 CSS 레이아웃과 위치 결정 컨트롤 = 157
관련성 증가시키기 = 159
05 요약 = 160
Chapter 07 다운로드 속도를 위한 자바스크립트 최적화 기법 = 161
01 불필요한 자바 스크립트를 제거하자 = 161
최적화된 스크립트의 가독성 = 162
화이트스페이스를 제거하자 = 162
자동적인 세미콜론 삽입 = 163
주석을 생략해서 사용하자 = 163
02 자바스크립트를 현명하게 적용하자 = 164
03 HTTP 리퀘스트를 최소화하자 = 165
로딩을 연기하거나 늦추자 = 166
조건부 외부 자바스크립트들의 로드 = 168
04 생략하기와 맵핑 사용하기 = 168
05 압착하기와 혼란시키기(Crunching and Obfuscation) = 171
어떤 사람들을 혼란하게 해야 하나? = 172
자가 추출 기록 = 174
06 자바스크립트와 압축 = 175
07 요약 = 176
Chapter 08 실행 속도를 위한 자바스크립트 최적화 기법 = 177
01 설계 단계(Design Levels) = 177
02 변경 사항을 측정하자 = 178
03 알고리즘과 데이터 구조 = 179
04 코드를 단순화하는 리펙터(Refactor) = 179
05 DOM 상호 작용과 I／O를 최소화하자 = 180
오브젝트와 프로퍼티 검사를 최소화하자 = 181
관련 체인들을 단축시키자 = 181
오프라인으로 복잡한 서브 트리(Subtree)를 추가하자 = 183
오프라인으로 서브 트리를 편집하자 = 184
긴 스트링을 연결하자 = 185
직접 노드리스트에 엑세스하자 = 185
문자 오브젝트를 사용하라 = 186
06 로컬 최적화 기법 = 187
속도를 높이기 우이해 스페이스와 교환하자 = 187
데이터 구조를 증가시켜라 = 187
자주 사용되는 값을 저장하자 = 189
미리 계산된 결과값들을 저장하자 = 190
글로벌 변수에 대비해서 로컬 변수를 사용하자 = 190
많은 코드를 빠른 속도와 교환하자 = 191
패킹(Packing) = 191
인터프리터(Interpreters) = 192
07 루프(Loop) 최적화 기법 = 192
복합 조건들을 피하기 위해 테스트를 결합하자 = 192
부등식 코드를 루프 밖으로 꺼내자 = 194
역 루프 사용하기 = 195
do while 루프 사용하기 = 196
루프를 풀어서 쓰거나 제거하자 = 198
Duff의 Device = 198
빠른 Duff의 Device = 200
풀어쓰기 하는데 얼마나 들까? = 202
융합 루프 = 202
08 표현식 튜닝 = 203
09 요약 = 205
Chapter 09 최적화 사례 분석 : DHTML.com = 206
Ⅲ 그래픽과 멀티미디어 최적화
Chapter 10 웹 그래픽 최적화 기법 = 212
01 이미지 준비하기 = 212
이미지를 보정하자 = 213
02 JPEG 최적화 기법 = 214
JPEG 이미지 압축하기 = 214
JPEG 최적화 요약 = 216
03 GIF 최적화 기법 = 216
이미지를 부드럽게 처리하기 위한 디더링(Dithering)을 최소화하자 = 217
속도를 개선하기 위해 인터레이싱(Interlacing)을 고려하자 = 217
GIF 최적화 요약 = 218
GIF 애니메이션 최적화하기 = 218
GIF 애니메이션 최적화 요약 = 219
04 PNG 최적화 기법 = 219
PNG의 deflate 압축 = 220
Interlaced PNG를 피하자 = 220
더 나은 압축을 위해 필터를 사용하자 = 220
PNG 대 GIF = 222
PNG 최적화 요약 = 223
05 다운로드 타임 : 패킷 카운트(Packet Count) 대 페이지 사이즈 = 223
06 요약 = 224
Chapter 11 멀티미디어 최적화 기법 = 226
01 멀티미디어의 기초 = 226
웹 멀티미디어 데이터 타입(Web Multimedia Data Types) = 227
오디오 데이터 형태(Audio Data Types) = 227
비디오 데이터 형태(Video Data Types) = 228
애니메이션(Animation) = 229
멀티미디어 파일의 한계 = 229
처리(CPU) 속도 = 230
대역폭 = 230
코덱(Codecs) = 231
코덱이 필요한 이유 = 231
코덱은 어떻게 작동하는가? = 231
스트리밍 미디어(Streaming Media) = 232
퀵타임(Quick Time) = 232
리얼미디어(Real Media) = 234
윈도우 미디어(Windows Media) = 235
스트리밍 대 다운로드(streaming versus downloading) = 235
멀티미디어 생성 팁 = 236
02 오디오 압축과 최적화 기법 = 236
레벨 매칭(Level Matching) = 236
정규화(Normalization) = 238
오디오 컴프레서(Audio Compressor) = 239
유용한 컴프레서 세팅 = 240
인코딩(Encoding) = 241
03 비디오 최적화 기법 = 242
비디오 캡쳐(Capturing) = 243
아날로그(Analog) 캡쳐 = 243
디지털(IEEE 1394) 캡쳐 = 244
비디오 캡쳐 후 최적화하기 = 244
화면비 조정(Aspect Correction) = 245
픽셀 화면비(Pixel Aspect Ratio) = 245
비디오 압축하기 = 245
웹용 비디오 압축 = 245
퀵타임 압축(QuickTime Compression) = 246
리얼미디어 압축(RealMedia Compression) = 247
플래시 최적화(Flash Optimization) = 247
프로그래밍 팁과 최적화 팁 = 249
쇽웨이브(Shockwave) 최적화 = 250
Cult3D 최적화 = 250
04 PDF 최적화 기법 = 251
작은 PDF 생성하기 = 251
다이내믹 PDF 생성하기 = 252
PDF 저장 = 252
PDF 파일 최적화 = 253
05 요약 = 254
Chapter 12 최적화 사례 분석 : Apple.com = 255
01 Output = 256
02 Audio = 256
03 Image = 256
04 Adjust = 257
05 Encode = 257
06 Tracks = 257
07 최종 결과 = 257
Ⅳ 검색 엔진 최적화
Chapter 13 웹사이트 키워드 최적화 기법 = 260
01 최적의 키워드를 위한 밑그림 = 260
멀티-워드 구문(Multi-Word Phrases)을 목표로 하자 = 261
검색 엔진이 사이트를 정렬하는 방법 = 261
02 키워드 최적화 가이드라인 = 262
핵심 구문을 결정하자 = 262
인기도에 의해 정렬하자 = 263
단어 제거하기(word stemming) = 264
근접 그룹화(proximity grouping) = 265
핵심 구문을 정제하자 = 265
다시 인기도에 의해 정렬하자 = 267
상위 2개 또는 3개의 구문을 사용하여 title을 작성하자 = 271
description meta 태그를 작성하자 = 272
keywords meta 태그를 작성하자 = 272
Key 태그와 속성에 키워드를 추가하고 잘 섞자 = 273
키워드 밀도(Keyword Density) = 273
키워드 배치의 우선순위 = 274
검색 엔진에 등록시키기 = 274
웹 페이지의 방문자 수가 변화하는 것을 지켜보자 = 275
03 검색 로봇에 친근한 디자인 팁들 = 275
04 검색 순위가 높은 웹페이지의 특성 = 276
05 요약 = 277
Chapter 14 최적화 사례 분석 : PopularMachanics.com과 iProspect.com = 278
01 PopularMachanics.com = 278
항목- 제한된 title = 279
비어있는 〈meta〉 태그들 = 279
커다란 head 섹션 최소화하기 = 280
alt 속성을 사용하지 않는 것 = 282
02 iProspect.com = 283
키워드를 가진 타이틀 = 284
키워드가 풍부한 〈meta〉 태그 = 285
최소한의 head = 285
의미 있는 alt 속성 사용하기 = 286
Key 태그와 속성에 키워드를 추가하고 잘 섞자 = 286
body 텍스트의 키워드 = 287
Ⅴ 고급 최적화 기법
Chaprter 15 Server-Side 최적화 기법 = 290
01 Server-Side Includes(SSI) = 290
조건부적인 SSI = 291
환경 변수의 설정과 테스트 = 291
SSI의 장점, 속도와 폭넓은 호환성 = 292
SSI의 단점 = 293
02 mod_include 튜닝을 통한 최적화 = 293
XBitHack와 .shtml을 고려하자 = 294
Virtual Server마다 mod_include를 실행하자 = 294
AllowOverride None을 사용하자 = 295
XBitHack Full 또는 mod_expires로 저장하기 = 295
03 Server-Side 브라우저 스니핑(Sniffing) = 295
BrowserMatch를 이용한 빠른 브라우저 스니핑 = 300
PHP 브라우저 스니핑 = 301
Server-Side 브라우저 스니핑의 장단점 = 304
브라우저 성능 개선 파일, browscap = 305
고급의 Server-Side 스니핑, BrowserHawk = 306
조건적인 〈meta〉 태그 = 308
04 mod_rewrite를 이용한 URL 생략법 = 309
mod_rewrite 튜닝 = 311
생략에 도전하자 = 311
RewriteRule 해법 = 312
다수의 생략을 위한 RewriteMap 해법 = 312
대체 패턴 = 314
이진 해시(Binary Hash) RewriteMap = 315
자동적인 URL 생략 = 315
URL 생략／확장 프로세스 따라하기 = 317
05 폼(Form)과 CGI 최적화 = 319
Perl 스크립트 최적화를 위한 mod-perl = 322
06 www는 더 이상 필요 없다 = 322
07 요약 = 324
Chapter 16 웹에서의 압축 기법 = 325
01 텍스트 압축 알고리즘 = 326
02 콘텐츠 압축 = 327
GZIP 압축 = 328
모뎀 압축은 충분하지 않다 = 329
03 콘텐츠 압축 : 클라이언트 측면 = 330
HTML과 압축 = 331
CSS 압축 = 331
자바스크립트 압축 = 332
자바스크립트 압축 이해 사항 : head를 사용하자 = 332
04 콘텐츠 압축 : 서버 측면 = 333
아파치(Apache)에서의 콘텐츠 압축 = 333
mod_gunzip으로 미리 압축된 정적인 파일 공급하기 = 336
mod_gzip으로 미리 압축된 정적인 파일 공급하기 = 336
아파치 모듈을 컴파일하고 인스톨하는 방법 = 338
보다 작게 압축하기 = 339
Mod_deflate(아파치 버전) = 341
mod_gzip - 가변적인 압축 = 341
mod_hs - mod_gzip의 상업적인 버전 = 342
Mod_deflate ru = 342
아파치 시스템에 접근하지 않는 이들을 위한 - Gzip_cnc = 343
압축 모듈 선택하기 = 344
마이크로소프트 IIS 서버의 콘텐츠 압축 = 345
IIS 서버를 위한 다이내믹 콘텐츠 압축 = 346
PipeBoost = 347
Inner Media SqueezePlay = 348
HyperSpace i = 349
VIGOS IIS Accelerator = 349
HTTP Burst = 349
IS ISAPI 압축 필터 요약 = 349
05 Proxy Server에 기반을 둔 콘텐츠 압축 = 350
06 벤치마킹 툴 = 351
PipeBoost Analyzer = 351
ApacheBench = 351
VIGOS Website Analyzer = 351
07 요약 = 352
Chapter 17 최적화 사례 분석 : Yahoo.com과 Webreference.com = 353
01 생략해서 쓰는 Yahoo.com = 353
02 생략해서 쓰는 WebReference.com = 355