1부 인터넷 활용과 HTML 실습 CHAPTER 1 인터넷의 기본 개념 1. 인터넷의 개요 ... 3 1.1 인터넷 정의 ... 3 1.2 인터넷의 역사 ... 4 1.3 인터넷의 활용 분야 ... 5 1.4 국내 인터넷 관련기관 ... 8 2. 인터넷의 원리 ... 12 2.1 인터넷 주소 체계 ... 12 2.2 WWW(World-Wide Web) ... 16 2.3 WWW 관련 주요 용어 ... 17 CHAPTER 2 웹 브라우저 1. 인터넷 익스플로러의 실행 및 화면 구성 ... 25 1.1 익스플로러의 실행 ... 25 1.2 익스플로러의 화면 구성 ... 26 1.3 웹 페이지의 이동 ... 28 1.4 인터넷 익스플로러의 도구모음 ... 31 1.5 추천 사이트 방문 ... 32 2. 홈페이지로 이동 방법 ... 34 2.1 〔파일〕-〔열기〕 메뉴 이용 ... 34 2.2 주소 표시줄에 주소 입력 ... 35 2.3 주소 표시창의 목록 이용 ... 36 2.4 〔기록〕 기능 이용 ... 36 2.5 즐겨 찾기 이용 ... 37 3. 필요한 정보의 저장 방법 ... 38 3.1 웹 페이지의 그림 저장 ... 38 3.2 웹 페이지의 부분 복사 ... 40 3.3 현재 웹 페이지의 전체 저장 ... 43 4. 환경 설정 ... 44 4.1 인터넷 옵션 설정 ... 44 4.2 즐겨찾기 ... 47 5. 플러그인 ... 50 5.1 플러그인의 종류 ... 50 5.2 주요 플러그인의 특징 ... 51 CHAPTER 3 인터넷 서비스 1. 전자우편(E-mail) ... 57 1.1 전자우편 개요 ... 57 1.2 아웃룩 익스프레스를 이용한 메일 송수신 ... 59 1.3 웹 메일을 이용한 메일 송수신 ... 66 1.4 전자메일의 매너 ... 67 2. FTP(File Transfer Protocol) ... 68 2.1 WS_FTP 프로그램의 이용 방법 ... 68 3. 텔넷(TELNET) ... 70 4. 유즈넷 뉴스그룹 서비스 ... 71 4.1 유즈넷 뉴스그룹 개요 ... 71 4.2 유즈넷 뉴스그룹 이름 ... 71 4.3 뉴스그룹 환경 설정 ... 72 4.4 뉴스그룹에 가입하기 ... 74 4.5 뉴스그룹 게시물 읽기 ... 76 4.6 뉴스그룹에 게시물 올리기 ... 77 5. 검색엔진 ... 78 5.1 검색엔진의 분류 ... 78 5.2 검색엔진의 사용 예 ... 80 5.3 일반적인 정보검색 과정 ... 89 5.4 참조 사이트 ... 91 6. 인터넷 응용 서비스 ... 92 6.1 인터넷 전화 ... 92 6.2 인터넷 화상회의 ... 93 6.3 인터넷 원격교육 ... 93 6.4 인터넷 방송 ... 94 6.5 전자상거래 ... 95 6.6 인터넷 뱅킹 ... 96 CHAPTER 4 HTML 기초 1. 타이틀 : 〈TITLE〉 ... 105 2. 제목글 : 〈Hn〉 ... 106 3. 문장 구별 태그 ... 107 3.1 문단 구별 : 〈P〉 ... 107 3.2 줄 바꾸기 : 〈BR〉 ... 108 3.3 줄바꾸기 금지 : 〈NOBR〉 ... 109 3.4 문장 그룹화요소 : 〈DIV〉와 〈SPAN〉 ... 111 4. 형태가 정해진 문장 표현 ... 113 4.1 형태가 정해진 텍스트 : 〈PRE〉 ... 113 4.2 형태가 정해진 텍스트 : 〈XMP〉 ... 115 5. 주석 : 〈!- ...-〉 ... 116 6. 인용글 : 〈BLOCKQUOTE〉 ... 117 7. 선 그리기 : 〈HR〉 ... 118 8. 가운데 정렬 : 〈CENTER〉 ... 119 9. 글꼴지정 : 〈FONT〉 ... 120 10. 헤드(Head)태그 ... 122 10.1 메타 데이터(META) 태그 ... 123 CHAPTER 5 목록과 하이퍼링크 및 몸체 1. 목록(List) ... 133 1.1 순서 목록 : 〈OL〉 ... 133 1.2 무순 목록 : 〈UL〉 ... 136 1.3 혼합 목록 ... 139 2. 정의목록 : 〈DL〉 ... 141 3. 하이퍼링크 : 문서 연결하기〈A〉 ... 143 3.1 외부 문서의 연결 ... 143 3.2 문서내의 연결 ... 145 4. 색 이름과 색 값(Color) ... 146 5. 몸체 : 〈BODY〉 ... 147 5.1 배경색(bgColor), 글자색(text) ... 148 5.2 배경 그림(backGround) ... 149 5.3 문장 색깔(Text) ... 150 5.4 링크 색(Link) ... 150 5.5 방문색(VLink)과 활성링크 색(ALink) ... 151 6. 문자 스타일 ... 152 7. 특수문자 ... 156 8. 주소 및 메일지정 : 〈ADDRESS〉 ... 158 CHAPTER 6 테이블과 이미지 및 프레임나누기 1. 표 만들기 : 〈TABLE〉 ... 165 1.1 간단한 표 작성 ... 165 1.2 〈TABLE〉태그의 속성 ... 167 1.3 셀 합치기(colspan, rowspan) ... 170 1.4 테이블과 셀 색상(bgcolor) ... 172 1.5 테이블 속의 테이블 ... 175 2. 그림삽입 : 〈IMG〉 ... 177 2.1 이미지태그 형식 ... 177 2.2 이미지 크기 조절 ... 178 2.3 테두리 생성 ... 180 2.4 이미지 여백 조절 ... 181 2.5 이미지 정렬 ... 182 2.6 이미지 링크 ... 184 3. 이미지 맵 : 〈MAP〉, 〈AREA〉 ... 185 4. 프레임 만들기 : 〈FRAME〉 ... 189 5. 페이지 속의 프레임 : 〈IFRAME〉 ... 194 CHAPTER 7 멀티미디어 활용과 입력양식 및 고급태그 1. 멀티미디어 자료 삽입 ... 201 1.1 Audio와 Video파일의 종류 ... 201 1.2 배경음악삽입 : 〈BGSOUND〉 ... 203 1.3 재생 프로그램 삽입 : 〈EMBED〉 ... 204 1.4 하이퍼 링크 사운드／동영상 재생 : 〈A href ... "멀 2. 입력양식 : (FORM) ... 208 2.1 CGI와 폼의 개요 ... 208 2.2 폼 형식과 입력양식 : 〈FORM〉〈INPUT〉 ... 209 2.3 텍스트와 암호 입력 양식 : (text, password) ... 213 2.4 체크박스 만들기 : (checkbox) ... 214 2.5 라디오 버튼 만들기 : (radio) ... 215 2.6 보내기와 입력취소 버튼 만들기 : (submit, reset) ... 216 2.7 숨겨둔 입력양식 : (hidden) ... 217 2.8 긴 텍스트 입력받기 : 〈TEXTAREA〉 ... 218 2.9 선택 목록 만들기 : 〈SELECT〉 ... 219 3. 마키 : 〈MARQUEE〉 ... 221 4. 스타일 시트사용 : 〔CSS〕 ... 227 4.1 CSS(Cascading Style Sheets) 적용 ... 227 4.2 스타일 시트 명령어 ... 229 4.3 스타일 시트 명령어 활용 ... 232 2부 나모 웹에디터 CHAPTER 1 나모 웹에디터 개요 1. 나모 웹에디터의 특징 ... 241 2. 나모 웹에디터 설치하기 ... 242 3. 나모 웹에디터의 실행 ... 246 3.1 나모 웹에디터의 시작 ... 246 3.2 나모의 기본 작업 환경 ... 247 3.3 나모의 편집 화면 설정 ... 249 4. 나모 웹에디터의 종료 ... 253 CHAPTER 2 문서 작성 1. 웹 문서의 특징 ... 257 2. 새문서 작성과 저장 ... 258 2.1 문서 작성 ... 258 2.2 기호와 수평선 넣기 ... 259 3. 문서 저장과 문서 닫기 ... 261 3.1 문서 저장 방법 ... 262 3.2 문서 닫기 ... 262 3.3 문서 열기 ... 264 4. 새글과 문서 편집 ... 265 4.1 새 글 ... 265 4.2 자르기／복사하기／붙이기 ... 267 4.3 찾기／바꾸기 ... 269 4.4 날짜 넣기 ... 271 4.5 돌이킴／되돌이킴 ... 282 5. 문서 속성 및 문서 정보 ... 285 5.1 문서 정보 ... 285 5.2 문서 속성 ... 276 5.3 속성 바로보기 ... 278 5.4 핵심어 설정하기 ... 279 6. 글자 서식 ... 280 6.1 글자 서식 설정 ... 280 6.2 글자 속성 복사 ... 283 7. 문단 서식 ... 285 7.1 제목 설정 및 문단 정렬 ... 286 7.2 문단과 목록 속성 ... 287 7.3 들여쓰기( ) ... 287 7.4 목록 만들기◀ ... 289 8. 문서 서식 ... 292 9. 스타일 서식(Style Sheet) ... 294 10. 모두 저장하기／모두 닫기 ... 298 CHAPTER 3 그림과 표의 삽입 1. 그림 삽입 ... 305 1.1 클립아트 삽입 ... 305 1.2 그림파일 삽입 ... 307 1.3 문서 배경 그림 삽입 ... 311 1.4 그림 문서의 저장 ... 314 2. 표의 삽입 ... 316 2.1 표 만들기 ... 317 2.2 표의 크기 변경 ... 318 2.3 셀 합치기 ... 320 2.4 표 속성 설정 ... 322 2.5 아기표 만들기 ... 324 2.6 줄의 삽입과 삭제 ... 325 2.7 표 지우기 ... 326 CHAPTER 4 하이퍼링크 1. 하이퍼링크 만들기 ... 333 1.1 글자에 하이퍼링크 만들기 ... 333 1.2 E-mail 하이퍼링크 만들기 ... 336 1.3 새창으로 뜨는 하이퍼링크 만들기 ... 337 1.4 하이퍼링크 속성 ... 338 1.5 문서로 하이퍼링크 연결 ... 340 2. 책갈피 ... 343 2.1 책갈피 만들기 ... 343 2.2 책갈피의 수정 ... 346 2.3 책갈피에 하이퍼링크 만들기 ... 348 2.4 문서의 TOP으로 이동하는 책갈피 ... 350 2.5 하이퍼링크와 스타일의 활용 - 하이퍼링크 밑줄 없애기 ... 352 2.6 하이퍼링크와 스타일의 활용 - 호버 설정 ... 354 CHAPTER 5 프레임 사용하기 1. 프레임과 프레임셋의 기본개념 ... 363 1.1 리소스 관리자를 이용한 새 프레임셋 만들기 ... 363 1.2 직접 프레임 나누는 방법 ... 364 1.3 프레임 지우기 ... 365 2. 프레임을 이용한 홈페이지 구성 ... 366 2.1 프레임 셋의 구성 ... 367 2.2 프레임에 문서 삽입 ... 369 2.3 프레임 속성 및 프레임셋 문서 속성 ... 371 2.4 하이퍼링크 만들기 ... 373 2.5 프레임 저장하기 ... 375 2.6 모든 프레임 저장 ... 380 CHAPTER 6 그림 및 표의 응용 1. 그림 삽입과 그림 편집 ... 387 1.1 그림 삽입 ... 387 1.2 〔바로보기〕를 통한 그림 편집 ... 389 1.3 그림 형식 변환 ... 389 1.4 명도／대비／선명도 ... 390 1.5 그림 자르기 ... 394 2. 그림의 응용 ... 395 2.1 투명한 gif 그림 ... 395 2.2 롤오버 그림 만들기 ... 396 2.3 이미지 맵 ... 398 3. 포토 앨범 만들기 ... 401 4. 스마트 버튼 만들기 ... 408 5. 플래시 버튼 만들기 ... 415 6. 레이아웃 표 ... 418 CHAPTER 7 폼과 폼필드 1. 폼 개요 ... 427 2. 폼 필드 ... 427 3. 폼 작성 ... 428 3.1 한 줄 글상자 ... 428 3.2 펼침 목록 메뉴 ... 430 3.3 라디오 단추 ... 433 3.4 확인 상자 ... 435 3.5 스크롤 글상자 ... 437 3.6 누름 단추 ... 438 3.7 폼 속성 ... 440 4. 메일 보내기 ... 440 CHAPTER 8 레이어와 멀티미디어 1. 레이어 ... 447 2. 레이어 다루기 ... 448 2.1 레이어 만들기 ... 448 2.2 레이어 편집하기 ... 449 2.3 레이어에 내용 입력하기 ... 451 2.4 레이어 배경 꾸미기 ... 452 2.5 레이어 겹치기와 레이어 목록 보기 ... 453 3. 멀티미디어 ... 454 4. 멀티미어 파일 삽입 ... 456 4.1 플래시 삽입 ... 456 4.2 애플릿 삽입 ... 458 4.3 미디 삽입 ... 460 CHAPTER 9 타임 라인과 액션 1. 타임 라인 ... 467 2. 애니메이션 ... 467 3. 액션과 이벤트 ... 472 4. 액션 삽입 ... 474 4.1 개체에 액션 삽입 ... 474 4.2 타임 라인에 액션 넣기 ... 479 CHAPTER 10 스크립트 1. 스크립트 ... 487 2. 스크립트 마법사 ... 487 2.1 텍스트 메뉴 ... 487 2.2 펼침 목록 메뉴 ... 490 2.3 펼침 메뉴 ... 492 2.4 전환 효과 ... 496 2.5 떠있는 레이어 만들기 ... 498 2.6 움직이는 텍스트 ... 500 2.7 롤오버 그림 ... 501 2.8 애니메이션 효과 ... 503 2.9 링크 이동 단추 ... 505 2.10 순환 배너 ... 507 2.11 새 윈도우 열기 ... 509 2.12 텍스트 시계 넣기 ... 511 CHAPTER 11 웹 사이트 만들기 1. 웹 사이트 ... 517 2. 사이트 템플릿 ... 517 2.1 사이트 마법사 1단계(템플릿 선택) ... 517 2.2 사이트 마법사 2단계(구조 변경) ... 518 2.3 사이트 마법사 3단계(테마 선택) ... 524 2.4 사이트 마법사 4단계(사이트 정보 입력) ... 525 2.5 사이트 마법사 5단계 - 출판하기 ... 526 CHAPTER 12 사이트 관리와 출판하기 1. 사이트 관리자 ... 531 2. 사이트 관리 ... 531 2.1 새 사이트 만들기 ... 531 2.2 사이트 저장 ... 532 2.3 사이트 닫기 ... 532 2.4 사이트 열기 ... 533 3. 기존의 홈페이지를 웹 사이트로 만들기 ... 534 4. 출판하기 ... 537 4.1 웹 서버에 대한 설정 ... 537 4.2 웹 서버에 연결 ... 540 4.3 웹 서버로 업로드 ... 541 5. 웹 서버의 파일 다루기 ... 543 5.1 웹 서버에서 파일 가져오기 ... 543 5.2 웹 서버에 있는 파일 지우기 ... 544