콘텐츠 바로가기
본문 바로가기


블로그 전체검색
완성된 웹사이트로 배우는 HTML&CSS 웹 디자인

[도서] 완성된 웹사이트로 배우는 HTML&CSS 웹 디자인

Mana 저/신은화 역

내용 평점 5점

구성 평점 5점

 

HTML/CSS 기본 사용법을 알고 있음에도 웹사이트를 만드는 것이 막연하기만 한 이들을 위한 책이 나왔다.

바로 <완성된 웹사이트로 배우는 HTML&CSS 웹디자인> 책이다.   

이 책을 읽으면 큰 도움이 될 대상 독자는 다음과 같다. 

- HTML, CSS 기초 학습을 마친 사람
- 기본에서 한 단계 더 나아간 웹사이트를 제작하고 싶은 사람
- 애니메이션 등 움직임이 있는 웹사이트를 만들고 싶은 사람
- 효율적인 코드 작성법을 알고 싶은 사람
- 독학 시 마주하는 문제의 해결법을 배우고 싶은 사람 접기

책의 저자인 Mana는 일본에서 2년간 그래픽 디자이너로 일한 뒤, 캐나다, 호주, 영국 회사에서 웹 디자이너로 근무했으며 현재는 웹사이트 제작을 강의하고 있다. 일본 알파 블로거 어워드를 수상했으며. 저서 <러닝스쿨! 한 권으로 끝내는 HTML+CSS 웹 디자인 입문>으로 2019년 CPU 대상 서적 부문 대상을 수상한 이력이 있다. 


이 책은 총 6장인데, 첫번째장은 웹개발에 필요한 기본 내용을 다룬다. 그 다음으로는 5개 예제를 통해 다양한 케이스를 익히게 된다. 

 

1. 랜딩 페이지반응형 웹 페이지를 만들기 위한 세부 설정과 폰트 조합을 알아보고 알아두면 편리한 아이콘 폰트도 배운다. 

2. 블로그 사이트점선, 곡선, 인덱스나 리스트, 헤더, 푸터 등 세부적으로 꾸미는 방법을 소개한다.

3. 회사 사이트자바스크립트 라이브러리를 활용해 그래프, 표 등 회사 사이트에서 자주 사용하는 데이터 정리 방법을 배운다.

4. 이벤트 사이트애니메이션, 블렌드 모드 등 사용자의 마음을 움직일 수 있는 표현 방법과 커스텀 변수 등 여러 사이트에서 응용 가능한 웹 디자인을 배운다.

5. 갤러리 사이트동영상, 다단 레이아웃, CSS 필터, 확대, 라이트 박스 등 자주 사용하는 여러 웹 기술을 배운다.


웹디자인 인플루언서인 저자 Mana가 알려주는 웹사이트 개발의 모든 것을 이 책을 통해 바로 당장 적용해볼 수 있다. 이 책의 특징은 클론코딩을 차용했다는 것이다. 클론 코딩은 이미 만들어진 페이지를 분석하면서 똑같이 따라 만들어 보는 방식이다. 각 디자인 요소에 적용된 HTML, CSS를 뜯어보며 익힌다. 프런트엔드에 입문했지만 막상 웹사이트를 만들려고 하면 손이 움직이지 않는 이들을 위해 너무 긴 코드나 복잡한 방법은 피했다. 이를 확인할 수 있는 연습 문제도 있어 직접 작성한 코드가 어떻게 반영되는지 확인 가능하다. 

 

이 책을 읽고 난 다음에는 주위 어떠한 요소나 여백과 상관없이, 심지어는 겹쳐 보이게 요소를 배치하고 플렉스 박스를 활용한 반응형 웹 디자인으로 다양한 화면에 대응 가능하며 복사 가능한 예쁜 폰트의 텍스트, 확대해도 깨지지 않는 아이콘을 제공하는 웹사이트를 만들 수 있다. 더 나아가 자바스크립트 라이브러리로 그래프를 그리는 방법, 그림을 직접 편집하지 않고도 CSS로 이미지 색을 바꾸거나 변형하는 방법, 배경에 동영상을 넣는 방법도 익힐 수도 있다. 

 

한빛미디어 <나는 리뷰어다> 활동을 위해서 책을 제공받아 작성된 서평입니다.


PRIDE2