Chapter 1 인터넷에 나만의 집을 짓자 ... 18 1 인터넷이란? ... 20 1. 인터넷의 주소 체계 ... 22 2. 인터넷 서비스의 종류 ... 24 2 World Wide Web을 알자 ... 28 1. 웹의 동작 원리를 알아봅시다 ... 30 알아둡시다! (인터넷 용어) ... 31 3 홈페이지란 무엇일까요? ... 42 1. 기업용 홈페이지 만들기 ... 43 2. 개인용 홈페이지 만들기 ... 47 3. 괜찮은 홈페이지 만들기의 노하우 ... 49 Chapter 2 HTML을 알면 홈페이지가 쉽다 ... 52 1 HTML이 뭘까요? ... 54 1. HTML 꼭 알아야 하나요? ... 56 2. HTML에 대해서 알아 볼까요? ... 56 3. HTML의 기본 구조를 알아봅시다. ... 59 2 태그학습으로 태그 사용법 익히기 ... 62 1. 태그(Tag)의 바른 사용법과 (body)태그 자세히 알아보기 ... 62 2. bgcolor 속성의 사용 ... 64 3. text 속성과 background 속성 ... 65 4. 줄바꾸기 태그 ... 66 5. 칸 띄우기 태그 ... 67 3 태그학습 1. 텍스트 처리에 사용되는 태그 ... 68 1. 글자를 눈에 잘 띄게 해 주는 태그 ... 69 2. 글자를 이탤릭체로 바꿔주는 태그 ... 70 3. 글자에 줄을 그어주는 태그 ... 71 4. 아래 첨자와 위 첨자를 만들어 주는 태그 ... 72 5. 글꼴을 예쁘게 해주는 태그 ... 73 6. 리스트를 만들어 주는 태그 ... 75 7. 문단 처리에 사용되는 태그 ... 78 8. 글꼴 태그 ... 80 알아둡시다-웹에서의 다양한 색표현의 원리를 알아볼까요? ... 81 4 태그학습 2. 이미지 처리에 사용되는 태그 ... 86 1. 이미지 처리 태그 ... 87 2. src 속성의 사용 ... 88 3. align 속성의 사용 ... 90 4. height 속성과 width 속성의 사용 ... 93 5. border 속성 ... 94 6. alt 속성 사용 ... 96 7. 이미지맵 태그 ... 98 8. 도형의 모양별 좌표 표시 방식 ... 101 알아둡시다-절대경로와 상대경로 ... 104 5 태그학습 3. 문서 연결에 사용되는 태그 ... 108 1. 하이퍼링크 태그 ... 108 2. 문자를 이용하여 다른 웹페이지로 링크하기 ... 109 3. 이미지를 이용하여 다른 웹페이지로 링크하기 ... 110 4. 웹페이지 내부에서 링크하기 ... 112 5. E-mail 링크하기 ... 114 6 태그학습 4. 멀티미디어 관련 태그 ... 116 1. 홈페이지에 사운드를 넣어주는 태그 ... 116 2. (a) 태그를 이용하여 사운드 파일 재생하기 ... 118 3. (embed) 태그를 이용하여 사운드 파일 재생하기 ... 120 4. 홈페이지에서 동영상을 보여주는 태그 ... 121 5. (embed) 태그를 이용하여 동영상 파일 재생하기 ... 122 7 태그학습 5. 테이블을 만들 때 사용되는 태그 ... 124 1. 테이블과 관련된 태그의 기본 구조 익히기 ... 129 2. 각 행과 열의 제목 나타내기 ... 130 3. 테이블 안에 테이블 만들기 ... 131 4. rowspan 속성과 colspan 속성을 이용한 셀합치기 ... 132 5. 테이블에 색깔 입히기 ... 134 6. cellspacing 속성 익히기 ... 136 7. cellpadding 속성 익히기 ... 137 8 태그학습 6. 프레임 구성에 사용되는 태그 ... 138 1. 프레임셋을 정의하는 태그 ... 139 2. 프레임을 정의하는 태그 ... 140 3. 상하로 나누어진 프레임 만들기 ... 141 4. 좌우로 나누어진 프레임 만들기 ... 142 5. scrolling 속성 익히기 ... 144 6. frameborder 속성 익히기 ... 146 7. 가장 일반적인 프레임 디자인 첫 번째 예 ... 148 8. 가장 일반적인 프레임 디자인 두 번째 예 ... 150 9. 프레임에서의 간단한 링크 익히기 ... 152 10. (a href＝'링크할 웹문서의 URL'target＝'_top')태그의 연습 ... 154 9 태그학습 7. 폼 구성에 사용되는 태그 ... 156 1. 간단한 입력 상자 만들기 ... 160 2. Radio 버튼과 Check 박스 만들기 ... 162 3. Pull Down 리스트와 Scrolling 리스트 만들기 ... 164 4. (textarea) 태그 알아보기 ... 165 5. button 태그 사용하기 ... 166 10 태그학습 8. (meta) 태그 ... 168 11 텍스트로 나만의 홈페이지 만들기 ... 170 1. 홈페이지 구상하기 ... 170 2. 메인 화면 만들기 ... 172 3. 프레임셋 정의하기 ... 173 4. 프레임에 로드할 문서 만들기 ... 174 Chapter 3 포토샵을 이용한 이미지 만들기 ... 180 1 포토샵 기초 다지기 ... 182 1. 포토샵 6.0의 초기 화면 ... 182 2. 툴박스 익히기 ... 183 3. 메뉴 익히기 ... 199 2 포토샵 6.0으로 웹 이미지 만들기 ... 204 1. 원하는 이미지로 자르기와 JPEG 파일 형식으로 저장하기 ... 204 2. 모서리가 둥근 버튼 만들기와 GIF 파일 형식으로 저장하기 ... 207 3. 아쿠아 버튼 만들기 ... 210 4. 스타일 팔레트를 이용한 문자 디자인하기 ... 213 5. 슬라이스 툴을 사용하여 웹 이미지 만들기 ... 215 6. 입체 버튼 만들기 ... 219 7. 투명 GIF 이미지 만들기 ... 224 8. 타이틀 바 만들기 ... 228 9. 프레임 이미지 만들기 ... 231 10. 나만의 아이콘 만들기 ... 239 11. 플래시 애니메이션 소스 만들기 ... 243 Chapter 4 페인트샵 프로를 이용한 이미지 만들기 ... 252 1 페인트샵 프로 기초다지기 ... 254 1. 페인트샵 프로 7의 특징 ... 254 2. 페인트샵 프로 7의 화면 구성 ... 256 3. 툴박스 익히기 ... 257 2 페인트샵 프로 7로 웹 이미지 만들기 ... 266 1. 프레임 이미지 만들기 ... 266 2. 엄청 간단한 버튼 만들기 ... 270 3. 픽쳐 튜브를 이용한 이미지 만들기 ... 272 4. 그림자가 있는 글자 디자인하기 ... 274 5. 화면 캡쳐하기 ... 276 6. 모서리가 둥근 버튼 만들기 ... 278 7. 새 이미지 제작시에 투명 GIF 적용하기 ... 280 8. 배경색이 있는 이미지를 투명 GIF로 만들기 ... 281 9. Image Mapper 사용하기 ... 282 10. Image Slicer를 사용하여 웹에서 사용할 이미지 만들기 ... 284 11. TV 주사선 이미지 만들기 ... 287 12. 사진 이미지 수정하기 ... 288 13. 애니메이션 GIF로 배너 광고 만들기 ... 290 Chapter 5 플래시로 애니메이션 만들기 ... 292 1 플래시 기초 다지기 ... 294 1. Flash 5.0의 특징 ... 295 2 Flash 5.0의 화면 구성 및 메뉴 ... 300 1. Flash 5.0은 어떻게 구성되어 있나요? ... 300 2. Flash 5.0의 구성 요소를 알아 볼까요? ... 301 3 예제 1. Motion과 Shape Tweening ... 306 1. 새 문서 만들기 ... 306 2. 문자 입력하기 ... 308 3. 불러 온 이미지에 Trace Bitmap 적용하기 ... 310 4. Symbol 등록하고 Motion Tween 적용하기 ... 312 5. Shape Tween 적용하기 ... 314 6. Layer 분리 및 애니메이션 실행하기 ... 317 4 예제 2. 내 홈페이지의 인트로 애니메이션 만들기 ... 318 1. 외부 이미지 파일 불러오기 ... 318 2. 불러온 이미지 파일 Movie Stage로 배열하기 ... 320 3. 이미지 심벌 등록하고 효과주기 ... 322 4. 작업 영역 확대하기 ... 326 5. Loading되는 문자 만들기 ... 327 6. 원하는 이미지로 자르기와 JPEG 파일 형식으로 저장하기 ... 329 7. 이동하는 문자열 입력하기 ... 332 8. Guide Layer 삽입하기 ... 334 9. Action 지정하기 ... 336 10. 사운드 삽입하기 ... 337 Chapter 6 드림위버로 홈페이지 쉽게 만들기 ... 338 1 드림위버 기초 다지기 ... 340 1. 드림위버의 화면 구성 ... 341 2 드림위버로 만드는 나만의 홈페이지 ... 344 1. 플래시 파일을 이용한 index 화면 만들기 ... 344 2. 드림위버로 프레임 다루기 ... 347 3. 드림위버로 롤오버 이미지 만들기 ... 352 4. 드림위버로 이미지 맵 만들기 ... 355 5. 드림위버로 테이블 다루기 ... 357 6. 테이블과 텍스트로 웹문서 꾸미기 ... 359 7. 드림위버의 Behavior 팔레트 사용하기 ... 363 8. 타임라인 사용하기 ... 367 9. 드림위버에서 CSS 구현하기 ... 370 Chapter 7 다이나믹 HTML로 멀티미디어 홈페이지 만들기 ... 374 1 DHTML이란 무엇인가? ... 376 2 스타일 시트 배우기 ... 378 1. 스타일 시트의 기초 익히기 ... 378 3 스타일 시트의 다양한 사용 방법 익히기 ... 382 1. 스타일 시트 사용법 ① (HEAD) 태그에 Type 선택자 정의하기 ... 382 2. 스타일 시트 사용법 ② (HEAD) 태그에 클래스 선택자 사용하기 ... 384 3, 스타일 시트 사용법 ③ (HEAD) 태그에 ID 선택자 사용하기 ... 385 4. 스타일 시트 사용법 ④ (HEAD) 태그에 문장 선택자 사용하기 ... 386 5. 스타일 시트 사용법 ⑤ 태그에 style 속성을 이용하여 정의하기 ... 387 6. 스타일 시트 사용법 ⑥ LINK) 태그를 이용하여 스타일 시트 연결하기 ... 388 7. 스타일 시트 사용법 ⑦ 간단하게 묶어서 사용하기 ... 389 8. 우선 순위(Cascading order) ... 389 4 속성(properties) 익히기 ... 390 1. Color 속성 익히기 ... 390 2. Background 속성 익히기 ... 392 3. background-image 속성의 사용 형식 ... 394 4. background-repeat의 사용 형식 ... 395 5. background-attachment 속성의 사용 형식 ... 400 6. background-position의 사용 형식 ... 403 7. background 속성의 사용 형식 ... 404 5 글꼴 관련 속성 익히기 ... 406 1. font-family 속성의 사용 형식 ... 406 2. font-style 속성의 사용 형식 ... 408 3. font-variant 속성의 사용 형식 ... 409 4. font-weight 속성의 사용 형식 ... 410 5. font-size 속성의 사용 형식 ... 412 6. font 속성의 사용 형식 ... 413 7. Line-height 속성의 사용 형식 ... 415 6 텍스트 관련 속성 익히기 ... 416 1. Text-indent 속성의 사용 형식 ... 416 2. Text-align 속성의 사용 형식 ... 417 3. Text-decoration 속성의 사용 형식 ... 418 4. Letter-spacing 속성의 사용 형식 ... 419 5. Text-transform 속성의 사용 형식 ... 420 7 링크 관련 효과 주기 ... 422 8 여백 관련 속성 익히기 ... 424 1. Margin 속성의 사용 형식 ... 424 2. Padding 속성의 사용 형식 ... 424 Chapter 8 Java-Script를 사용한 홈페이지 멋내기 ... 426 1 자바 스크립트 기초 다지기 ... 428 1. 자바 스크립트 내것으로 만들기 ... 430 2 재미있는 자바 스크립트 소스 분석하기 ... 432 1. 이미지로 롤오버 효과내기 ... 432 2. 자동으로 뜨는 팝업 윈도우를 만드는 자바 스크립트 ... 434 3. 클릭으로 새창을 띄우는 자바 스크립트 ... 436 4. 움직이는 창 만들기 자바 스크립트 ... 438 5. 메시지가 스크롤되는 상태바 만들기 ... 440 6. 시간별로 인사말 바꾸기 ... 442 7. 날짜와 시간 알려주기 ... 444 8. 풀다운 메뉴 만들기 ... 446 9. 글씨에 무지개 색 입히기 ... 448 10. 하늘에서 내리는 꽃 효과내기 ... 450 11. 마우스를 따라 움직이는 효과내기 ... 452 12. 슬라이드 쇼 효과내기 ... 454 알아둡시다 - 자바(JAVA)란 ... 456 Chapter 9 내 홈페이지 인터넷에 올리기 ... 458 1 무료로 인터넷에 집짓기 ... 460 1. 검색엔진에서 원하는 정보 찾기 ... 461 2. 무료 홈페이지 서비스 신청하기 ... 463 3. 그 밖의 무료 홈페이지 제공 사이트 ... 466 알아둡시다!-인터넷에 접속하기 ... 468 2 FTP를 사용하여 내 홈페이지 관리하기 ... 474 1. WS_FTP를 사용한 FTP 서비스 이용하기 ... 474 3 내홈페이지 광고하기 ... 476 1. 네이버에서 내 홈페이지 광고하기 ... 476 2. 그 밖의 검색엔진 등록 사이트 ... 478 4 나만의 게시판, 카운트, 방명록 만들기 ... 480 1. 네띠앙에서 제공하는 무료 카운터 달기 ... 481 2. 노브레이크사에서 제공하는 카운터 달기 ... 482 3. 그 밖의 무료카운터 제공 사이트 ... 483 5 무료 게시판과 방명록 연결하기 ... 486 1. 라이코스에서 제공하는 게시판 사용하기 ... 486 2. 링코에서 제공하는 방명록 사용하기 ... 487 3. 그 밖의 무료 방명록과 게시판 제공 사이트 ... 488 6 무료 E-mail 서비스 ... 490 1. 한메일넷의 평생 무료 메일 서비스 신청하기 ... 490 2. 그 밖의 무료 E-mail 서비스 사이트 ... 491 7 무료 아이콘 사이트 ... 492 Chapter 10 내 홈페이지 만들기 ... 494 1 폼나는 내 홈페이지 만들기 ... 496 1. 내 홈페이지 구조 그려보기 ... 496 2. 플래시로 메인 화면 만들기 ... 498 3. 이미지맵을 이용하여 메뉴 화면 만들기 ... 500 4. 자바 스크립트로 롤오버 효과내기 ... 501 2 인터넷에 내 홈페이지 만들어 보기 ... 502 인터넷에 내 홈페이지 올리기 ... 502 3 내 홈페이지 유지 보수하기 ... 508 1. 홈페이지 이미지 다이어트하기 ... 508 2. CSS로 HTML 문서 다이어트하기 ... 512 3. 좀더 빠른 로드를 위한 웹문서 구성하기 ... 513 4 잘나가는 웹문서 따라하기와 디버깅하기 ... 514 웹문서 수정하기 ... 515 5 홈페이지에서의 글쓰기 ... 516