더북(TheBook)

 

DAY 12 키즈가오 프로젝트 시작하기

 

HTML5&CSS3 for everyone icon_day

 

 

지금까지 학습한 HTML과 CSS의 기본 개념을 바탕으로 키즈가오 웹 사이트 실습을 진행하겠습니다. 키즈가오는 우리쌀로 만든 유기농 유아 점토 제품입니다. 웹 사이트에서는 제품의 탄생 과정을 스토리텔링 방식으로 친숙하고 재미있게 소개하고 있습니다. 고객이 이야기에 집중할 수 있도록 한 페이지(단일 페이지)로 제작했고 스토리텔링 방식에 효과적인 패럴랙스 기능을 적용했습니다.

데스크톱뿐만 아니라 모바일 사용자를 고려하여 적응형 버전으로도 제작했지만, 이 책에서는 데스크톱 버전 레이아웃을 중심으로 설명하겠습니다.

 

icon_038

패럴랙스 기능

패럴랙스는 웹 사이트를 스크롤할 때 생기는 시차를 이용하여 다양한 이벤트 효과를 적용한 기술입니다. 패럴랙스가 적용된 웹 사이트는 다음과 같습니다.

• NASA Prospect: https://nasaprospect.com/

• Unfold: https://www.unfold.no/

• Melanie F: http://melanie-f.com/en/

신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.