위코드 사전스터디 1주차 프로젝트 자기소개 페이지 만들기!
참고 사이트
👇참고 사이트는 여기👇
https://paloma-demo.squarespace.com/
나중에도 계속해서 사용할 수 있는 웹 페이지를 만들고 싶어서 심미적으로도 유려하고 공부한 내용을 잘 반영할 수 있는 사이트를 찾아보았다. 내가 잡은 이 홈페이지의 포인트는...
- nav영역까지 걸쳐있는 배경화면
- header 안의 title, nav, icons의 그리드 배치
- 스크롤을 하면 자연스럽게 다음 섹션으로 넘어가는 기능
- 섹션이 넘어갈때 header가 고정되어 화면에 나타나는 기능
- 반응형 웹 페이지 구현
...이다! 그렇다면 레이아웃을 설계하러 떠나보자🏃
레이아웃 설계
레이아웃의 설계는 위와 같이 잡아보았다. (훗날의 고난을 예상하지 못한 채...)
Section 1: Intro
Section 2: About
Section 3: Project
Section 4: Contact
레이아웃을 짜면서...
사실 처음에는 참고 사이트만 보고 코드를 무작정 짜기 시작했는데, 팀원들의 기술블로그를 보고 나니 나도 제대로 레이아웃을 구성하고 넘어가야겠다는 생각이 들었다. 레이아웃을 짜고 나니 페이지 구성이나 어떤 기술을 넣어야하는지도 명확해졌다.
화...화이팅...!
