“탐나는 웹 사이트 제작을 위한 드림위버 CS5의 완벽 사용법!” 드림위버는 ‘드림(Dream)’과 ‘위버(Weaver)’가 조합된 단어로 ‘꿈을 짜는 기구’라고 해석할 수 있습니다. 여기서 꿈이란 웹 사이트 즉, 홈페이지를 뜻하는 것으로, 드림위버는 홈페이지를 제작하는 최강의 기능을 보유하고 있는 웹 저작 도구입니다. 드림위버는 위지윅 방식의 편집 창과 더불어 코드를 직접 입력할 수 있는 코드 편집 창이 제공되는 웹 저작 도구로서, 세계적으로 많은 사용자를 확보하고 있는 프로그램입니다. 특히, 드림위버 CS5 버전은 CSS 레이아웃 기능, 비활성화를 이용한 주석 처리 기능, CS Live를 이용한 온라인 서비스 기능, 간략화된 사이트 정의 기능, 라이브 뷰 내비게이션 기능과 같은 새롭고 강화된 기능으로 웹 종사자들에게 주목 받고 있습니다. <실력이 탐나는 드림위버 CS5>는 웹에 관련된 직업을 갖길 원하거나 스스로 웹페이지를 만들어내고 싶어 하는 사람을 대상으로 드림위버 CS5의 사용법을 친절하고 완벽하게 소개합니다. <실력이 탐나는> 시리즈의 체계적인 구성 방식으로 실전에 완벽하게 대비할 수 있도록 하였으며, 드림위버를 학습하는 데 있어 필요한 HTML과 CSS의 기초적인 내용과 그누보드, 고도몰 솔루션 등 실전 웹 사이트를 위한 다양한 연계 프로그램의 활용법에 대해서도 소개합니다. 웹 저작에 관련한 여러 권의 책을 학습하는 것이 부담스러워 중도에 포기했다거나 시작도 하지 못했다면, 이 책 한권으로 웹 저작의 기초부터 실전 테크닉까지 단계적으로 확실하게 배울 수 있습니다. 독자 타깃 ■ 전문적인 웹디자이너를 꿈꾸는 웹디자이너 지망생 ■ 웹 프로그래밍, 웹 기획 등 웹 관련 업무를 하는 웹 종사자 ■ 천편일률적인 블로그에서 벗어나 개성 넘치는 개인 웹사이트를 갖고 싶어 하는 일반인 ■ 웹 제작의 표준 도구, 드림위버를 체계적으로 익힐 수 있는 실전 대비 입문서! 웹 종사자라면 반드시 익혀야 하는 드림위버를 체계적으로 학습할 수 있는 입문서입니다. 수준 높은 예제들로 구성되어 있어 실전에 완벽하게 대비할 수 있습니다. ■ 디자인 편집 작업부터 웹 표준 코딩까지 아우르는 웹 제작 기법의 모든 것 소개! 디자인 편집 모드에서의 작업부터 웹 제작에 필수 요소인 HTML, CSS의 코딩 방법뿐만 아니라 최근 들어 각광받고 있는 웹 표준에 대해서도 설명합니다. 또한, XHTML과 CSS, 그리고 HTML5에 대한 특징과 구현 방법에 대해서도 소개합니다. ■ 실전 웹 사이트를 위한 다양한 연계 프로그램의 활용법 소개! 드림위버 CS5를 이용하여 제작한 웹 문서를 실전에 활용할 수 있도록 다양한 연계 프로그램의 활용법을 알려줍니다. 그누보드를 통한 게시판 사이트와 고도몰 솔루션을 통한 쇼핑몰 페이지의 제작 과정을 살펴볼 수 있습니다. 장별 요약 Chapter 01 업계를 선도하는 웹 사이트 제작 툴, 드림위버 CS5와의 첫 만남 드림위버는 홈페이지 저작 도구로 홈페이지를 처음 제작하는 초보자부터 블로그와 같은 CMS 기반의 제작 프로그램까지 전반적으로 다룰 수 있는 고급 사용자도 만족시킬 만한 막강한 기능을 가집니다. Chapter 01에서는 이러한 드림위버 CS5에 대한 신기능과 함께 설치와 실행 과정, 사이트 정의, 작업 레이아웃 구성 요소와 같이 기본적으로 알아야 할 주요 기능에 대해 알아봅니다. Chapter 02 웹 문서에 텍스트, 이미지, 멀티미디어 파일 삽입하기 화면에 표시되는 형태 그대로 문서로 만들어지는 위지윅(WYSIWYG) 방식을 제공하는 드림위버의 문서 편집 창을 이용하면, 웹 페이지에 삽입되는 텍스트, 이미지, 멀티미디어 무비와 같은 콘텐츠를 빠르고 직관적으로 확인할 수 있어 편집에 용이합니다. Chapter 02에서는 웹 문서에 기본적인 콘텐츠를 삽입하고 편집하는 방법에 대해 알아봅니다. Chapter 03 다양한 하이퍼링크 기능으로 웹 문서 연결하기 웹 문서 안의 텍스트, 이미지 등에 마우스 포인터를 가져가면 손가락 모양으로 형태가 변경되고, 클릭하면 새로운 웹 사이트로 이동되거나 파일을 다운로드 받을 수 있는 대화상자가 표시되거나 메일을 보낼 수 있는 프로그램이 실행됩니다. 이러한 기능을 담당하는 하이퍼링크는 웹사이트에서 문서와 문서를 연결해주는 중요한 역할을 합니다. Chapter 03을 통해 하이퍼링크에 관련된 기초적인 사용법부터 응용까지 함께 알아보겠습니다. Chapter 04 테이블 기능으로 데이터 정리와 문서 레이아웃 구현하기 셀, 행, 열로 구성되어 있는 테이블은 한눈에 데이터를 확인할 수 있도록 정리하는 용도 외에도 이미지, 텍스트, 플래시 무비와 같은 멀티미디어 요소를 상하좌우로 배치하는 레이아웃 구성의 용도로도 사용됩니다. Chapter 04에서는 테이블의 기본 삽입과 편집 방법에 대해 알아보고, [PROPERTIES] 패널을 이용하여 자유롭게 꾸미는 방법에 대해서도 살펴봅니다. Chapter 05 스타일시트로 세련된 웹 문서 디자인하기 홈페이지의 디자인을 유연하게 조정할 수 있으며 정확하게 구현할 수 있는 ‘CSS(Cascading Style Sheets)’는 홈페이지 제작에 있어 중요한 요소입니다. CSS를 이용하면 홈페이지의 실제 내용과 서식 디자인을 분리시킬 수 있어 소스를 간결하며 효율적으로 관리할 수 있고, 빠른 업데이트를 할 수 있습니다. Chapter 05에서는 CSS의 다양한 선택자 등록과 관련된 속성을 이용하여 문서를 디자인해 봅니다. Chapter 06 AP Div로 자유로운 문서 레이아웃 구현하기 AP Div는 투명한 별도의 문서 편집 창으로써, AP Div 안에는 텍스트, 이미지, 멀티미디어, 테이블과 같은 오브젝트를 삽입할 수 있고, 자유롭게 드래그앤드롭할 수 있으며, 좌표 값을 통해 이동시킬 수 있고, 여러 AP Div를 삽입하여 중첩할 수도 있습니다. Chapter 06에서는 이러한 AP Div의 특징을 이용하여 문서에 원하는 형태로 AP Div를 삽입하여 배치시키고, 관련된 비헤이비어 기능과 연계하여 서브 메뉴 표시, 팝업 창 표시 효과와 같은 동적인 기능을 구현해 봅니다. Chapter 07 회원 가입, 로그인, 게시판에 사용되는 폼 문서 만들기 인터넷 뱅킹, 쇼핑몰, 영화 예매, 카페, 블로그, 미니 홈피와 같은 웹사이트를 이용하다 보면 사용자가 직접 텍스트를 입력하거나 목록을 선택하여 자료를 전달하는 형태의 폼 문서를 자주 접하게 됩니다. Chapter 07에서는 이러한 폼 문서를 구성하는 요소들에는 어떤 것들이 있는지 알아보고 폼 문서를 제작하고 편집하는 방법에 대해서도 살펴봅니다. Chapter 08 프레임, 아이프레임, 템플릿으로 홈페이지 제작하기 두 개 이상의 문서를 한 화면에 배치하는 프레임 구조, 다른 문서를 테이블이나 이미지처럼 가로와 세로 크기를 지정하여 삽입하는 아이프레임, 레이아웃을 고정 포맷 문서로 등록한 후 편집 가능 영역만 내용을 교체하는 템플릿 등을 사용하여 문서를 만들고 하이퍼링크와 타깃을 지정하는 과정에 대해 알아봅니다. Chapter 09 비헤이비어, 롤오버 이미지, 점프 메뉴로 이벤트에 따라 동적 효과 내기 비헤이비어는 자바스크립트를 이용하여 팝업 창, 이미지 교체, 속성 변경과 같은 동적인 효과를 문서에 추가할 수 있는 기능입니다. 코드 편집 창에 소스를 직접 입력하지 않아도 비헤이비어 기능을 이용하면 관련된 패널과 대화상자를 설정하는 것으로 쉽고 빠르게 구현할 수 있습니다. Chapter 09에서는 이미지와 텍스트만으로 이루어진 웹 문서를 다이내믹하게 꾸미는 방법에 대해 알아봅니다. Chapter 10 Spry 프레임 워크를 이용한 동적 패널, 내비게이션, 테이블 구현하기 별도의 자바스크립트 파일과 CSS 파일을 자동 생성하며 이벤트에 따라 관련된 내용 부분이 교체되고 애니메이션 효과가 실행되는 Spry 위젯에 대해 알아봅니다. 또한 관련된 동적 패널, 내비게이션, 테이블을 삽입하고 디자인을 변경해 봅니다. 이와 같은 Spry 위젯은 웹 페이지를 고급스럽고 다이내믹하게 만듭니다. Chapter 11 웹 계정 만들고 홈페이지 출판 및 운영하기 드림위버에서 제작한 홈페이지 문서의 최종 목적지는 웹으로 출판하는 것입니다. 홈페이지를 웹으로 출판하기 위해서는 웹 계정이라 불리는 저장 공간과 웹 계정에 업로딩할 수 있도록 도와주는 FTP 프로그램이 필요합니다. Chapter 11에서는 이러한 웹 출판을 위한 환경 준비와 신청한 웹 계정에 알FTP나 드림위버의 FTP 기능을 이용하여 업로딩하는 과정에 대해 알아봅니다. Chapter 12 드림위버에서 HTML과 CSS 하드 코딩하기 드림위버에서는 쉽고 편리한 디자인 모드의 편집 창도 제공하지만 코드 힌트, 오류 검사, 소스의 자동 정리 기능과 같이 HTML과 CSS와 같은 소스를 직접 입력하는 코드 편집 창에서도 다양한 기능을 지원하고 있습니다. HTML과 CSS는 홈페이지 제작에 있어 기본이 되는 문법이므로 이러한 드림위버의 다양한 코딩 지원 기능을 활용하여 직접 소스를 입력하고 결과를 확인해 봅니다. Chapter Plus 01 인클루드, 그누보드, 고도몰 솔루션으로 실전 웹사이트 만들기 여기에서는 인클루드 기능과 그누보드 게시판, 고도몰의 쇼핑몰 솔루션과 같은 프로그램을 이용하여 드림위버에서 제작한 홈페이지 문서를 활용하는 과정에 대해 소개합니다. 인클루드와 그누보드 게시판의 경우에는 PHP가 지원되는 웹 계정이 필요하며, 고도몰의 쇼핑몰 솔루션은 웹사이트에서 직접 회원으로 가입한 후 서비스를 신청해야 본문을 진행할 수 있습니다. Chapter Plus 02 웹 표준 문서 제작과 CSS 레이아웃, XHTML, HTML5 구현하기 최근 들어 각광받고 있는 웹 표준에 대해 이해하고 유효성 검사 방법, XHTML 문서 제작 방법, CSS를 이용한 레이아웃 제작 방법, 그리고 HTML5에 대한 특징과 구현 방법에 대해 살펴봅니다. 또한, 파이어폭스 웹브라우저에서의 미리 보기 연결 과정에 대해서도 알아봅니다.

CHAPTER 01 업계를 선도하는 웹 사이트 제작 툴, 드림위버 CS5와의 첫 만남 UNIT 01 새로워진 드림위버 CS5 살펴보고 내 컴퓨터에 설치하기 |간략개요| 드림위버 CS5의 새로운 기능 알아보기 |간단실습| 드림위버 CS5의 시험 버전 다운로드 받기 |간단실습| 내 컴퓨터에 드림위버 CS5 시험 버전 설치하기 |TIP| 드림위버 CS5 설치를 위한 컴퓨터 사양 알아보기 UNIT 02 드림위버 CS5의 화면 구성 이해하고 사용자 작업 환경 설정하기 |간략개요| 드림위버 CS5의 화면 구성과 레이아웃, 뷰 모드 살펴보기 |간단실습| 드림위버 CS5의 편집 모드 살펴보고 레이아웃 조정하기 |TIP| 시작 페이지 대화상자(Welcome Screen) 살펴보기 |간단실습| 드림위버 CS5의 패널 분리/병합/이동하기 UNIT 03 웹 사이트 제작을 위한 사이트 정의와 폴더/파일 관리하기 |간략개요| 사이트 정의의 필요성 이해하기 |간단실습| 예제 파일 폴더로 사이트 정의하기 |TIP| 정의한 사이트 수정하기 |간단실습| 새로운 파일과 폴더 생성하고 열기 |TIP| [FILES] 패널을 이용하여 파일 열기 |TIP| [Welcome Screen] 대화상자를 이용하여 새 파일 만들기 |TIP| 최근 작업한 파일 열기 UNIT 04 화면 조정 기능 살펴보고 웹브라우저에서 문서 확인하기 |간략개요| 문서 편집에 도움을 주는 화면 조정 기능 알아보기 |간단실습| 라이브 뷰 모드와 웹브라우저에서 문서 확인하고 확대/축소/패닝하기 |간단실습| 안내선과 격자 사용하기 |TIP| 휴대용 장치에서 페이지 미리 보기 |POWER UNIT| 라이브 뷰 내비게이션 막대 이용하기 CHAPTER 02 웹 문서에 텍스트, 이미지, 멀티미디어 파일 삽입하기 UNIT 01 텍스트 문단 입력하고 문서 환경 설정하기 |간략개요| 텍스트 문단 입력 방법과 환경 설정 방법 익히기 |간단실습| 문단 편집하고 목록 문단 만들기 |TIP| 카피라이트 기호(ⓒ) 입력하기 |TIP| 키보드를 이용한 특수 문자 입력하기 |간단실습| 문서 전체의 텍스트 스타일과 배경, 여백 설정하기 |TIP| [Page Properties] 대화상자의 세부 옵션 살펴보기 |TIP| 텍스트와 관련된 [PROPERTIES] 패널의 세부 옵션 살펴보기 |POWER UNIT| 목록 문단의 기호 변경하기 UNIT 02 이미지 삽입하고 편집하기 |간략개요| 웹 문서에 삽입할 수 있는 웹용 이미지 포맷 이해하기 |간단실습| 이미지 삽입하고 관련 속성 설정하기 |TIP| 이미지의 정렬을 위한 [Align] 속성 값 살펴보기 |간단실습| 삽입한 이미지의 크기 조정하고 보정하기 |TIP| 이미지에서 필요한 부분만 자르기 |TIP| 이미지와 관련된 [PROPERTIES] 패널 살펴보기 |POWER UNIT| 포토샵 프로그램과 연계하여 이미지 편집하기 UNIT 03 플래시 무비와 사운드 파일 삽입하기 |간략개요| 플래시 무비와 사운드 파일의 종류 알아보기 |간단실습| 플래시 무비 삽입하고 속성 설정하기 |TIP| 플래시 무비와 관련된 [PROPERTIES] 패널 살펴보기 |간단실습| 사운드 파일 삽입하고 속성 설정하기 |TIP| 플러그인과 관련된 [PROPERTIES] 패널 살펴보기 |POWER UNIT| 플래시 비디오(FLV) 파일 변환하고 삽입하기 활|용|실|습 CHAPTER 03 다양한 하이퍼링크 기능으로 웹 문서 연결하기 UNIT 01 텍스트와 이미지에 하이퍼링크 지정하기 |간략개요| 다양한 하이퍼링크 지정과 타깃 이해하기 |간단실습| 텍스트와 이미지에 하이퍼링크 지정하기 |간단실습| 하이퍼링크 텍스트 스타일 변경하기 |TIP| [Page Properties] 대화상자의 [Links[CSS]] 카테고리 살펴보기 UNIT 02 네임 앵커로 하이퍼링크 지정하기 |간략개요| 네임 앵커 이해하기 |간단실습| 문서 최상단으로 자동 이동하는 네임 앵커 지정하기 |간단실습| 지정한 위치로 자동 이동하는 네임 앵커 기능 활용하기 |TIP| 다른 문서에 지정된 네임 앵커 위치 삽입하기 UNIT 03 이미지 맵으로 하이퍼링크 지정하기 |간략개요| 이미지 맵 기능 이해하기 |간단실습| 이미지 맵으로 하이퍼링크 지정하기 |TIP| 지정된 이미지 맵 영역 편집하기 |간단실습| 다른 문서에 이미지 맵 복사하여 사용하기 활|용|실|습 CHAPTER 04 테이블 기능으로 데이터 정리와 문서 레이아웃 구현하기 UNIT 01 테이블 삽입하고 셀 편집하기 |간략개요| 테이블의 구성 요소 이해하기 |간단실습| 테이블 삽입하고 데이터 입력하기 |TIP| [Table] 대화상자 살펴보기 |TIP| 삽입된 테이블의 행 수와 열 수 변경하기 |간단실습| 삽입된 테이블의 셀 편집하기 |TIP| [INSERT] 패널을 이용한 행과 열 추가하? |TIP| 셀 나누기 |POWER UNIT| 테이블과 셀의 다양한 선택 방법 익히기 |POWER UNIT| 셀 크기를 ‘%’, ‘px’ 단위로 변경 및 삭제하기 UNIT 02 테이블과 셀 꾸미기 |간략개요| 테이블과 셀에 관련된 속성 알아보기 |간단실습| 테이블과 셀에 관련된 여백 설정과 정렬 지정하기 |TIP| 테이블에 관련된 [PROPERTIES] 패널 살펴보기 |TIP| 셀에 관련된 [PROPERTIES] 패널 살펴보기 |간단실습| 셀의 배경 색상과 입력 텍스트의 속성 변경하기 |POWER UNIT| 텍스트 파일을 테이블 구조로 변환하기 |TIP| 드림위버에서 임포트한 텍스트 형식의 파일 구조 살펴보기 |POWER UNIT| 엑셀 파일을 테이블 구조로 변환하기 UNIT 03 테이블을 이용한 레이아웃 구현하기 |간략개요| 테이블을 이용한 레이아웃 구성 작업 이해하기 |간단실습| 테두리가 없는 테이블을 이용한 레이아웃 구현하기 |간단실습| 셀 배경 이미지 지정과 중첩 테이블을 이용한 레이아웃 구현하기 |POWER UNIT| 확장 테이블 모드(Expanded Tables Mode)를 이용하여 테이블 편집하기 활|용|실|습 CHAPTER 05 스타일시트로 세련된 웹 문서 디자인하기 UNIT 01 클래스 정의하고 적용하기 |간략개요| CSS 이해하고 클래스 선택자의 특징 알아보기 |간단실습| 클래스 방식의 선택자 정의와 적용하기 |TIP| [CSS STYLES] 패널 살펴보기 |TIP| [CSS Rule definition] 대화상자의 [Type] 카테고리 살펴보기 |간단실습| 정의된 클래스 선택자의 속성 변경하기 |TIP| [CSS Rule definition] 대화상자의 [Background] 카테고리 살펴보기 |TIP| [CSS Rule definition] 대화상자의 [Box] 카테고리 살펴보기 |TIP| [CSS Rule definition] 대화상자의 [Border] 카테고리 살펴보기 UNIT 02 아이디 방식의 선택자 등록하고 적용하기 |간략개요| 아이디 방식의 선택자 특징 알아보기 |간단실습| 테이블에 ID 정의하고 디자인하기 |간단실습| DIV 태그에 ID 정의하고 디자인하기 UNIT 03 태그 재정의 방식으로 CSS 적용하기 |간략개요| 태그 재정의 방식의 선택자 특징 알아보기 |간단실습| BODY 태그에 CSS 적용하기 |간단실습| 목록 문단 관련 태그에 CSS 적용하기 |TIP| [CSS Rule definition] 대화상자의 [List] 카테고리 살펴보기 |POWER UNIT| 인라인 방식으로 CSS 적용하기 UNIT 04 롤오버 텍스트 하이퍼링크 메뉴 만들기 |간략개요| 텍스트 하이퍼링크를 위한 선택자 이해하기 |간단실습| 상태 변화에 따라 디자인이 변경되는 텍스트 하이퍼링크 구현하기 |간단실습| 컴파운드 선택자를 이용한 다중 텍스트 하이퍼링크 메뉴 구현하기 UNIT 05 외부 CSS 파일에 선택자 등록하여 적용하기 |간략개요| 외부 CSS 파일 방식으로 CSS 적용 시 특징과 관련 과정 알아보기 |간단실습| 외부 CSS 파일로 선택자 등록하여 적용하기 |TIP| 외부 CSS 파일이 연결된 [CSS STYLES] 패널 살펴보기 |간단실습| CSS 파일 연결하여 공통으로 여러 문서에 사용하기 |POWER UNIT| 문서 내부에 등록된 선택자를 자동으로 외부 CSS 파일로 이동시키기 활|용|실|습 CHAPTER 06 AP Div로 자유로운 문서 레이아웃 구현하기 UNIT 01 AP Div 특징 이해하고 삽입하기 |간략개요| AP Div의 특징 이해하기 |간단실습| AP Div 삽입/선택/이동하기 |TIP| 드래그해서 AP Div 삽입하기 |TIP| [AP ELEMENTS] 패널을 이용하여 선택하기 |간단실습| 여러 개의 AP Div 편집하기 UNIT 02 AP Div를 이용한 레이아웃 배치하기 |간략개요| AP Div에 관련된 속성 알아보기 |간단실습| AP Div의 중첩 순서 조정하기 |간단실습| AP Div에 Overflow 속성 제어하기 |POWER UNIT| [Tracing Image] 기능을 이용하여 레이아웃 배치하기 |POWER UNIT| AP Div 구조를 테이블 구조로 서로 변환하기 UNIT 03 AP Div를 이용한 동적 내비게이션과 팝업 창 효과 적용하기 |간략개요| Show-Hide Element 비헤이비어와 AP Div의 Vis 속성 알아보기 |간단실습| 특정 위치에 팝업 창 효과 적용하기 |간단실습| 롤오버 상태에 따라 서브 메뉴 표시하기 |POWER UNIT| Drag AP Element 비헤이비어를 이용하여 드래그 효과 적용하기 활|용|실|습 CHAPTER 07 회원 가입, 로그인, 게시판에 사용되는 폼 문서 만들기 UNIT 01 폼 정의와 텍스트 필드 삽입하기 |간략개요| 폼 문서 이해하고 텍스트 필드의 종류 알아보기 |간단실습| 테이블을 감싸는 폼 정의하기 |간단실습| 텍스트 필드 삽입하고 CSS로 디자인하기 UNIT 02 텍스트 영역 필드, 파일 필드, 이미지 필드 삽입하기 |간략개요| 텍스트 영역 필드, 파일 필드, 이미지 필드의 특징 알아보기 |간단실습| 이미? 필드와 파일 필드 삽입하기 |간단실습| 텍스트 영역 필드 삽입하고 CSS로 디자인하기 UNIT 03 라디오 버튼, 체크 박스, 필드 세트 삽입하기 |간략개요| 라디오 버튼, 체크 박스, 필드 세트의 특징 알아보기 |간단실습| 라디오 그룹으로 라디오 버튼 삽입하기 |TIP| [Radio Group] 대화상자 살펴보기 |간단실습| 필드 세트 구성하고 체크 박스 그룹으로 체크 박스 삽입하기 |TIP| [Checkbox Group] 대화상자 살펴보기 UNIT 04 리스트 메뉴와 폼 버튼 삽입하기 |간략개요| 리스트 메뉴와 폼 버튼의 특징 알아보기 |간단실습| 리스트 메뉴 삽입하고 CSS로 디자인하기 |TIP| [List Values] 대화상자 살펴보기 |TIP| 높이와 스크롤바가 표시되는 리스트 메뉴 형태로 변경하기 |간단실습| 폼 버튼 삽입하고 CSS로 디자인하기 |POWER UNIT| Validate Form 비헤이비어로 텍스트 필드의 유효성 검사하기 활|용|실|습 CHAPTER 08 프레임, 아이프레임, 템플릿으로 홈페이지 제작하기 UNIT 01 프레임 구조 만들기 |간략개요| 프레임 구조와 관련 속성 알아보기 |간단실습| 프레임 구조 만들고 파일 연결하기 |간단실습| 프레임 크기 조정하고 전체 프레임 문서 저장하기 |TIP| 프레임 크기인 ‘1 Relative’의 의미 이해하기 |POWER UNIT| 메뉴 명령을 이용한 프레임 구조 만들기 UNIT 02 프레임 구조에서 하이퍼링크와 타깃 지정하기 |간략개요| 프레임 구조에서의 하이퍼링크와 타깃 이해하기 |간단실습| 특정 프레임으로 하이퍼링크와 타깃 연결하기 |간단실습| 구성된 여러 개의 프레임으로 동시에 여러 개의 하이퍼링크와 타깃 지정하기 |POWER UNIT| 하이퍼링크의 기본 타깃 지정하기 UNIT 03 아이프레임 삽입하고 하이퍼링크와 타깃 지정하기 |간략개요| 아이프레임의 특징과 구조 이해하기 |간단실습| 저장된 문서를 아이프레임으로 삽입하기 |간단실습| 아이프레임 구조에서의 하이퍼링크와 타깃 지정하기 |POWER UNIT| 배경이 투명한 아이프레임 삽입하기 |POWER UNIT| 아이프레임의 스크롤바 색상 설정하기 |TIP| 색상 스크롤바 소스 살펴보기 UNIT 04 템플릿으로 빠르게 홈페이지 만들기 |간략개요| 템플릿을 이용한 홈페이지 제작 과정 알아보기 |간단실습| 템플릿 페이지 제작하고 편집 영역 지정하기 |간단실습| 템플릿 적용하고 데이터 삽입하기 |POWER UNIT| [Assets] 패널을 이용한 템플릿 적용 문서 만들기 |TIP| [Assets] 패널의 [Templates] 명령 살펴보기 |POWER UNIT| 템플릿 업데이트하여 적용 템플릿 문서 변경하기 활|용|실|습 CHAPTER 09 비헤이비어, 롤오버 이미지, 점프 메뉴로 이벤트에 따라 동적 효과 내기 UNIT 01 Popup Message와 Set Text 비헤이비어로 텍스트 메시지 표시하기 |간략개요| 비헤이비어에 대한 이해와 Popup Message, Set Text 비헤이비어 알아보기 |간단실습| Popup Message 비헤이비어로 경고음과 함께 메시지 창 출력하기 |TIP| 적용한 비헤이비어 삭제와 수정하기 |간단실습| Set Text 비헤이비어로 웹브라우저의 상태 표시줄에 메시지 출력하기 UNIT 02 Open Browser Window와 Call Javascript 비헤이비어로 팝업 창 열고 닫기 |간략개요| Call Javascript와 Open Browser Window 비헤이비어 알아보기 |간단실습| Call Javascript 비헤이비어로 웹브라우저 창 자동 닫기 |간단실습| Open Browser Window 비헤이비어로 팝업 창 표시하기 |POWER UNIT| 소스 편집해서 팝업 창의 위치 조정하기 |POWER UNIT| 자동 인쇄 기능이 추가된 버튼 만들기 UNIT 03 Swap Image와 Change Property 비헤이비어로 이미지 교체하고 속성 변경하기 |간략개요| Swap Image와 Change Property 비헤이비어 알아보기 |간단실습| Swap Image 비헤이비어로 롤오버 갤러리 만들기 |간단실습| Change Property 비헤이비어로 테이블의 셀 색상 제어하기 UNIT 04 Effect 비헤이비어로 트랜지션 효과 적용하기 |간략개요| Effect 관련 비헤이비어 알아보기 |간단실습| 다양한 애니메이션 효과 나타내기 |간단실습| Grow/Shrink 비헤이비어로 팝업 창 효과 내기 UNIT 05 점프 메뉴와 롤오버 이미지 삽입하기 |간략개요| 점프 메뉴와 롤오버 이미지 기능 알아보기 |간단실습| 점프 메뉴 삽입하고 디자인 변경하기 |TIP| 점프 메뉴 수정하기 |간단실습| 이벤트에 따라 이미지가 변경되는 롤오버 이미지 삽입하기 활|용|실|습 CHAPTER 10 Spry 프레임 워크를 이용한 동적 패널, 내비게이션, 테이블 구현하기 UNIT 01 Spry Tabbed Panels 위젯으로 동적 패널 삽입하기 |간략개요| Spry Tabbed Panels 위젯 특징 알아보기 |간?실습| Spry Tabbed Panels 위젯으로 클릭 시 교체되는 패널 삽입하기 |간단실습| Spry Tabbed Panels 위젯의 디자인 수정하기 UNIT 02 Spry Collapsible Panel 위젯과 Spry Accordion 위젯으로 동적 패널 삽입하기 |간략개요| Spry Accordion 위젯과 Spry Collapsible Panel 위젯의 특징 알아보기 |간단실습| Spry Accordion 위젯으로 확장/축소되는 동적 패널 만들기 |TIP| Spry Accordion 위젯의 디자인 변경하기 |간단실습| Spry Collapsible Panel 위젯으로 클릭할 때마다 확장/축소되는 패널 만들기 UNIT 03 Spry Menu Bar 위젯으로 동적 내비게이션 삽입하기 |간략개요| Spry Menu Bar 위젯의 특징 알아보기 |간단실습| Spry Menu Bar 위젯으로 클릭 시 확장되는 내비게이션 삽입하기 |간단실습| Spry Menu Bar 위젯 디자인 수정하기 UNIT 04 Spry Data Set 위젯으로 동적 테이블 만들기 |간략개요| Spry Data Set 위젯의 특징 알아보기 |간단실습| Spry Data Set 위젯으로 테이블 데이터 호출하기 |간단실습| Spry Data Set 위젯의 디자인 수정하기 |POWER UNIT| Spry Data Set 위젯에 연결된 데이터 테이블 업데이트하기 활|용|실|습 CHAPTER 11 웹 계정 만들고 홈페이지 출판 및 운영하기 UNIT 01 웹 출판을 위한 웹 계정, 도메인 준비하기 |간략개요| 웹 계정과 도메인 알아보기 |간단실습| 무료 호스팅 서비스 신청하기 |간단실습| 신청한 웹 계정 정보 확인하기 UNIT 02 알FTP 프로그램을 이용한 출판 및 운영하기 |간략개요| 알FTP의 특징과 화면 구성 알아보기 |간단실습| 알FTP에 웹 계정 정보 등록하기 |간단실습| 웹 계정에 시작 페이지 업로딩하고 결과 확인하기 UNIT 03 드림위버의 FTP 기능으로 출판 및 운영하기 |간략개요| 드림위버에서의 웹 출판을 위한 [Files] 패널 알아보기 |간단실습| FTP 기능을 사용하기 위한 사이트 정의하기 |간단실습| [FILES] 패널로 웹 계정에 출판하기 활|용|실|습 CHAPTER 12 드림위버에서 HTML과 CSS 하드 코딩하기 UNIT 01 HTML 구조 이해하고 주석문, 문단, DIV에 관련된 태그 익히기 |간략개요| 코딩 환경 설정과 HTML 구조, 주석, 문단, DIV 태그 형식과 속성 알아보기 |간단실습| 문서 구조와 주석, Heading 태그 익히기 |TIP| [DocType]의 종류 알아보기 |간단실습| P, BR, DIV, EM, STRONG 태그 익히기기 |POWER UNIT| 사용자 단축키 설정하기 UNIT 02 목록 문단과 정의에 관련된 태그 익히기 |간략개요| O, UL, LI, DL, DT, DD 태그 알아보기 |간단실습| OL, UL, LI 태그 익히기 |TIP| 순서 목록과 블릿 목록 앞의 숫자 형식과 기호 변경하기 |간단실습| DL, DT, DD 태그 익히기 UNIT 03 수평선, 이미지, 하이퍼링크에 관련된 태그 익히기 |간략개요| HR, IMG, A 태그 형식과 속성 알아보기 |간단실습| HR, IMG 태그 익히기 |간단실습| A 태그 익히기 UNIT 04 테이블과 프레임에 관련된 태그 익히기 |간략개요| 테이블, 프레임 관련 태그 형식과 속성 알아보기 |간단실습| 테이블 태그 익히기 |간단실습| 프레임 관련 태그 익히기 |TIP| 아이프레임 관련 태그 익히기 UNIT 05 폼과 관련된 태그 익히기 |간략개요| 폼 관련 태그 형식과 속성 알아보기 |간단실습| 폼 정의, 텍스트 필드, 텍스트 영역, 이미지 필드, 파일 필드 태그 익히기 |간단실습| 라디오 버튼, 체크 박스, 셀렉트 메뉴, 폼 버튼 관련 태그 익히기 UNIT 06 CSS 선언과 다양한 선택자 이해하기 |간략개요| CSS 선언과 선택자 방식 이해하기 |간단실습| 태그 선택자 익히기 |간단실습| 클래스 선택자 익히기 |간단실습| 아이디 선택자 익히기 UNIT 07 다양한 CSS 속성 익히기 |간략개요| CSS 속성 알아보기 |간단실습| 하이퍼링크, 목록 문단에 CSS 적용하기 |간단실습| 테이블과 폼에 CSS 적용하기 활|용|실|습 CHAPTER PLUS 01 인클루드, 그누보드, 고도몰 솔루션으로 실전 웹사이트 만들기 UNIT 01 인클루드를 이용한 PHP 웹사이트 만들기 |간략개요| PHP 문서의 이해와 인클루드 기능 알아보기 |간단실습| 인클루드로 사용할 공통 메뉴, 푸터 파일 만들기 |간단실습| 인클루드로 파일 삽입하고 웹 계정에서 확인하기 UNIT 02 그누보드 설치와 게시판 만들기 |간략개요| 그누보드의 기능과 설치 과정 알아보기 |간단실습| 그누보드 다운로드 받아 웹 계정에 설치하기 |간단실습| 그룹 생성하고 게시판 추가하기 UNIT 03 그누보드에 디자인 적용 및 아이프레임으로 연결하기 |간략개요| 그누보드 게시판의 관리 항목 및 디자인의 변경 과정 알아보기 |간단실습| 그누보드 게시판을 중심으로 삽?되는 상단 파일과 하단 파일 만들기 |간단실습| 노프레임 상태로 그누보드 게시판 꾸미기 |간단실습| 그누보드 게시판을 아이프레임 구조에서 연결하기 UNIT 04 고도몰 솔루션을 이용한 쇼핑몰 사이트 만들기(1) |간략개요| 쇼핑몰 솔루션의 종류와 제작 과정 이해하기 |간단실습| 고도몰 e나무 쇼핑몰 신청하기 |간단실습| 관리자 모드의 이해와 기본 정보, 스킨 설정하기 |TIP| CUSTOMER CENTER에 표시된 텍스트 확인하기 |TIP| 스킨 복사하기 |간단실습| 로고와 배너 이미지 변경하기 |간단실습| 쇼핑몰 메인 페이지의 로고 위치 조정하기 |간단실습| 드림위버에서 제작한 문서로 회사 소개 페이지 변경하기 |POWER UNIT| 공사중 페이지 등록하기 UNIT 05 고도몰 솔루션을 이용한 쇼핑몰 사이트 만들기(2) |간략개요| 상품 등록과 진열 과정 알아보기 |간단실습| 카테고리 생성과 상품 등록하기 |TIP| 카테고리 순서 변경하기 |간단실습| 메인 페이지에 상품 진열하기 |간단실습| 팝업 창 관리하기 |간단실습| 새 페이지 만들어 메인 이미지 배너와 연결하기 |POWER UNIT| 상품 주문 과정 확인하기 CHAPTER PLUS 02 웹 표준 문서 제작과 CSS 레이아웃, XHTML, HTML5 구현하기 (e-book) UNIT 01 웹 표준 문서를 위한 드림위버의 기능 살펴보기 UNIT 02 CSS 레이아웃 구현하기(1) UNIT 03 CSS 레이아웃 구현하기(2) UNIT 04 HTML5와 CSS 문서 만들기