한빛미디어

2011년 이후 개정 3판으로 출간된 모던 웹을 위한 HTML5 + CSS3 바이블

이번 개정판에서는 더이상 서비스 되지 않는 구버전의 내용을 덜어내고, HTML5와 CSS3를 처음 공부하는 분을 위한 내용이 많이 추가되었다고 한다. 예제에 쓰인 개발도구도 무거운 Microsoft의 Visual Studio가 아닌 가벼운 Visual Studio Code를 사용한다. (최근 많은 개발자들이 사용하고 있다.)

​웹개발 학습서 답게 책 서두에 20일에 끝내는 학습 계획표도 있으니 단기간에 습득을 하려는 독자들은 참고하면 좋을 것 같다. 이 책과 함께 공부하기 위해서 컴퓨터에 크롭(CHROME) 웹 브라우저와 개발도구인 Visual Studio Code를 설치하자.

1장에서는 TIP을 통해 Visual Studio Code 사용법 또는 팁이 설명되어 있으니 참고하면 좋을 것이다.

​2장에서는 HTML5의 태그(Tag) 기본에 대해 설명한다.

HTML5 기본 구조부터 학습을 하고, 웹페이지를 만들때 사용하는 기본 태그들을 학습할 수 있다.

많은 태그와 속성을 기억할 필요는 없지만 자주 코드를 작성하다 보면 저절로 익혀질 것이다. 하지만 반대로 가끔 코드를 작성한다면 금새 잊어버리고 코드 작성할때마다 태그를 찾아 참조해야 할 것이다.

​3장에서는 CSS3 선택자(Selector) 기본에 대해 설명한다.

우선 선택자에 답이 없다라고 저자는 얘기한다. 그만큼 HTML 요소를 선택하는데 다양한 요소가 있다는 얘기다. 많은 선택자가 있는데, 다 기억하기는 힘들고 개발시 참고할때 W3C의 공식문서를 참조하면 된다.

http://www.w3.org/TR/CSS/

이번 챕터를 통해 JQuery형태로 스타일시트를 구현할 수 있는 것도 처음 알게 되었다.

​

4장에서는 CSS3 스타일 속성 기본에 대해 설명한다.

스타일 속성은 너무 많아, 자주 사용하지 않는 것도 있다.

혹시 필요할 땐 W3School 사이트를 참조한다. (http://w3school.com)

개인적으로 스타일 속성 작성 시 단위를 혼용해서 써서 디버깅시 애를 먹은 적이 있었다. 이번 기회에 속성 단위를 잘 살펴보고 이전과 같은 실수를 안하도록 해야겠다.

​

PART 2에서는 HTML5 + CSS3를 사용하여 레이아웃을 구성하는 내용을 다루고 있다.

5장에서는 웹페이지 레이아웃, 6장에서는 스마트폰 레이아웃, 7장에서는 태블릿PC 레이아웃에 대해 설명한다. 예전과 달리 다양한 기기와 다양한 디스플레이가 나와 있기 때문에, 각 디스플레이 환경에 맞게 레이아웃을 구성하는 것이 중요하겠다.

예전에는 table 태그를 사용하여 레이아웃을 잡는 경우를 많이 경험했었다. 개인적으로도 그런 구성에 많이 익숙했었다. 하지만 그렇게 구성하면 이후 변경하려고 할 때 페이지 전체를 들어내야 하는 엄청난 후폭풍을 겪어야 했다. 그런데 이제는 HTML5의 header, div, nav, footer 등의 태그를 이용하여 레이아웃을 잡으면 나중에 업데이트에도 편하게 되었다.

PART3에서는 HTML5+CSS3 심화 내용을 다루고 있다.

9장에서는 CSS3의 변형을 통해 애니메이션 효과를 구현하는 방법을 알아보고,

10장에서는 CSS3 변환을 통한 2차원, 3차원 변환에 대해 설명하고 있다.

11장에서는 CSS 추가 규칙과 반응형 웹에 대해 설명하고 있고, 12장에서는 그리드 시스템에 대해 설명하고 있다.

PART3에서 설명하는 내용들이 요즘 웹페이지들이 사용하고 있는 기술이다.

예제 코드를 작성하여 실행해보니 아 이렇게 구현되는구나 하고 웹페이지의 비밀을 알게 되었다.

​

이 책의 예제로 나와있는 코드들은 한빛미디어 홈페이지에서 다운로드 받을 수 있고,

http://www.hanbit.co.kr/src/10158

​유튜브에는 저자의 강의를 볼 수 있는 채널이 개설되어 있다.

http://youtube.com/c/윤인성

저자의 동영상 강의가 많아서 해당 강의만 들어가려면 아래 링크를 참조하자.

https://www.youtube.com/watch?v=XMipmINnMwI&list=PLBXuLgInP-5kgzJZRGhpHZINPu-K90jbM&index=2

​궁금한 사항이 있으면 저자의 유튜브 채널에 방문하여 댓글로 질문을 남기면 저자가 친절히 답변해 줄 것이다.

​개인적으로 예전 HTML 코드에 익숙해있어서 HTML5와 CSS3로 할 수 있는 것이 너무나 많다는 것에 감탄을 연발했다. 예전에는 이미지나 스크립트 언어로 구현했던 기능들을 이제는 간단하게 HTML5와 CSS3로 구현할 수 있으니 말이다. HTML과 CSS도 발전했지만 웹브라우저도 함께 발전되어 왔기 때문에 가능한 것이 아닌가 생각한다. 이제는 틈틈이 시간을 내어 다양한 웹페이지를 구현하면서 다양한 태그와 속성들을 익히도록 노력해야겠다.

​한빛출판사의 나는 리뷰어다 활동을 통해 도서를 제공받아 작성한 리뷰입니다

#모던웹을위한HTML5CSS3바이블3판 #HTML5 #CSS3 #모던웹 #웹개발 #한빛미디어 #나는리뷰어다