HTML5 & CSS3 실무테크닉

Part 01. HTML5의 개요
HTML5의 발자취
HTML4와 HTML5의 차이
- DOCTYPE의 사용과 문자 인코딩
- 태그와 속성 변화

Part 02. HTML5 디자인
기본 구조
- 템플릿 작성하기
- 구조 태그 분석
CSS를 이용하여 디자인하기
- 선택자
- CSS attributes
폼
- 폼 예제 작성하기
- Input 요소
캔버스
- 캔버스 예제 작성하기
비디오&오디오

Part 03. HTML5 API
드래그 앤 드롭
오프라인 웹 애플리케이션
- 오프라인 환경에 대비한 캐시의 사용
- 캐시된 파일의 업데이트
- 메니페스트 파일의 작성 방법
- 애플리케이션 캐시 API [FF, SF, OP, CR]
웹 스토리지
- 로컬 스토리지 객체의 사용 [IE, FF, SF, OP, CR]
- JSON 데이터의 처리 [IE, FF, SF, OP, CR]
- seessionStorage 객체의 사용 [IE, FF, SF, OP, CR]
- 웹 브라우저에서 웹 스토리지 관리하기 [SF, OP, CR]
웹 데이터베이스
- 웹 SQL 데이터베이스 생성 [SF, CR, OP]
- 웹 SQL 데이터베이스 레코드 처리 [SF, CR, OP]
- 웹 SQL 데이터베이스의 버전 관리 [SF, CR, OP]
- 동기식 웹 SQL 데이터베이스 사용 [SF, CR, OP]
- 인덱스드 데이터베이스 사용 [FF, CR]
웹 메시징
- 도큐멘트 간 메시지 교환 [IE, FF, SF, OP, CR]
- 메시지 채널의 사용 [SF, OP, CR]
- 메시지 포트의 전달 [SF, OP, CR]
- 우편 번호 검색 웹 라이브러리 골격 [SF, OP, CR]
서버 전송 이벤트
- 서버 전송 이벤트의 메시지 출력
- 서버 전송 이벤트를 사용한 주식 상황
웹 워커
- 웹 워커를 사용한 소수 검사 [FF, SF, CR, CP]
- 포그라운드 대 백그라운드 처리 [FF, SF, CR, OP]
- 전용 워커 대 공용 워커 [SF, CR, OP]
- 공용 워커를 이용한 메시지 교환 [SF, CR, OP]
- 공용 워커를 이용한 서버 전송 이벤트 처리 [SF, CR]
웹 소켓
- 웹 소켓을 이용한 메시지 에코 [FF, CR]
- 웹 소켓 프로토콜
- 웹 소켓을 이용한 채팅 [FF, CR]
위치 정보 API
- 사용자 위치 정보의 출력 [FF, CR, OP]
- 위치 정보를 이용한 구글맵 [FF, CR, OP]
- 위치 정보를 이용한 네이버맵 [FF, CR, OP]
- 사용자 위치 추적 [FF, CR, OP]
기타 API
- 파일 처리 [FF, CR]
- XMLHttpRequest Level2를 이용한 크로스 도메인 요청 [CR]
- XMLHttpRequest Level2를 이용한 폼 데이터 전송 [FF, SF, CR]
- 통지(Notification) [CR]

Part 04. HTML5 게임
세나 게임
- 게임의 상태
- 게임의 시작
- 게임 루프 run 함수
- 게임 이미지의 자료 구조
- 변수들의 초기화
- 화면 갱신 함수 update
- 화면 그리기 함수 draw
세나 게임 확장
- 오프라인 기법이 적용된 게임으로 확장
- WebSQL API를 사용한 점수 관리 게임으로 확장
- WebSocket API를 이용한 경쟁 게임으로 확장