[홈페이지 모작]

홈페이지 모작이란?

 

상용화된 홈페이지들을 서칭하여 HTML과 CSS만을 이용하여 최대한 비슷하게 스스로 구조를 짜보고 디자인을 해보는 것입니다.

 

HTML&CSS에서 학습했던 디자인삼성이나 G마켓 제작하는 것이 모작의 예시라고 볼 수 있습니다.

 

HTML과 CSS의 감을 잃지 않기 위해 꾸준히 연습하는 방법이라고 생각하시면 됩니다.

 

모작은 단계를 나눠서 진행하는 것이 학습에 효과적입니다.

 

단계는 크게 다음과 같이 나눌 예정입니다.

(단계는 예시일 뿐 모든 홈페이지에 동일하게 적용되지는 않습니다.)

 

 

1단계 : 전체 그리드 및 레이아웃 잡기

2단계 : 상단 탑바 제작 (로고, 검색창, 유저박스)

3단계 : 1차 메뉴 제작

4단계 : 2차 메뉴 제작

5단계 : 3차 메뉴 제작

6단계 : 배너 이미지 삽입

7단계 : 제품 소개 및 상세보기 내용 추가

 

 

해당 카테고리에서는 코드를 자세히 설명하는 것보다는 단계별로 홈페이지를 어떻게 제작하는 지에 초점을 맞춰볼 예정입니다.

 

제가 학습하는 것을 공유하는 곳이기 때문에 첨부된 코드가 100% 정답이라고 보기는 어렵습니다.

 

함께 도전하면서 서로 잘못된 부분이 있다면 조언해주는 그런 공간이 되었으면 좋겠습니다. 감사합니다.