[책] HTML5+CSS3 웹 표준의 정석 :: 웹 기획자, 웹 퍼블리셔, 웹 디자이너, 프론트엔드 개발자가 되고 싶다면

초등학교 때 정보? 컴퓨터? 과목에서 html을 배운 적이 있다. 그 때는 이게 왜 필요한 지도 몰랐다. 선생님이 하라는 대로 메모장에다가 의미를 알 수 없는 기호 같은 것들을 집어넣으면 색깔이 바뀌고, 내용이 입력되고 그랬던 것 같다. 다음 카페 배너 같은 걸 만들 때 태그가 필요하다 그랬나, 그런 걸 얼핏 본 기억도 난다. 왜인지 기억나는 이름이 장미 가족의 태그 교실. 집에 동생이 샀던 책이 있었다. 연예인 카페에 올릴 뭐 만든다고 아마 샀을 거다.

그 당시의 인터넷과 지금의 인터넷은 느낌이 상당히 다르다. 일단 디자인이 다르다. 옛날 홈페이지는 동글동글하고 명암이나 그라데이션도 들어가고 상당히 입체적이다. 요즘은 플랫이다. 무엇이 예쁜가는 시대에 따라 바뀌니깐 넘어가자. 지금은 무엇보다도 웹의 사용성, 편의성이 다르다. 스티브 잡스가 예전에 미국 무슨 컨퍼런스에서 했던 대담을 본 적이 있다. 어도비 플래시가 주제였다. 왜 애플은 아이폰에서 플래시를 뺐는가. 잘한 일인가. 그 때 스티브 잡스는 앞으로 가장 중요한 기술은 HTML5라고 말했다. 사실 HTML은 많이 들어봤다. 근데 HTML2도, 3도, 4도 못 들어봤다. 그런데 갑자기 HTML5라고 말하니 궁금했다. 2,3,4는 없나? 5가 단순히 순서적인 의미가 아닌 건가? 그렇게 웹에 관심을 갖게 됐다. 웹 표준이란 게 있다는 것도 처음 알았다. '웹'으로 웹에 관련된 글을 계속 읽다보니 배경지식이 쌓였다. 왜 예전에 아이폰으로 접속하면 플래시가 있어야 할 자리에 구멍이 뚫려있었는지 알았다. 왜 어떤 홈페이지들(주로 국내 공공기관 사이트들)은 익스플로러로 접속해야만 하는지 알았다. 그리고 이 HTML5가 상당히 강력한 힘을 갖고 있다는 것을 알았다. 한동안은 그 권력을 쭉 갖고 있을 것이란 생각이 들었다.

그래서 공부했다. 파이썬과 마찬가지로 처음은 코드카데미(codecademy)로 했다. 그냥 시간이 걸릴 뿐이지 이해는 어렵지 않았다. 아 이 태그는 이런 기능이구나, 저 태그는 저런 기능이구나만 알면 됐다. 코드카데미로 한 번 진도를 마치고 책을 샀다. 파이썬과 마찬가지로 이지스퍼블리싱에서 나온 <Do it! HTML5+CSS3 웹 표준의 정석>.

Do it! HTML5+CSS3 웹 표준의 정석 국내도서 저자 : 고경희 출판 : 이지스퍼블리싱 2017.01.03 상세보기

책 디자인이 매우 깔끔하다. 그리고 같은 시리즈를 책장에 꽂아놓으면 기분이 좋다. 물론 내용도 알기 쉽게 잘 설명해준다. HTML5와 CSS3의 기초는 물론이다. 이 책에 있는 내용만 가지고 충분히 내 홈페이지 하나를 디자인할 수 있다. 경험담이다. 진도를 다 끝낸 직후에 내 개인 포트폴리오 사이트 하나를 만들었다. 물론 우리가 사용하는 보통의 웹사이트를 만들려면 자바스크립트와 서버(백엔드)도 알아야 한다. 또 동적인 웹사이트를 만들려면 제이쿼리도 알아야 한다. 자바스크립트만 알아도 되긴 하지만, 제이쿼리가 편하다.

하지만 HTML과 CSS만 알아도 웹 퍼블리셔로 진로를 잡을 수도 있다. 웹 기획자가 되는 데에도 꼭 필수는 아니지만 사실상 필수라고 볼 수 있다. 자바스크립트와 제이쿼리를 알면 웹 디자이너나 프론트엔드 개발자로 나갈 수도 있다.

이 책은 우선 컬러다. 프론트엔드에서 컬러는 매우 중요하다. 서점에서 흑백 인쇄된 책도 살펴봤다. 웹사이트 예제는 컬러가 훨씬 눈에 잘 들어온다. 물론 코드 샘플도 컬러로 되어있는 게 구분이 잘 된다.

어느 책이나 마찬가지이긴 하지만 각 장의 마지막은 연습문제로 끝난다. 난이도가 적당하다. 쉽다고 생각했는데, 알고보니 원래 HTML과 CSS가 어렵다 할 만한 건 없다. 문제가 꽤나 풍부한 편이다. 출판사 사이트에서 받을 수 있다. 유투브에는 저자 직강 동영상 강의도 있다. 사실 나는 혼자 공부하는 걸 더 좋아하는 편이고 책만 봐도 충분히 이해가 되서 상관없긴 했다. 하지만 강의를 듣는 걸 더 좋아하거나, 이해가 안 되는 부분이 있을 때 큰 도움이 될 것이다.

웹 표준을 지향하는 만큼 크롬, 파이어폭스, 익스플로러, 엣지 등 다양한 웹 브라우저의 예를 들어준다. 사실 나 같은 경우 거의 크롬 위주로 코드를 짜는 경향이 있다. 내가 크롬을 쓰니깐. 하지만 모든 브라우저에서 잘 보이는 범용성이 중요하다. 이 책은 그걸 계속 각인시켜주면서 브라우저별 코드를 설명하는 걸 잊지 않는다.

또 30일 정석 코스와 20일 집중 코스로 제시하는 진도가 있다. 혼자 공부하는 만큼 자칫 밀리고 쳐질 수 있는 걸 방지하는 데에 도움이 된다. 개인적으로는 진도표의 빈 칸에 학습 날짜를 채워나가는 게 재미있어서 진도를 금방 나갈 수 있었다. 만약 이런 게 없었다면 조금은 더 늦춰지지 않았을까. HTML5와 CSS3에 관한 책은 많다. CSS 레퍼런스인지 CSS에 관해서만 1000 페이지는 될 것 같은 책도 봤다. 하지만 처음 시작하는 초보자에게는 HTML과 CSS를 엮어서 이해하는 게 중요하다. 이 책은 그 부분에서 HTML과 CSS를 왔다갔다 하면서 적절하게 설명해준다. HTML 책이 왜인지 흑백이 많던데 이 책은 컬러라는 점에서도 추천한다.