30개의 레슨으로 마스터하는 HTML5와 CSS3

최근 몇 년 사이에 HTML5 & CSS3이 표준이 되고 멀티 디바이스 대응이 당연하게 되는 등 웹 제작을 둘러싼 환경이 크게 바뀜에 따라 웹 제작 현장에서 요구되는 스킬도 고도화되고 복잡화되었다. 이 책은 30개의 레슨을 통해 모든 웹 제작의 토대가 되는 HTML5과 CSS3의 지식과 기술을 기초부터 확실히 알 수 있도록 설명하고 있다. 각 레슨은 개념이나 규칙을 설명하는 ‘강의’와 실제로 샘플 파일을 제작해 보는 ‘실습’ 두 파트로 구성되어 있어 개념을 익히고 직접 실습을 하며 HTML과 CSS를 쉽게 배울 수 있다. 최첨단 환경뿐만 아니라 과거의 환경이나 기술(HTML5 이전의 마크업 규격 등)도 함께 다루어 HTML과 CSS의 기본적인 기술과 노하우를 익힐 수 있으며, 실무에서 반드시 필요한 기술적인 제약이나 환경에 따른 차이 등에 대한 정보를 다루어 실제 제작 현장에서 바로 적용할 수 있다.

Chapter 01 HTML로 문서 작성하기
LESSON01 HTML의 개요
LESSON02 문서를 HTML로 마크업하기
LESSON03 줄 바꾸기와 강조, 이미지, 링크 넣기
LESSON04 표와 폼 설치하기
보강 〈문법 체크하기〉
보강 〈DOCTYPE을 HTML4.01/XHTML1.0으로 할 경우 주의할 점〉

Chapter 02 CSS로 문서 장식하기
LESSON05 CSS의 개요
LESSON06 기본 프로퍼티와 선택자 사용법
LESSON07 배경 이미지로 장식하기
LESSON08 기본적인 문서 레이아웃과 박스 모델
LESSON09 표와 입력 폼의 스타일링

Chapter 03 CSS 레이아웃의 기본
LESSON10 레이아웃의 종류
LESSON11 float 레이아웃
LESSON12 position 레이아웃
보강 〈새로운 레이아웃 기법〉

Chapter 04 HTML5로 마크업을 하기 위한 기초 지식
LESSON13 섹션 관련 새 요소
LESSON14 새로운 카테고리와 콘텐츠 모델
LESSON15 기타 새로운 요소와 속성
보강 〈HTML5의 전체 사양과 구현상의 주의할 점〉

Chapter 05 본격적인 웹 제작을 위한 설계와 준비
LESSON16 웹사이트의 코딩 설계
LESSON17 효율적인 CSS 코딩 준비

Chapter 06 실천적인 웹사이트 코딩
LESSON18 큰 테두리의 레이아웃 포맷 작성하기
LESSON19 display 프로퍼티를 활용한 레이아웃
LESSON20 CSS 스프라이트의 구조를 이해한다
LESSON21 메인 콘텐츠 영역을 작성한다

Chapter 07 CSS3 입문
LESSON22 CSS3의 개요
LESSON23 CSS3 선택자
LESSON24 CSS3 프로퍼티
LESSON25 변형·애니메이션과 미디어 쿼리

Chapter 08 멀티 디바이스 대응의 기초 지식
LESSON26 디바이스의 특성 이해하기
LESSON27 모바일 대응 웹사이트 제작의 기초 지식

Chapter 09 반응형 웹 디자인의 코딩
LESSON28 반응형 화면 설계와 베이스 코딩
LESSON29 미디어 쿼리를 사용한 레이아웃 조정
LESSON30 Retina 디스플레이 대책
보강 〈반응형 관련 각종 팁〉

웹사이트 제작 스킬을 처음부터 차근차근 배우고 싶은 사람, 앞으로 웹 제작을 목표로 배우고자 하는 사람, 그리고 이미 웹 제작을 하고 있으나 실무에 활용할 수 있는 제대로 된 지식과 기술을 기초부터 확실히 배우고 싶은 사람들을 위한 기본서!

총 9개의 챕터, 30개의 강의를 통해 HTML과 CSS의 기본기를 확실하게 배우고 웹 사이트 디자인을 직접 따라하며 실무에 바로 적용할 수 있는 노하우를 단번에 익힌다!

Chapter 01 HTML로 문서 작성하기
HTML의 기본 구조를 이해하고 HTML을 제대로 사용할 수 있도록 전반적인 기본 규칙에 대해 알아봅니다. HTML은 어렵지 않지만 그렇다고 해서 되는 대로 쓰는 것이 아니라 HTML이 갖고 있는 역할을 분명히 인식하면서 써야 합니다. 여기서는 간단한 샘플 문서를 HTML화 해가면서 HTML의 기본 내용을 살펴봅니다.

Chapter 02 CSS로 문서 장식하기
CSS의 기본 서식, 선택자, 프로퍼티, 박스 모델 등 CSS를 이용하는 데 반드시 마스터해 두어야 할 사항을 알아봅니다. 또한 색상이나 여백, 글꼴 설정 등 흔히 사용하는 문서 장식을 직접 따라하면서 기본적인 CSS 프로퍼티 연습을 할 수 있습니다.

Chapter 03 CSS 레이아웃의 기본
웹사이트의 레이아웃은 그 용도나 목적에 따라 다양한 기법이 있습니다. 여기서는 다양한 레이아웃 기법의 특징과 용도를 소개하면서 베이스가 되는 ‘float 프로퍼티’와 ‘position 프로퍼티’를 사용한 레이아웃의 제작 방법을 알아봅니다.

Chapter 04 HTML5로 마크업을 하기 위한 기초 지식
챕터 4에서는 보다 본격적으로 HTML5 마크업을 하는 데 필요한 새로운 요소와 속성 사용법, 그리고 새로운 개념과 규칙에 대해 알아봅니다.

Chapter 05 본격적인 웹 제작을 위한 설계와 준비
HTML·CSS의 기초를 공부한 초보자가 막상 본격적인 웹사이트를 만들려고 했을 때 실제로 어디서부터 손을 대야 할지 당황할 수 있습니다. 또한 생각대로 잘 컨트롤하지 못하는 경우도 흔히 있습니다. 이 장에서는 실무적인 내용의 웹사이트를 제작하는데 미리 알아 두는 것이 좋은 지식이나 노하우, 효율적으로 코딩을 진행하기 위한 사전 준비에 대해 알아봅니다.

Chapter 06 실천적인 웹사이트 코딩
챕터 06에서는 앞에서 확인한 코딩 설계도를 기초로 하여 간단한 기업 웹사이트를 코딩하는 법을 배웁니다. 여기서는 어떤 사이트를 코딩하는 경우에도 도움이 되는 기본적인 지식이나 테크닉을 배울 수 있습니다.

Chapter 07 CSS3 입문
CSS3에서는 둥근 모서리나 드롭 섀도우뿐만 아니라 디자인 표현을 자유롭게 할 수 있는 다양한 프로퍼티와 선택자 등의 기능이 다수 갖춰 있습니다. 특히 최근 웹 제작에서 거의 필수적인 멀티 디바이스 대응을 할 때에는 CSS3가 상당히 중요한 역할을 하고 있습니다. 이 장에서는 이용 빈도가 높고 즉시 사용할 수 있는 것을 중심으로 CSS3의 선택자와 프로퍼티 기능을 알려 줍니다. 또한 실무에 CSS3를 이용하는 데 주의해야 할 점에 대해서도 배울 수 있습니다.

Chapter 08 멀티 디바이스 대응의 기초 지식
챕터 08에서는 스마트폰이나 태블릿용 웹사이트를 제작할 때 필요한 디바이스의 특성과 주의할 점을 살펴봅니다.

Chapter 09 반응형 웹 디자인의 코딩
반응형 코딩을 하려면 HTML이나 CSS, 멀티 디바이스 대응 지식을 종합적으로 활용해야 합니다. 이 장에서는 기본적인 반응형 코딩에 대해 살펴보겠습니다.