도서 소개

웹 분야 베스트셀러의 개정 3판은 최신 웹 표준과 반응형 웹을 반영해 실전형 학습을 돕는 입문서다. 기초 개념부터 실습·복습·평가까지 이어지는 구성으로 HTML과 CSS의 기본을 탄탄하게 익힐 수 있으며, AI 코딩 도구를 활용하는 부록과 웹 개발 실력을 점검하는 테스트도 함께 제공한다. 250여 개 예제와 저자 직강 영상, 학습 계획표 등 체계적 지원으로 처음 배우는 사람과 기초를 다지고 싶은 개발자 모두에게 유용하다.


AI와 협업하며 코드를 이해하고 수정하는 능력을 키우는 데 중점을 둔 이번 개정판은 변화한 웹 환경에 맞춘 실무형 흐름을 제시한다. 부록의 단계별 AI 실습과 웹 개발 면허 시험으로 실력 점검이 가능하며, 예제 소스와 스터디룸 커뮤니티를 통해 독학자와 교강사 모두 활용할 수 있는 폭넓은 학습 환경을 갖췄다.

  출판사 리뷰

웹 분야 베스트셀러가 개정 3판으로 돌아왔다!
코딩 초보도 최신 웹 표준부터 반응형 웹까지 한 권으로 끝낸다!
웹 분야 베스트셀러《Do it! HTML+CSS 웹 표준의 정석》이 개정 3판으로 새롭게 출간되었다.이번 개정판은 최신 웹 표준과 반응형 웹 등 웹 개발의 기술과 트렌드를 적극 반영하여 현재 웹 환경에 맞는 실전형 학습을 할 수 있도록 구성했다.

또한 새로 추가한《AI와 협업하는 개발자 되기》부록에서는 AI 코딩 도구를 활용해 HTML과 CSS 코드를 작성하는 과정을 단계별로 학습할 수 있다. 단순히 코드를 따라 치는 데 그치지 않고 AI와 함께 문제를 해결하며 코드를 응용하는 능력까지 키울 수 있다. 이와 더불어《Do it! 웹 개발 면허 시험》부록에서는 학습 내용을 최종 점검하고 자신의 웹 개발 실력을 등급표에서 확인할 수 있어서 실력 향상과 자가 진단을 동시에 할 수 있다.

이 책 한 권으로 ‘기초 개념 → 실습 → 복습 → 실력 점검’까지 체계적으로 학습할 수 있어서 웹 개발 입문자는 물론, 기초를 다시 다지고 싶은 개발자에게도 최적화된 학습서이다.

[출판사 서평]

AI 시대, 탄탄한 웹 기본기를 위한 교과서
《Do it! HTML+CSS 웹 표준의 정석》 개정 3판 출간!
2017년 초판을 발행한 이후 수많은 웹 개발 입문자와 함께해 온 《Do it! HTML+CSS 웹 표준의 정석》이 개정 3판으로 새롭게 돌아왔습니다. 이제는 AI에게 ‘홈페이지를 만들어 줘’라고 요청하면 실제로 코드를 작성해 주는 시대입니다. 하지만 진짜 중요한 것은 그 코드를 이해하고 수정할 수 있는 사람이 필요하다는 것입니다. AI는 우리가 묻는 만큼만 답해 주기 때문입니다. 그래서 무엇을 만들고 왜 그렇게 만들어야 하는지 아는 사람이야말로 AI를 가장 잘 활용할 수 있습니다.
아무리 시대가 변해도 웹 개발의 기초를 이루는 핵심 기술이 HTML과 CSS라는 점은 변하지 않습니다. 이 책은 웹 입문자가 기초를 확실하게 다질 수 있도록 HTML의 태그가 무엇인지부터 친절하게 알려 줍니다. 단순히 문법을 익히는 것으로 끝나지 않고 AI와 협업하며 코딩할 수 있는 기본 실력을 쌓도록 돕습니다. 이번 개정판에는 최신 기술과 웹 트렌드를 반영하고 AI 시대에 맞춘 와 스스로 웹 개발 실력을 점검해 보는 을 부록으로 수록했습니다. 그 결과 지금 웹 개발에 입문하는 사람에게 딱 맞는 책으로 완성되었습니다.

이 책, 이런 분께 추천해요!
· 웹 프로그래밍이 궁금한 코딩 초보자
· 웹 개발자가 되고 싶은 취업 준비생
· 웹 개발자와 소통하고 싶은 웹 기획자
· 퍼블리싱도 함께 해야 하는 웹 디자이너
· 웹 개발을 체계적으로 알려 줄 교재를 찾고 있는 교강사

실습→복습→평가까지 한 번에!
체계적인 학습 설계로 공부 효과가 3배!
이 책은 한 번만 읽어도 세 번 읽은 것 같은 효과를 얻을 수 있도록 구성했습니다.

1. 장이 시작할 때마다 ‘이 장을 다 공부하면!’ 코너에서 학습 목표를 미리 파악한 뒤, 다양한 예제를 직접 코딩하며 실습을 진행합니다. 이 책은 빈칸을 직접 채워 넣는 손코딩 문제부터 프로그램을 단계별로 따라 만들어 보는 ‘Do it! 실습’까지 총 250여 개의 예제를 제공합니다.
2. 장 하나를 다 공부하면 ‘확인’ 코너의 질문에 답하며 그 장에서 무엇을 배웠는지 돌아봅니다.
3. 마지막으로 ‘되새김 문제’로 배운 내용을 얼마나 이해했는지 스스로 평가합니다.

이렇게 체계적인 구성에 따라 공부하다 보면 가장 효율적인 학습 효과를 기대할 수 있습니다.

웹 개발 실력 향상을 위한 특별한 부록 2종
AI 활용법과 웹 개발 면허 시험 수록!
부록 A 에서는 AI와 함께 코드를 작성하는 방법을 배웁니다. AI 코딩이 무엇인지 알아보고 AI 코딩 도구를 이용해 HTML과 CSS 코드를 만드는 과정을 단계별로 실습합니다. AI를 단순히 도우미가 아닌 ‘함께 일하는 동료’로 활용하는 방법을 배우면 학습 속도가 훨씬 빨라질 거예요!
모든 학습을 마쳤다면 부록 B 으로 최종 실력을 점검해 보세요. 시험이 끝나면 점수를 매기고 나의 웹 개발 등급을 확인해 보세요. 책에서 제공하는 등급표로 현재 자신의 실력과 앞으로 보완해야 할 부분을 한눈에 파악할 수 있습니다. 아는 내용은 확실히 다지고 부족한 부분은 다시 복습하다 보면 어느새 실력이 눈에 띄게 올라 있을 거예요!

일대일 과외를 받는 듯한
저자 직강 동영상 무료 제공
저자가 직접 해설해 주는 동영상과 함께 공부해 보세요. 도중에 포기하지 않고 더 쉽게 완독하는 경험을 할 수 있습니다. 웹 개발을 독학하려고 계획을 세웠거나 학교에서 공부한 내용을 복습하고 싶다면 책과 함께 동영상 강의를 꼭 활용해 보세요.

독학과 교재 모두 추천!
공부 속도에 맞는 학습 계획표 2종 제공
목표를 세우고 공부하면 두꺼운 책도 끝까지 읽을 수 있습니다. 차근차근 공부하고 싶다면 ‘30일 정석 코스’로, 짧은 기간에 집중해서 빠르게 끝내고 싶다면 ‘15일 집중 코스’로 학습 계획을 세워 보세요. 계획한 대로 책을 다 읽고 나면 웹 개발의 기초를 완전히 정복할 수 있을 거예요. 강의 계획을 세울 때 참고하기도 좋으니 학원이나 대학 교재로도 적극 활용해 보세요.

예제 소스 파일은 이지스퍼블리싱 홈페이지의 자료실 또는 저자 깃허브에서 제공합니다
· 이지스퍼블리싱 홈페이지: www.easyspub.co.kr → [자료실] 클릭 → 도서명 검색
· 저자 깃허브: https://github.com/funnycom/doit-hcj-new

함께 배우고, 나누고, 성장하는 ‘Do it! 스터디룸’으로 오세요!
혼자 계획을 세우고 공부하다 보면 금방 지치기 마련입니다. 어려운 내용은 나와 비슷한 고민을 하는 독자를 만나 공유해 보세요. 서로 도움을 주고받으며 공부하면 더 보람차니까요. 내가 잘 이해한 내용은 남을 도와주고 내가 잘 이해하지 못한 내용은 도움을 받으면서 공부하면 복습 효과도 누릴 수 있습니다. 멀리 가려면 친구와 함께해 보세요.
· Do it! 스터디룸: cafe.naver.com/doitstudyroom

  작가 소개

지은이 : 고경희 1568
홍익대학교 컴퓨터공학과를 졸업하고 동 대학원에서 인공지능을 공부했다. 인터넷이 막 대중화되던 1990년대 후반부터 웹 기술을 쉽게 배우고 가르치는 일에 관심을 갖고, 지금까지 70여 권이 넘는 책을 집필했다. HTML, CSS, 자바스크립트, 깃·깃허브 등 웹의 기본기를 누구나 이해할 수 있도록 풀어내며 많은 독자들이 웹 개발의 첫걸음을 떼는 데 도움을 주었고, 특히 《Do it! HTML+CSS+자바스크립트 웹 표준의 정석》은 수많은 입문자들이 웹 개발을 시작할 때 가장 먼저 찾는 책으로 자리 잡았다. '기본기를 놓치지 않는 학습이 가장 중요하다'는 신념으로 독자들이 단단한 기초 위에 실력을 쌓을 수 있도록 돕고 있다. 생성형 AI가 코딩의 판도를 바꾸고 있는 지금도 개발자의 기본 소양을 기르는 일에 변함없이 최선을 다하고 있다.대표 저서o《Do it! 5일 만에 끝내는 깃 & 깃허브 입문》(이지스퍼블리싱, 2024)o《Do it! HTML + CSS + 자바스크립트 웹 표준의 정석》(이지스퍼블리싱, 2024)o《Do it! Node. js 프로그래밍 입문》(이지스퍼블리싱, 2023)o《Do it! 모던 자바스크립트 프로그래밍의 정석》(이지스퍼블리싱, 2022)o《Do it! 자바스크립트 입문》(이지스퍼블리싱, 2021)o《Do it! HTML5+CSS3 웹 표준의 정석》(이지스퍼블리싱, 2019)

  목차

첫째마당 웹과 HTML 시작하기

01 웹은 어떻게 움직일까
__01-1 여러 형태의 웹 사이트
__01-2 네트워크 이해하기
__01-3 웹의 기본 동작 이해하기
__01-4 웹 접근성 알아보기
__01장 되새김 문제

02 웹 개발 시작하기
__02-1 웹 개발, 어디서부터 시작할까
__02-2 웹 개발 환경 설정하기

03 HTML 기본 문서 만들기
__03-1 HTML과 첫 만남
__03-2 HTML의 구조 파악하기
__03-3 HTML 파일 만들기
__03-4 웹 문서의 구조를 만드는 시맨틱 태그
__03장 되새김 문제

04 웹 문서에 다양한 내용 입력하기
__04-1 텍스트 입력하기
__04-2 목록 만들기
__04-3 표 만들기
__04-4 이미지 삽입하기
__04-5 오디오와 비디오 삽입하기
__04-6 하이퍼링크 삽입하기
__04장 되새김 문제

05 입력 양식 작성하기
__05-1 폼 삽입하기
__05-2 사용자 입력을 위한 input 태그
__05-3 input 태그의 주요 속성
__05-4 폼에서 사용하는 여러 가지 태그
__05장 되새김 문제

둘째마당 CSS 다루기

06 CSS의 기본
__06-1 스타일과 스타일 시트
__06-2 CSS 기본 선택자 알아보기
__06-3 캐스케이딩 스타일 시트 알아보기
__06장 되새김 문제

07 텍스트를 표현하는 다양한 스타일
__07-1 글꼴 관련 스타일
__07-2 웹 폰트와 아이콘 폰트 사용하기
__07-3 텍스트 관련 스타일
__07-4 목록 스타일
__07-5 표 스타일
__07장 되새김 문제

08 CSS 박스 모델
__08-1 CSS와 박스 모델
__08-2 테두리 스타일 지정하기
__08-3 여백을 조절하는 속성
__08-4 웹 문서의 레이아웃 만들기
__08-5 웹 요소의 위치 지정하기
__08장 되새김 문제

09 이미지와 그러데이션 효과로 배경 꾸미기
__09-1 배경색과 배경 범위 지정하기
__09-2 배경 이미지 지정하기
__09-3 그러데이션 효과로 배경 꾸미기
__09장 되새김 문제

셋째마당 반응형 웹 만들기

10 반응형 웹과 미디어 쿼리
__10-1 반응형 웹 알아보기
__10-2 반응형 요소 만들기
__10-3 미디어 쿼리 알아보기
__10장 되새김 문제

11 플렉스 박스 레이아웃으로 배치하기
__11-1 배치를 위한 기본 속성 살펴보기
__11-2 반응형 웹을 위한 속성 살펴보기
__11장 되새김 문제

12 CSS 그리드 레이아웃으로 배치하기
__12-1 CSS 그리드 레이아웃 사용하기
__12-2 그리드 라인과 템플릿 영역으로 배치하기
__12장 되새김 문제

넷째마당 CSS 고급 기능

13 CSS 고급 선택자
__13-1 연결 선택자
__13-2 속성 선택자
__13-3 가상 클래스와 가상 요소
__13-4 CSS 함수 살펴보기
__13장 되새김 문제

14 트랜지션과 애니메이션
__14-1 트랜스폼 알아보기
__14-2 트랜지션 알아보기
__14-3 애니메이션 알아보기
__14장 되새김 문제

부록 A 《AI와 협업하는 개발자 되기》
부록 B 《Do it! 웹 개발 면허 시험》

찾아보기

  회원리뷰