-
-
HTML/CSS 입문 예제 중심 - HTML/CSS 기초에서 반응형 웹까지
황재호 지음 / 인포앤북 / 2020년 11월
평점 :
HTML/CSS는 개발자의 영역이라 생각했었으나 이제 디자이너도 웹 디자인이 가능한 사람을 찾고, 마케터라면 홈페이지 레이아웃과 소스를 어느정도 숙지하고 있어야 업무를 능숙하게 처리할 수 있다. <HTML/CSS 입문예제 중심>은 HTML, CSS, 레이아웃, 반응형 웹 네가지 파트에 대해 다양한 예제 중심으로 설명하고 있어서 기초 지식을 쌓기에 알맞은 책이다. HTML의 기본 태그와 양식 테이블등의 개념 정리부터 실제 웹 사이트를 제작하는 웹 페이지 레이아웃 기술과 반응형 웹에 대한 실전 기술들을 수록하고 있어서 입문자들이 독학으로 마스터할 수 있게 돕는다.
HTML은 웹 프로그래머와 웹 디자이너가 반드시 알아야 할 가장 기본적인 지식으로 뼈대를 구성하는 <html>,<head>, <body>,<title>,<meta>등의 태그에 대해 알아야 한다. 웹이 어떤 방식으로 구동되는지, 웹 페이지는 어떻게 구성되고, 웹사이트, 웹 서버등 기본적인 용어 설명부터 이미지 파일을 웹 페이지에 삽입하는 방법,페이지 레이아웃 구성 등 기본적인 개념 정리를 해준다. 기획 마케터라 업무중 홈페이지 기획하면서 웹에 대해 다소 엉성하게 알고 있었는데 이번 기회에 기본기를 다진 것 같다.
HTML태그를 이용해 데이터 센터 소개 페이지, 이용 안내 페이지등을 구축해 보고, 회원가입 폼, 열차 시간표, 답글쓰기 폼 등을 제작해 볼 수 있도록 실전 예제를 수록하고 있다. 수록된 예제들은 홈페이지에서 무료로 코드 자료를 제공하고 있고, 책으로 연습하다가 막히거나 질문이 생기면 저자의 홈페이지에 1:1 질의 응답이 가능하다는 점이 장점이다.
반응형 웹은 홈페이지의 트렌드로 데스크톱, 태블릿 PC, 스마트 폰 등의 다양한 기기의 화면에서 콘텐츠가 제대로 보이도록 접속 기기에 반응하여 웹 페이지의 구성과 디자인이 달라지게 하는 기술을 말한다. 문서의 너비가 고정된 레이아웃에 맞게 개발된 웹페이지는 스마트 폰으로 볼 때 이미지나 글자가 너무 작아 이용하기 어렵다. 반응형 웹 디자인 기술을 이용하면 PC버전과 모바일 홈페이지를 별도로 제작하지 않고, 하나의 웹 사이트로 다양한 기기의 화면에 페이지를 제대로 구현할 수 있으나 비용적인 이슈로 외주제작인 경우엔 채택하지 못하는 경우도 있다.
<HTML CSS 입문 예제 중심>에서는 마지막 장에 반응형 웹의 기초가 되는 뷰포트의 개념, 그리드 뷰, 반응형 웹의 폰트를 알아보고, 그리드 뷰에서 가장 많이 사용하는 12열 그리드 시스템의 원리를 터득해 실제로 웹 페이지를 만드는 방법을 익히게 도와준다. 스튜디오 소개 페이지와 예약 페이지 만드는 실습으 통해 반응형 웹 사이트의 로직을 파악할 수 있다.
마케터에게 프로그래머 용어를 안다는 것은 개발자나 웹디자이너와 대화할 때, 원활한 소통은 물론 비장의 무기가 될 수 있다. 제휴나 광고 운영, 홈페이지를 관리하는 마케터들의 업무력 만렙을 위해서 차분히 따라해 보면 좋을 것 같다.