프로그래밍이 처음인가요? 배운 적은 있지만, 재미를 느끼지 못했다고요? 그래서 시리즈를 준비했습니다! 이 시리즈의 목표는 ‘쉽고’, ‘재미있게’, ‘끝까지’ 책을 읽는 데 있습니다.이 책 한 권으로 프로그래밍의 고수가 될 수는 없겠지만, 프로그래밍의 재미는 확실하게 느낄 수 있을 겁니다. - 초보자를 위한 헬로 코딩 카페(http://cafe.naver.com/codinghello) 혼자서 책을 공부하다가 도저히 모를 때는 헬로 코딩 카페에 놀러오세요. 친절하게 답해드리겠습니다. ? http://cafe.naver.com/codinghello - 당장 컴퓨터가 없어도 괜찮아요 프로그래밍 책은 지하철에서, 버스에서 읽을 수 없다고요? 실습할 수 없는 환경에 있더라도, 염려하지 마세요! 코드와 실행 화면을 바로바로 매칭해서 책만으로도 학습이 가능합니다. - 꼭꼭 씹어서 내 것으로 만드는 4단계 반복 학습 이론+짧은 퀴즈+프로젝트 완성, 요점 정리, 이 4단계를 통해서 책의 내용을 확실하게 익힐 수 있습니다. 책을 다 읽어가는 데 기억이 안 난다고요? 그래서 마지막 장에는 종합 프로젝트를 준비했습니다. - 10개의 프로젝트 이론은 배웠지만, 어떻게 써야 할지 모른다고요? 각 장의 마지막에는 프로젝트가 있어 이번에 배운 내용이 어디에 어떤 식으로 사용하는지 바로바로 확인할 수 있습니다. [관련 서적] - 『모던 웹 디자인을 위한 HTML5+CSS3 입문, 개정판』(한빛미디어, 2015) - 『HTML5+CSS3 정복 : 실습 위주의 친절한 HTML5 자습서』(한빛미디어, 2014) - 『인터랙티브 웹디자인북: 웹디자이너를 위한 HTML5+CSS3+jQuery 사용설명서』(한빛미디어, 2015) - 『모던 웹을 위한 JavaScript + jQuery 입문(3판)』(한빛미디어, 2017) - 『JavaScript+jQuery 정복 : 보고, 이해하고, 바로 쓰는 자바스크립트 공략집』(한빛미디어, 2014)

Part 1 HTML 기본기 다지기 chapter 1 HTML이란? -- HTML과 CSS는 웹사이트를 꾸미는 뼈대와 살입니다. 이제 뼈대를 만들 준비를 해볼까요? _ 01 HTML과 웹 브라우저 알아보기 __02 실습 준비하기 __03 HTML 문서 구조 이해하기 __04 CSS 맛보기 __요점 정리 chapter 2 글자 관련 태그를 익혀보자 문단을 나누고 글자에 색칠하고 힘을 줘볼까요? __01 글 제목 만들기 __02 단락 나누기 ? __03 글자 두껍게 하기 __04 줄바꿈과 공백 삽입하기 __05 목록 만들기 __06 HTML 문서에 설명 글 달기 __프로젝트 1 : 간단한 로제 파스타 만들기 __요점 정리 chapter 3 멀티미디어와 링크에 대해 알아보자 이제 웹사이트에 동영상과 그림, 음악을 추가해봅시다. __01 이미지 삽입하기 __02 태그의 속성 알아보기 __03 오디오 삽입하기 __04 비디오 삽입하기 __05 링크 걸기 __프로젝트 2 : 이미지, 소리, 비디오 보여주기 __요점 정리 chapter 4 테이블과 폼 양식을 만들어보자 스케줄 표를 만들어보고 싶어요. __01 테이블 삽입하기 __02 테이블의 행과 열 합치기 __프로젝트 3 : 태풍 정보 __03 폼 양식이란? __04 텍스트와 비밀번호 입력 창 만들기 __05 라디오 버튼과 체크 박스 만들기 __06 파일 선택 창 만들기 __07 선택 박스 만들기 __08 다중 입력 창 만들기 __09 버튼 만들기 __프로젝트 4 : 문의 게시판 글쓰기 __요점 정리91 Part 2 CSS 기초와 응용 chapter 5 CSS 기본을 다지자 드디어 CSS입니다. 이제부터 웹사이트에 살을 붙일 겁니다. __01 CSS란? __02 글자 스타일 지정하기 __03 목록 스타일 지정하기 __04 CSS에 설명 글 달기 __프로젝트 5 : 루바토 펜션 안내 __요점 정리 chapter 6 CSS 선택자에 대해 알아보자 꾸며주려는 영역을 선택하는 방법을 알아봅시다. __01 CSS 선택자란? __02 태그 선택자 __03 id 선택자 __04 클래스 선택자 __프로젝트 6 : 양평 국제 기타 페스티벌 __요점 정리 chapter 7 레이아웃의 기초, 박스 모델을 이해하자 대체 웹사이트는 어떤 식으로 구성될까요? 레이아웃의 기초를 익혀 꾸며봅시다. __01 박스 모델이란? __02 경계선 그리기 __03 패딩과 마진 설정하기 __04 패딩과 마진 초기화하기 __프로젝트 7 : 주말 야간 개장 안내 __요점 정리 chapter 8 배경 색상과 이미지를 설정해보자 웹사이트의 배경을 꾸며볼까요? 저는 꽃무늬 벽지를 넣고 싶어요. __01 배경 색상 설정하기 __02 배경 이미지 삽입하기 __03 배경 이미지 반복 설정하기 __프로젝트 8 : 봄맞이 세일 __요점 정리 chapter 9 테이블을 꾸며보자 4장에서 만들었던 표도 조금 더 보기 좋게 만들어봅시다. __01 테이블 경계선 그리기 __02 테이블 너비 지정과 텍스트 정렬하기 __03 테이블 배경 색상 지정하기 __프로젝트 9 : 일정(스케줄)표 __요점 정리 Part 3 레이아웃과 포토 강좌 페이지 제작하기 chapter 10 레이아웃의 기초를 다지자 이제 준비가 됐습니다. 드디어 나만의 레이아웃을 만들어봅시다. __01 레이아웃이란? __02 display 속성 __03 float 속성 __04 clear 속성 __프로젝트 10 : 판매 도서 목록 __요점 정리 chapter 11 웹 페이지 레이아웃에 대해 알아보자 10장에서 만든 레이아웃을 조금 더 다듬어 볼까요? __01 HTML5의 레이아웃 태그 __02 전체 웹 페이지 레이아웃 __03 상단 헤더와 내비게이션 메뉴 레이아웃 __04 콘텐츠 영역과 사이드바 레이아웃 __05 하단 푸터 레이아웃 __06 전체 웹 페이지 레이아웃 완성하기 __요점 정리 chapter 12 포토 아카데미 페이지를 만들어보자 지금까지 배운 내용을 기반으로 드디어 완성된 페이지를 만들거에요. __01 실습용 포토 아카데미 페이지 소개 __02 웹 페이지 기본 틀 만들기 __03 상단 헤더 만들기 __04 메인 이미지 만들기 __05 서브 메뉴와 메인 콘텐츠 만들기 __06 하단 푸터 만들기 __07 소스 정리하여 완성하기 __요점 정리