웹디자인#7
LeeMir, 25 May 2021
13강 - 웹디자인
제작 계획서
- 커버 필수
- 커버 페이지에 “~~~ 제작 계획서 필수”
- 개정이력…?
- 개정번호 / 개정일 / 개정자 / 개정내용 / 페이지
- 어떤 페이지에 무엇이 수정되었는지 구체적으로
- 상황분석(배경)
- 기존 사이트들이 어떤 문제가 있는지
- 주제선정
- 타겟선정
- 웹사이트 특징
- 피드백이 있다면 덮어씌우지 말고 2차 수정안 표기
- 디자인계획
- 디자인 벤치마킹
- 색상
- 주조색 / 보조색 / 강조색 (색상코드도 같이 첨부)
- 스케치
- 사이트구조도(트리)
- Top Utility Menu / GNB / LNB / Footer
웹디자인 레이아웃
- 레이아웃의 화면 정렬
- 왼쪽 상단 고정형(Left 정렬)
- 옛날에 해상도가 낮았을 때 주로 사용했던 레이아웃
- 중앙 정렬형(center 정렬)
- 모니터에서 웹 브라우저 크기를 확대하거나 축소해도 언제나 콘텐츠가 중앙으로 정렬
- 수평 수직 중앙 정렬형(정중앙 정렬)
- 전체 화면형
- 중앙 정렬형과 더불어 요즘 가장 많이 사용하는 레이아웃
- Creative한 화면 연출 가능
- Full Background Parallax Scrolling
- 왼쪽 상단 고정형(Left 정렬)
- 레이아웃
- Header
- 모든 페이지에서 일관성 있게 유지
- 로고타입
- 홈으로 이동시켜주는 역할
- 왼쪽 또는 중앙에 넣음, 오른쪽에는 절대 넣지 않음
- 유틸리티
- 글로벌 내비게이션
- Contents
- Footer
- 모든 페이지에서 일관성 있게 유지
- 인포 메뉴
- 저작권
- Header
- 시선의 이동
- F자, Z자
- 게슈탈트 심리학