첫째마당
모바일을 위한 HTML5와 CSS3 기본기 익히기

01 웹 표준, 모바일 환경의 이해
01-1 웹 표준의 기본 지식
01-2 ‘웹앱’, ‘네이티브앱’, ‘하이브리드앱’

02 작업환경 준비하기
02-1 개발 툴 준비하기
02-2 브라우저 / 에뮬레이터 / 웹서버 준비하기
02-3 Hello World 예제 만들어 보기

03 HTML5 시맨틱 마크업 이론 익히기
03-1 시맨틱 마크업 개념 알아보기
03-2 기본적인 HTML5 마크업 사용법 설명
03-3 W3C HTML 웹 표준 인증받기

04 CSS3 기본 기능 익히기
04-1. 레이아웃 작업 순서
04-2. 인라인 스타일, 내부 스타일 시트, 외부 스타일 시트 사용법
04-3. 상속의 개념 사용법

05 CSS3 고급 기능 익히기
05-1 선택자를 잘 알아야 하는 이유
05-2 태그 선택자(tag selector)
05-3 클래스 선택자(class selector)
05-4 아이디 선택자(ID Selector)
05-5 하위 선택자(Descendant Selector)
05-6 그룹 선택자(Grouping Selector)
05-7 전체 선택자(Universal Selector)
05-8 하이퍼링크 사용법 : 앵커 유사 클래스 선택자

06 CSS3 좌표계 사용법 익히기
06-1 레이아웃 위치 개념 알아보기
06-2 컨테이너 안에서 자유롭게 위치 잡기
06-3 CSS3 단위 이해하기
06-4 BOX(상자) 모델을 이용한 위치잡기

07 CSS3 레이아웃 사용법 익히기
07-1 Float 사용법
07-2 Clear 사용법
07-3 여러 개의 열 레이아웃 만들기

둘째마당
미디어쿼리와 제이쿼리 모바일로 모바일 UI 디자인하기

08 미디어쿼리로 N스크린 스타일 준비하기
08-1 원하는 글꼴을 마음껏! 웹폰트 사용하기
08-2 ‘미디어쿼리’로 디바이스 맞춤형 스타일 준비하기
08-3 실전에 ‘미디어쿼리’를 응용하기

09 스마트폰 UI 기법 익히기
09-1 모바일 UI 프레임워크
09-2 JQuery Mobile을 배워보자
09-3 JQuery Mobile로 스마트폰 UI를 시작하자
09-4 화면 구성을 위한 UI 작성하기

10 스마트폰 페이지 전환 효과 익히기
10-1 목록 만들기
10-2 다양한 페이지 링크 연결

셋째마당
실전! 직접 만드는 모바일웹 프로젝트

11 아이콘 메뉴 페이지 만들기 응용
11-1 웹앱 프로젝트 기획
11-2. 메인 페이지 만들기

12 내비게이션 메뉴 만들기 응용
12-1 툴바 기본 사용법 익히기
12-2 PhotoSwipe 사용법 익히기
12-3 캠퍼스 이미지 페이지 만들기

13 자바스크립트 기초 익히기
13-1 HTML5 시대에 떠오르는 언어 자바스크립트
13-2 자바 스크립트 언어로 프로그래밍 기초 배우기
13-3 JQuery로 최신 스타일 자바스크립트 기초 배우기

14 이미지 전환 효과 만들기
14-1 CSS3 트랜지션으로 애니메이션 효과 만들기
14-2 대학교 소개 페이지 만들기
14-3 자바스크립트 JQuery로 터치 기능의 생명 불어넣기

15 동영상 연결하기
15-1 HTML5로 동영상 연결하기
15-2 VideoJS를 이용하여 세련된 동영상 플레이어 만들기

16 지도에 내 위치 표시하기
16-1 구글 맵을 표시하기
16-2 현재 내 위치를 찾아보기
16-3 캠퍼스 맵 완성해 보기

넷째마당
웹앱 & 하이브리드앱 만들기

17 무료 FTP 서버 등록 및 배포하기
17-1. 무료 FTP 서버에 배포하기
17-2. 네이티브앱 같은 ‘웹앱’ 만들기

18 폰갭을 사용하여 하이브리드앱 만들기
18-1 폰갭으로 하이브리드앱을 안드로이드폰에서 실행하기
18-2 폰갭으로 하이브리드앱을 아이폰에서 실행하기
18-3 iOS 개발자 등록하기
18-4 iOS 개발자와 배포자 인증받기
18-5 개발용 아이폰 디바이스 등록, 애플리케이션 ID 등록, 개발자 프로비저닝 준비
18-6 개발자 아이폰 디바이스에서 실행하기

19 애플 앱스토어와 구글 마켓에 올리기
19-01 안드로이드 마켓에 올리기
19-02 애플 앱스토어에 올리기

부록: 안드로이드폰 에뮬레이터 설치하기