백견불여일타 HTML5 & CSS3 (최신 플렉스박스 완벽 정리, 프로젝트 3개 수록 | 예제부터 만들어보고, 연습문제로 복습, 실습문제로 응용력 향상)

양용석

대기업부터벤처기업까지다양한직장경험을바탕으로,지금은프리랜서로활동중에있으며,웹사이트기획,디자인및개발을주로하고있다.
<처음부터다시배우는HTML5&CSS3>,<이제실전이다,HTML5&CSS3>,<처음시작하는CSS&워드프레스>,<부트스트랩으로디자인하라>,<CSS수퍼파워Sass로디자인하라>를집필하였다.
현재제주에서재미있게살아가려고노력하고있다.

1장백견불여일타!HTML5와CSS3로기본웹사이트만들기
1.1HTML5+CSS3기초개념
1.2우리가만들웹사이트로보는HTML5문서구조
1.3헤더만들기-HTML5로구조만들기
1.4헤더만들기-CSS3와자바스크립트로디자인스타일정의하기
1.5헤더만들기-CSS로디자인입히기
1.6헤더만들기-디자인속성적용하기
1.7메인이미지만들기-대표이미지로메인만들기
1.8헤더와메인이미지영역크기맞추기-box-sizing속성적용하기
1.9본문1만들기-텍스트및사진처리하기
1.10본문2만들기-텍스트및아이콘넣기
1.11푸터만들기
[연습문제]
[실습문제]개발환경을만들고익숙해지기

2장HTML5의기초
2.1DocType
2.2XHTML1.0과HTML5의차이점
2.3HTML5에서사라진태그
2.4HTML5에서추가된태그
2.5HTML5멀티미디어태그
2.6canvas와SVG
2.7HTML5에서추가된form관련태그들
[연습문제]
[실습문제]HTML5문서구성및form작성실습

3장CSS3기초
3.1선택자
3.2선택자적용방법
3.3개별선택자의활용
3.4박스모델
[연습문제]
[실습문제]속성적용과웹페이지디자인실습

4장박스모델의레이아웃을결정하는float,position,그리고flexbox
4.1float속성
4.2position속성
4.3flexbox
[연습문제]
[실습문제]블로그형식의웹페이지디자인실습

5장CSS를이용한텍스트와문장구성
5.1텍스트와폰트
5.2웹폰트
5.3text-shadow와멀티컬럼
5.4웹컬러
5.5텍스트와문장구성관련속성
[연습문제]
[실습문제]웹페이지에텍스트와문장구성실습

6장CSS3를이용한특수효과
6.1트랜지션효과
6.22DTransform
6.33DTransform
6.4애니메이션
[연습문제]
[실습문제]특수효과가적용된메뉴만들기

7장반응형웹디자인과그리드시스템
7.1반응형웹디자인
7.2그리드시스템
[연습문제]
[실습문제]반응형웹디자인실습

8장필요한만큼배워보는자바스크립트
8.1HTML문서와상호작용하는자바스크립트
8.2자바스크립트주요문법
[연습문제]
[실습문제]기초문법을적용한자바스크립트프로그램문제

9장HTML5의API
9.1API기초개념
9.2드래그앤드롭
9.3지오로케이션
9.4웹스토리지
9.5앱캐시
9.6웹워커
[연습문제]

10장이것이실제다!상용웹사이트만들기
10.1싱글페이지기반의웹사이트제작하기
10.2내비게이션만들기
10.3프론트페이지만들기
10.4추가메뉴페이지만들기
10.5입력폼이있는[고객센터]페이지만들기
10.6푸터페이지만들기
10.7반응형웹페이지로제작하기
10.8멀티페이지기반의웹사이트만들기

부록AHTML5와CSS3호환성문제해결방법
부록BPC에웹서버설치하기
찾아보기

이책은HTML태그가무엇인지는설명하지않는다.하지만,예제를따라하다보면자연스레HTML태그는쉽게익힐수있도록구성하였다.프로젝트가1장부터나오기때문에약간은도전적이지만,누구나따라하며HTML5와CSS3디자인의개념을빠르게익힐수있도록학습효과를극대화하였다.

앞뒤로프로젝트가3개,반복하며실력을쌓는다!
레이아웃마법사최신플렉스박스완벽정리
이책은완성된수준의웹사이트를먼저만들어보는것부터시작한다.닥치고사이트부터만들어본다.무작정따라가다보면HTML과CSS의큰그림이그려진다.이후에기초지식을정리하고각장마다연습문제와실습문제를두어개념을정리하고복습하며응용력을높이도록하였다.마지막에한번더프로젝트를추가하여학습한지식이빠져나갈수없도록촘촘하게구성하였다.

나도프로처럼디자인하고싶다!따라하다보면저절로몸에붙는
현장의생생함이살아있는프로젝트3개수록!

_프로젝트하나,기본적인웹사이트
1장에서가장기본적인웹사이트를만들어본다.메뉴,텍스트및그림의배치,백그라운드처리등웹디자인에필요한기술이거의모두들어가있다.
_프로젝트둘,싱글페이지기반의웹사이트
10장에서는요즘유행하는싱글페이지기반의웹사이트를만들어본다.이책에서다루는거의모든기술이들어가있다.바로홍보용이나포트폴리오웹사이트로사용해도될수준이다.
_프로젝트셋,멀티페이지기반의웹사이트
역시10장에서다룬다.쇼핑몰이나기업형웹사이트와같이멀티페이지기반의웹사이트를만들어본다.페이지를PHP기반으로분리하는기술등을사용하며서버기반으로동작하는방법까지배운다.

함께공부할수있는백견불여일타카페!cafe.naver.com/codefirst
백견불여일타독자라면누구나가입하여질문하고정보를공유하며스터디그룹을만들어함께공부할수있는공간이다.

“이책은독특하게1장에서프로젝트가등장하였습니다.처음에는적잖이당황하였는데,하나하나타이핑해보면서프로젝트를완성해보니CSS로디자인을이렇게하는구나하고감이팍오는것이었습니다.학습동기가생기니뒷장부터는정말몰입하며학습하게되었습니다.”
_베타리더김용희(대학생3학년)

“양용석저자는제가웹디자인을쉽게배울수있게해주신분입니다.이책으로시작해서Sass와부트스트랩까지섭렵한다면현업디자이너로충분히경쟁력을가질만합니다.”
_베타리더이용수(프론트엔드디자이너5년차)

_편집자코멘트
많은책들이HelloWorld수준의예제로시작합니다.예제프로그램이동작하는순간의기쁨은찰나이며,그다음은문법을이론으로배우는지루한설명이이어집니다.이것이우리가보는전형적인IT책의패턴입니다.이런패턴은많은독자를중도에포기하게만듭니다.독자가끝까지학습하여완주할수있게하는힘이어디에서나올까고민에고민을거듭하였습니다.그래서과감하게처음부터조금강도가높은예제를넣기로하되,하나하나따라하며완성할수있게끔최대한쉽고자세하게구성했습니다.1장에서사용한예제는현업에서간단한홍보용홈페이지로사용해도손색이없습니다.이책에서배울거의모든문법들이1장의예제에들어가있습니다.독자들은코드를하나하나타이핑하고실행해보고소스한줄한줄의결과를확인해보며전체적인큰그림을그려나갈수있을겁니다.