1장
HTML은 혹독한 성장기를 거쳤습니다. 미미한 마크업 언어로 출발했지만, 최근 HTML은 중요한 존재로 거듭났습니다. 이제 우리는 로컬 저장소, 2D 그래픽, 오프라인 지원, 소켓, 스레드 등을 이용해서 진정한 웹 애플리케이션을 만드는 데 최적화된 언어를 갖게 되었습니다. 항상 좋은 일만 있었던 것은 아니었지만, HTML의 과거는 한편의 드라마였습니다(그 이유는 곧 알게 될 거예요). 이 장에서는 ‘HTML5’에 관한 모든 것에 감을 잡기 위해 웹마을로 여행을 떠날 것입니다. 3.8 페이지만 읽으면 HTML5의 초보딱지를 뗄 수 있어요.

2장
자바스크립트가 여러분을 새로운 곳으로 안내할 것입니다. 여러분은 이미 HTML 마크업(구조)과 CSS 스타일(프리젠테이션)의 모든 것을 알고 있습니다. 하지만 자바스크립트(동작)가 빠졌네요. 여러분이 구조와 프리젠테이션의 모든 것을 알고 있다면(물론 그렇다고 확신합니다) 멋진 페이지를 만들 수 있겠지만, 이걸로는 단지 페이지만 만들 수 있을 뿐입니다. 자바스크립트를 이용해서 동작을 추가하면 상호작용하는 페이지뿐만 아니라 완벽한 웹 애플리케이션까지 만들 수 있습니다. 여러분의 웹 툴킷에서 가장 흥미롭고 융통성 있는 기능을 추가할 준비가 되었나요? 자바스크립트와 프로그래밍 세계에 빠져 봅시다!

3장
여러분은 아직 사용자와 접촉하지 않았습니다. 여러분은 자바스크립트의 기초를 배웠지만 이를 바탕으로 사용자와 상호작용할 수 있을까요? 페이지가 사용자의 입력에 반응할 때, 페이지는 더 이상 문서가 아니라 살아 있는 존재가 되며, 애플리케이션으로 거듭납니다. 이 장에서 여러분은 사용자가 입력한 폼을 처리하고 구식 HTML 「form」 요소를 실제 코드로 연결하는 법을 배울 것입니다. 약간 위험하면서도 강력한 기능이죠. 안전벨트를 단단히 매세요. 이 장은 전개가 빠릅니다. 백지상태에서 상호작용하는 애플리케이션까지 핵심만 골라 쏜살같이 달려갈 거예요.

4장
여러분 자신을 스크립트 작성자라고 부를 수 있나요? 그럴지도 모르죠. 여러분은 이미 자바스크립트를 잘 알고 있습니다. 프로그래머가 될 수 있는데도 굳이 스크립트 작성자가 되길 원하는 사람은 아무도 없을 겁니다. 이제는 진지하게 심혈을 기울여야 할 시간이 왔습니다. 바로 함수와 객체를 배울 때가 된 거죠. 함수와 객체는 좀 더 강력하고 구조적이며 관리가 수월한 코드를 작성하는 데 핵심적인 존재입니다. 또한 HTML5 자바스크립트 API에서도 두루두루 사용되고 있습니다. 함수와 객체의 이해도가 증가할수록 좀 더 빨리 새로운 API로 건너가서 이들을 정복할 수 있습니다. 이 장에 발을 들여놓은 이상, 혼신을 다해 파고들어야 할 겁니다.

5장
어디를 가더라도 그곳에는 여러분이 있습니다. 때로는 자신의 위치를 파악하는 것이 큰 차이를 만들어 냅니다. 특히 웹 애플리케이션에서는 더 그렇습니다. 이 장에서는 위치를 인식하는 웹 페이지를 생성하는 방법을 소개할 것입니다. 때로는 사용자들이 서 있는 곳을 모퉁이까지 정확히 짚어낼 수도 있고, 때로는 사용자들이 있는 지역이 어딘지 결정할 수 있을 겁니다(물론 어느 도시인지도 알 수 있습니다!). 하지만 기술적인 문제 때문에 또는 사용자들은 일일이 꼬치꼬치 캐묻는 것을 싫어하기 때문에 사용자들의 위치에 관해 결정하지 못하는 것이 있을 수도 있습니다. 어쨌든 이 장에서는 자바스크립트 API인 지오로케이션을 탐색해 볼 겁니다. 여러분이 가진 위치추적 장치(데스크톱 PC도 상관없습니다)를 가지고 시작해 봅시다.

6장
지금까지 페이지에만 너무 오래 머물러 있었습니다. 이제 자리에서 일어나 웹 서비스와 대화를 하고, 데이터를 가져와서, 이 모든 데이터를 섞어 더 나은 경험을 창출할 때가 되었습니다. 이 정도는 되어야 최신식 HTML5 애플리케이션이라고 할 수 있습니다. 하지만 그러기 위해서는 먼저 웹 서비스와 대화하는 방법을 알아야 합니다. 이를 위해 이 장에서는 실제 운영 중인 웹 서비스에서 데이터를 끌어와서 여러분의 페이지에 추가할 것입니다. 일단 대화하는 방법을 터득하면 여러분은 어떤 웹 서비스에도 다가갈 수 있을 것입니다. 웹 서비스와 대화할 때 사용해야 하는 최신식의 새로운 전문용어로 여러분을 무장시켜 드리죠. 자, 어서 따라오세요. 몇 가지 API를 더 배울 것입니다.

7장
HTML이 ‘마크업’ 언어에서 해방됐습니다. 이제 여러분은 HTML5에서 새로 선보인 canvas 요소로 직접 픽셀을 만들어 조작하고 파괴할 수 있는 힘을 갖게 되었습니다. 이 장에서는 canvas 요소를 사용해서 여러분 내면 깊은 곳에 있는 예술가적 기질을 끌어내 것입니다. HTML은 구조만 있을 뿐 프레젠테이션은 없다는 말은 더 이상 통하지 않습니다. 캔버스로 그림도 그리고 색도 칠할 수 있습니다. 이제는 프레젠테이션이 대세입니다. 페이지에 canvas 요소를 추가하는 방법, 텍스트나 그림을 그리는 방법(물론 자바스크립트를 사용해서), 심지어 브라우저에서 canvas 요소를 지원하지 않는 경우에도 이를 처리하는 방법도 살펴볼 것입니다. 캔버스는 히트곡이 하나뿐인 가수가 아닙니다. 앞으로 다른 장에서도 많이 등장할 겁니다.

8장
플러그인은 필요 없습니다. 비디오가 HTML 가족의 최고 구성원이 되어, 이제 페이지에 video 요소를 던져 넣기만 하면 거의 모든 장치에서 바로 비디오를 볼 수 있습니다. 하지만 비디오는 그저 단순한 요소가 아닙니다. 비디오 재생을 제어하고, 여러분만의 사용자 정의 비디오 인터페이스를 생성해서 완전히 새로운 방식으로 HTML 요소들과 통합할 수 있는 자바스크립트 API이기도 합니다. 통합에 관해서 말인데요… 이전에 비디오와 캔버스의 관계에 관해서 얘기했었죠? 이 장에서는 비디오와 캔버스가 협력해서 강력하고 새로운 방법을 통해 실시간으로 비디오를 처리하는 방법을 보게 될 겁니다. 또한 비디오를 페이지로 가져와서 재생하는 자바스크립트 API의 역량을 시험해 볼 것입니다. 어서 오세요. 약간의 마크업과, 자바스크립트, 비디오와 캔버스를 사용해서 할 수 있는 일이 무엇인지 알게 되면 깜짝 놀랄 겁니다.

9장
클라이언트 데이터를 조그마한 옷장 쿠키에 밀어 넣는 것에 지쳐버렸나요? 90년대에는 문제가 없었지만, 요즘 웹 애플리케이션은 훨씬 더 큰 용량을 필요로 하고 있습니다. 매일 모든 사용자의 브라우저에서 5메가바이트의 데이터를 받아야 한다면 어떨까요? HTML5 웹 저장소 API가 해결해 줄 겁니다! 마치 사기 치는 것처럼 들릴 수도 있겠지만, 의심할 필요는 없습니다. 이 장에서는 사용자들의 장치에 모든 객체를 저장하고 여러분의 웹 경험에서 활용하는 데 필요한 모든 것을 여러분 앞에 대령하겠습니다.

10장
브라우저가 느려졌는데도 계속 실행하고 싶나요? 웹을 검색하거나 자바스크립트와 함께 충분한 시간을 보내지 못했다면, 아마도 ‘slow script(느려진 스크립트)’라는 메시지를 본 적이 있을 것입니다. 멀티코어 프로세서가 장착된 최신 컴퓨터에서 어떻게 스크립트가 현저하게 느려진 것일까요? 그 이유는 자바스크립트는 한 번에 오직 한 가지 일만 할 수 있기 때문입니다. 하지만 HTML5, 웹 워커와 함께라면 상황이 돌변합니다. 이제 더 많은 일을 처리하기 위해 여러분 자신만의 자바스크립트 일꾼을 갖출 수 있게 되었습니다. 좀 더 즉각적으로 반응하는 애플리케이션을 설계하고 싶거나 컴퓨터 CPU의 능력을 최대로 끌어올리고 싶다면 웹 워커가 도와줄 것입니다. 이제 자바스크립트 관리자가 되어 웹 워커가 도움이 될 겁니다.