도서 소개
웹 프로그래머와 디자이너가 실제로 사이트를 제작하면서 궁금해 하거나 참고할 수 있는 HTML5와 CSS3와 관련된 내용을 기본 뼈대로 삼는다. 이제 막 초보 딱지를 떼고 HTML과 CSS에 대한 개념을 익힌 프로그래머뿐 아니라 HTML5와 CSS3의 최신 기술을 직접 확인해보고 싶은 중급 프로그래머에게 이 책의 군더더기 없는 설명이 도움될 것이다.
이 책에서는 'HTML5 헤럴드'라는 구식 신문(www.thehtml5herald.com에 실제로 구현돼 있다) 웹 사이트를 HTML5와 CSS3의 새로운 기술을 이용해 실제로 하나씩 만들어 가는 식으로 구성돼 있으며, 새로운 기술을 설명할 때마다 다양한 브라우저에서의 지원 여부와 하위호환성에 대한 상세한 설명을 덧붙여 프로그래머가 새로운 기술을 자유롭게 적용할 수 있게 배려한다.
HTML5와 CSS3의 새로운 기능 외에도 Modernizr, WAI-ARAI 및 마이크로데이터와 같이 HTML5와 함께 쓰이는 필수 기술은 부록에서 자세히 다루고 있으며, 새로운 기능에 대해 좀 더 심도 있게 살펴보고 싶은 독자를 위해 꼼꼼하게 준비한 참고자료도 제공한다.
출판사 리뷰
HTML5 & CSS3, 이제는 실전이다!
책 제목인 『HTML5 & CSS3 실전에서는 이렇게 쓴다!』에서 느낄 수 있듯이 이 책은 웹 프로그래머와 디자이너가 실제로 사이트를 제작하면서 궁금해 하거나 참고할 수 있는 HTML5와 CSS3와 관련된 내용을 기본 뼈대로 삼는다. 이제 막 초보 딱지를 떼고 HTML과 CSS에 대한 개념을 익힌 프로그래머뿐 아니라 HTML5와 CSS3의 최신 기술을 직접 확인해보고 싶은 중급 프로그래머에게 이 책의 군더더기 없는 설명이 도움될 것이다.
이 책에서는 'HTML5 헤럴드'라는 구식 신문(www.thehtml5herald.com에 실제로 구현돼 있다) 웹 사이트를 HTML5와 CSS3의 새로운 기술을 이용해 실제로 하나씩 만들어 가는 식으로 구성돼 있으며, 새로운 기술을 설명할 때마다 다양한 브라우저에서의 지원 여부와 하위호환성에 대한 상세한 설명을 덧붙여 프로그래머가 새로운 기술을 자유롭게 적용할 수 있게 배려한다.
HTML5와 CSS3의 새로운 기능 외에도 Modernizr, WAI-ARAI 및 마이크로데이터와 같이 HTML5와 함께 쓰이는 필수 기술은 부록에서 자세히 다루고 있으며, 새로운 기능에 대해 좀 더 심도 있게 살펴보고 싶은 독자를 위해 꼼꼼하게 준비한 참고자료도 제공한다.
[이 책의 구성]
이 책은 11개의 장과 세 개의 부록으로 구성돼 있다. 대부분의 장은 서로 이어져 있어 순서대로 읽는다면 아마 효과가 가장 크겠지만 특정 주제를 살펴볼 필요가 있다면 건너뛰면서 읽어도 무방하다.
o 1장: HTML5와 CSS3 소개
1장에서는 실습으로 들어가기에 앞서 지금부터라도 HTML5와 CSS3를 사용해야 할 몇 가지 이유와 함께 HTML5와 CSS3의 역사를 살펴본다. 또한 브라우저 지원이라는 측면에서 현재 상황을 살펴보며, 지금 바로 사용해도 좋은 새로운 기술(현명하게 이용하기만 한다면)을 논한다.
o 2장: 마크업, HTML5 스타일
2장에서는 HTML5에서 등장하는 새로운 구조적 요소 및 의미적 요소를 설명한다. 또한 이 책의 나머지 부분에 걸쳐 계속 다루게 될 'HTML5 헤럴드'라는 실습 사이트도 소개한다. div가 지루하다면? 다행히도 이제 HTML5에서는 다양한 대안을 제공한다. 바로 article, section, nav, footer, aside, header가 여기에 해당한다.
o 3장: HTML5의 의미적 표현 더 알아보기
2장에 이어 3장에서는 HTML5에서 문서의 아우트라인을 구성하는 새로운 방법을 알아본다. 그러고 나서 마크업을 좀 더 풍부하게 표현해줄 다른 의미적 요소를 살펴본다.
o 4장: HTML5 폼
HTML5에서 가장 유용하고 바로 적용할 수 있는 기능으로 폼이 있다. 현재 여러 브라우저에서는 이메일 주소나 URL과 같은 유형에 대해 내장 유효성 검사를 지원하며, 어떤 브라우저는 날짜 선택기, 슬라이더, 스피너 박스까지도 지원한다. 이러한 기능은 폼 코드 작성을 즐겁게 만들어준다! 4장에서는 HTML5 폼을 작성할 때 알아야 할 모든 사항을 다루며, 버전이 낮은 브라우저에 대비한 스크립트도 제공한다.
o 5장: HTML5 오디오와 비디오
종종 HTML5는 플래시가 차지하고 있던 온라인 멀티미디어 콘텐츠 왕좌의 대항마로 내세워지곤 한다. 새로운 audio와 video 요소가 바로 그 이유다. audio와 video 요소는 플래시와 같은 서드파티 플러그인에 의존하지 않고 스크립트로 제어 가능한 내장 미디어 플레이어를 제공한다. 5장에서는 이러한 새로운 요소의 사용과 관련된 자세한 내용을 속속들이 살펴본다.
o 6장: CSS3 소개
이제 HTML5에 관해 모두 살펴봤으므로 가까운 친척인 CSS3로 옮겨갈 차례다. 6장에서는 유례가 없을 정도의
작가 소개
저자 : 알렉시스 골드스타인
90년대 중반 고등학교 재학 시절 처음으로 HTML을 익혔다. 그녀는 여성을 위한 저비용 프로그래밍 강의를 담당하는 Girl Develop It의 강사이자 공동 조직자이며, 브룩클린에 있는 NYC Resistor hackerspace의 매우 자랑스러운 멤버이기도 하다.
저자 : 루이스 라자리스
캐나다 토론토에 살고 있으며, 2000년부터 웹 디자인 업계에 몸담고 있는 프리랜서 웹 디자이너이자 프론트 엔드 개발자다. 루이스는 테이블 레이아웃과 원-픽셀 GIF가 이 분야를 지배하던 때부터 웹 디자인 분야에 몸을 담아왔다. 루이스는 자신의 사이트인 Impressive Webs를 비롯해 최고의 웹 디자인 블로그 여러 곳에 글을 기고하고 있다.
저자 : 에스텔 웨일
1999년부터 표준 기반의 접근성 높은 웹사이트를 개발해 오고 있는 샌프란시스코의 프론트 엔드 엔지니어다. 그녀는 방문자가 수백만 명에 달하는 두 개의 기술 블로그에 글을 기고하고 있다. 그녀는 열정적으로 웹 개발에 관한 강연을 하고 있으며, 미국 내의 여러 콘퍼런스에서 CSS3, HTML5, 자바스크립트와 모바일 웹 개발을 주제로 강연하기도 한다.
목차
01장 HTML5와 CSS3 소개
HTML5란?
HTML5가 걸어온 길
- 진정한 HTML5 규격이 정해질 수 있을까?
왜 HTML5에 관심을 가져야 할까?
CSS3란?
왜 CSS3에 관심을 가져야 할까?
'실전'이란 무엇을 의미하는가?
- 다양한 브라우저 시장
- 성장하는 모바일 시장
실전 내용으로 들어가면서
02장 마크업, HTML5 스타일
HTML5 헤럴드 소개
기본 HTML5 템플릿
- 독타입
- html 요소
- head 요소
- 대등한 상황으로 만들기
- 나머지는 알고 있는 그대로다
HTML5 FAQ
- 왜 이러한 변경사항이 이전 브라우저에서도 여전히 작동하는 걸까?
- 모든 태그를 닫지 말아야 할까?
- 다른 XHTML 기반 문법 규칙은 어떨까?
페이지의 구조 정의
- header 요소
- section 요소
- article 요소
- nav 요소
- aside 요소
- footer 요소
HTML5 헤럴드 구조화
정리
03장 HTML5의 의미적 표현 더 알아보기
콘텐츠 타입의 새로운 측면
문서의 개요
뉴스 속보
- hgroup 요소
새로운 요소 더 알아보기
- figure와 figcaption 요소
- mark 요소
- progress와 meter 요소
- time 요소
기존 기능의 변화
- '폐기된'이라는 용어는 폐기됐다
- Link 내의 블록 요소
- 굵은 글씨체
- 이탤릭체
- 큰 글씨와 작은 글씨
- 기다려왔던 cite 요소
- (정의가 아닌) 설명 목록
다른 새로운 요소와 기능
- detai