아래의 글은 광주서광교회 홈페이지 제작회의를 위한 브리핑 자료입니다.
한 군데서 사용할 자료로는 아깝다는 생각이 들어 포스팅 합니다.
여기저기서 짜집기 하고 제 생각도 포함되어있는 글들이니
그냥 읽고 많은 피드백 주시길바랍니다 :)
한 군데서 사용할 자료로는 아깝다는 생각이 들어 포스팅 합니다.
여기저기서 짜집기 하고 제 생각도 포함되어있는 글들이니
그냥 읽고 많은 피드백 주시길바랍니다 :)
페이지 스케치에 관한 내용입니다.
홈페이지의 페이지스케치는 크게 2가지로 나뉘는데
하나는 메인페이지 즉 홈페이지에 처음 들어갔을때 나오는 페이지
그리고 서브페이지 홈페이지에서 세부페이지를 열었을때 나오는 페이지
이렇게 메인과 서브로 구성됩니다.
메인페이지의 예를 들자면
1. http://hanbitschool.net/ 한빛고등학교 메인페이지
2. http://sanmaeul.org/ 산마을고등학교 메인페이지
서브페이지의 예를 들자면
1. http://hanbitschool.net/sub_01_01.htm 한빛고등학교 서브페이지 (학교헌장)
2. http://hanbitschool.net/community/zboa ··· ohanbitt 한빛고등학교 서브페이지 (사진으로 보는 한빛)
3. http://sanmaeul.org/sub_01_01.htm 산마을고등학교 서브페이지 (교육이념)
4. http://sanmaeul.org/bbs/zboard.php?id=notice 산마을고등학교 서브페이지 (공지사항)
메인페이지와 서브페이지의 개념적 디자인은 종이하나 펴고 펜하나 들고 머리만 조금 맞대면 금방 끝납니다
그 일을 하기 위해 조금 설명하자면
모든 페이지에는 메인 메뉴와 카피라잇 그리고 로고가 들어갑니다
그리고 메인 페이지에는 최근게시물 ( 글 또는 사진 ), 퀵메뉴, 배너, 아웃로그인, 하단메뉴, 최상단메뉴 등 많은 컨텐츠가 들어가고
서브 페이지에는 서브메뉴, 현재위치 알림, 그리고 메인 컨텐츠 ( 게시판, 컨텐츠, 어떤 폼 등 ) 이 들어간다.
<한빛고등학교 메인 컨텐츠 디자인 예>
<한빛고등학교 서브페이지 컨텐츠 디자인>
위의 배경 디자인이 아닌 빨간색 라인 즉, 페이지 스케치 라는 것은 홈페이지 각 페이지의 골격을 그리는 작업이다.
보통 서브페이지는 위와 비슷한 편이며 메인페이지는 디자인을 중시하고 중요한 부분을 부각시키는 편이 강하다.
http://www.freegine.com/new_down/down_ ··· p%3Bcpid=
위의 링크를 들어가면 많은 웹디자인들이 있다. 도용해선 안되지만 구조를 참고할수는 있을듯 싶음.
위와 같이 디자인을 하고나면 제작자에게 전해줄 모든 자료는 완성된다.
웹디자이너와 웹프로그래머가 위의 내용을 가지고 전체적인 틀을 만들고 그렇게해서 만들어진 프로토타입을 가지고 다시한번 미팅을 하게되며 수정작업을 거친후 세부적인 컨텐츠 내용을 넣게된다.
90% 이상 만들어진후에 전체적인 홈페이지를 놓고 한번더 미팅을 하여 전반적인 수정작업을 거친후 홈페이지 오픈을 하게된다.
