-
-
HTML/CSS 입문 예제 중심 - HTML/CSS 기초에서 반응형 웹까지
황재호 지음 / 인포앤북 / 2020년 11월
평점 : 
오래전에 HTML태그를 배워서 혼자서 홈페이지를 만들던 기억이 어렴푸시 나는데 아직도 그 당시 HTML이 남아 있기는 하지만 좀더 발전적으로 변화한 <HTML/CSS입문 예제중심>을 통해 최신 트렌드에 맞는 홈페이지를 만들수있는 기술을 익힐수가 있습니다. html은 일종의 간단한 워드프레스입니다. 홈페이지를 접속하면 같은 언어이기에 같은 모습을 볼수있게 하는 방식인거죠.css는 html을 보완해서 칼러와 폰트 그리고 폰트속성을 조절하는 기능을 가지게 됩니다. 그리고 html과 css를 레이아웃하는 html5의기능을익히고 반응형웹기능을 익혀서 웹개발자로서의 기본역량을 쌓게 해줍니다. 사실 이정도의 능력은 웹디자이너도 알아야할 요소인지라 꼭 알아야할 부분의 기초도 다양한 예제를 통해 익힐수있게 해줍니다.
저자는 강의와 집필을 하시는 황재호님입니다. 경희대 전자공학과 출신으로 석박까지 하신 분이십니다.KT에서 연구원 경력인 분이십니다.
처음에는 저도 오래전에 배워서 아직도 기억에 남아있는 기본태그를 설명합니다. <HAED><BODY><BR><IMG>등구조를 만드는 기본태그부터 최근들어 빈번히 들어가는 <AUDIO><VIDEO>태그의 속성까지 공부할수있습니다. 사실 기본태그보다 속성은 알면 알수록 어려워지는 것이 사실이라서 계속해서 사용하지 않는다면 잊어버리기 딱좋죠. 저때도 있었던 <FORM><INPUT>문은 그 당시에도 좀더 깊숙히 공부해야 하는 하이클라스의 영역으로 기억납니다.
홈페이지가 본격적으로 화려해지고 복잡화된 시기는 CSS의 도입부터입니다. HTML를 보조해서 색상, 글자스타일, 글자 그림자까지를 조율하는 역할을 합니다. CSS를 따로 디렉토리가 만들어지면서 홈피코딩이 매우 길어지고 복잡해졌던 기억이납니다. CSS는 <style>태그에 구성됩니다. 첫번째 방법은 <style></style>이고 두번째는 style ="", 세번째는 <link>태그를 이용해서 stylesheet로 표현하는 방식입니다. 이정도만 와도 실전에 가면 20-30%의 학습자가 떨어져나가죠.ㅠㅠ 무슨 분야이든 엉덩이를 무겁게해서 인내하면서 익혀서활용해야하는 부분이 존재합니다. HTML을 배우면 주석문이 <!--와 -->로 구성이 되는데, CSS주석문은 /*과 */로 되어 있습니다. 참고로 프로그래밍은 #으로 주석을씁니다.^^ HTML에서 링크를 걸때 <a>를 쓰게 됩니다. css는 a:로 링크를 사용합니다. a:link{}, a:visited{}, a:hover{}이 실예이죠.
박스모델은 저도 이 책을 보면서 처음접하는 부분입니다. 경계선(Border), 마진(Margin), 패딩(Padding)을 자유롭게 쓸수있어야 합니다. 방식은 margin: border:padding:로 씁니다. 박스의 크기와 위치를 설정하는 명령어입니다. 여기에 하위 속성값도 모두 정해져 있습니다.
HTML을 배우고 CSS를 배웠으니 실전으로 배치를 하는 레이아웃과정으로 웹페이지를 완성하는거죠. 박스를 <float>와 <clear>를 사용하여 위치배열을 하고 두태그를 열고 닫는 방식으로 구성됩니다. 그리고 html5에서 도입이된 레이아웃방식인 <header><footer><section><nav>를 이용해서 레이아웃의 모습을 잡게 됩니다. 마지막은 모바일에서 강력하게 사용되는 반응형웹의 기초 맞보기를 합니다. 요즘 데스트톱, 테블릿, 스마트폰 등 정말 다양한 플렛폼이 생기고 같은 홈페이지를 다양한 플랫폼에 같은 기능을 구현해야 하는 어려움을 바로 반응형웹이 해결할수있습니다.
<HTML/CSS입문 예제중심>은 다른 서적에 비해 좀더 쉽게 내용을 숙지하고 다양한 예문을 통해 좀더 알차게 홈페이지를 만들수있는 기본 트릭을 배우는 서적입니다. 연습예제를 통해 이 책을 완성하면 외형이라도 그럴듯한 홈페이지를 만들수 있는 힘이 생길수 있을 겁니다.