메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의

아 .. -_- 제 홈페이지를 만들다가 갑자기 심각한 고민에 빠져버려서 -_-;;;;;
강좌를 쓰려고합니다.

#02. 개인홈페이지를 구성해보자.

개인홈페이지의 경우에는 정말 빠른 시일내로 홈페이지를 구성하고 완성하게 될 수 있습니다.
음.. 그렇다고 초 단시간 홈페이지가 된다는 소리는... 아니지요;

일단 개인홈페이지나 다른 어떠한 홈페이지도 주제를 먼저 정합니다.
주제만 정해버리면 간단하게 홈페이지를 구성하게 될 수 있는게 바로 개인홈페이지입니다.

가상적으로 여기서는 돌피인형 홈페이지를 만든다고 하고 구성을 해나가겠습니다.

1. 일단 돌피인형이 주제가되므로 모티브가될만한 사이트들을 검색해봅니다.
그리고 거기서 나오는 공통적인 메뉴바들은 체크를 해둡니다.
각자의 홈페이지마다 풍기는 느낌이 있을겁니다.
조잡하거나 , 깨끗하거나 등등... 'ㅡ'a

일단 위의 사항들을 꼼꼼히 체크를 해둡니다.
그리고 자신의 툴사용 능력을 최대한 사용할수있는 범위가 어디까지인지는 이해하고 있어야합니다.

2. 분위기를 정합니다.
돌피인형은 종류별로 다양하지요. 싸늘하거나 밝거나 귀엽거나...
저같은 경우에는 싸늘한 ;;;;; 것을 매우 좋아하기 때문에 싸늘한 분위기를 택하게됩니다.

분위기를 정했다면 천천히 구성을 할 단계가 되는겁니다.

2-1. 전체적인 색상 [ 색상톤 : 그레이 , 화이트&블랙 ,등등;;; ]
이렇게 되면 그레이톤이나 화이트&블랙톤이 싸늘한 분위기에 알맞을 껍니다.

이런 방식으로 자신의 홈페이지가될 전체적인 색상을 선택하게 됩니다.

2-2. 음악을 넣게되면 알맞은 분위기로;;
요즘에 보면 음악을 넣는 홈페이지들이 상당히 많아지고 있지요 'ㅡ'?
음악도 분위기를 정해주는 요소입니다.

3. 대강의 스케치를 시작합니다.
스케치에 필요한것들이요... 음 .... 어디보자;;

index 부분과 main 이 될부분정도면 되겠네요.
이부분에서 레이아웃을 잘 짜둬야합니다.
자신이 찾을 그림들. 그리고 그림의 위치등을 선정해야 하거든요.
분위기를 설정했으니까 그 분위기에 맞는 구도를 잡아둬야해요.

4. 메뉴정하기.
쓰잘때기 없어보여도 메뉴를 정하는것도 구성을 해둬야하는 부분에 꼭 필요한 부분입니다.
레이아웃을 짜면서 같이 생각하는것도 좋은 방법이겠지요.. [ 개인홈페이지에서는 별로 상관없습니다만은..
다른류의 홈페이지를 만들때는 메뉴를먼저정하기도 합니다.. 저는 메뉴를 나중에 정하는 성향이 강해서;; ]

ex) Profile / 주인장 소개
Tutorial / 포토샵강좌 , 나모강좌 , html 팁.. 등등 'ㅡ';
뭐 이런식으로 짜나가야죠; 큰 메뉴 -> 작은 부속메뉴.

기억해두세요 큰 메뉴 -> 작은 부속메뉴. -_-;;;; 광고같다는;;

5. 이미지 만들기.
저같은경우에는 거의 모든작업을 포토샵과 일러로 해버립니다 -_-;;; 대부분의... 사람이 아닐까;;
라고해도 되겠지요 ?? [ 플래쉬를 주로하시는 분들은 예외로 해두겠습니다;; 죄송합니다 ]
자신의 분위기에 맞는 이미지들을 찾아뒀겠지요?
그렇게 되면 스케치를 해둔곳에 알맞은 사이즈와 함께 여러가지 작업들을 해줍니다.

아마 3 , 5번을 계속 되풀이하게될 겁니다.
스케치에 대강맞게 만들었다 싶어도 막상 완성하고나면 어설프거나 안어울리다고 생각이들거든요.

6. 홈페이지를 최종적으로 구성합니다.
이부분이 가장 복잡할듯 하네요;;

6-1. index부분에 알맞게 레이아웃팅해줍니다. [ 스케치참조를하면서.. ]

6-2. 전체적인 구조 [ 각 페이지마다 구조가 다른것은 예외로 합니다. ]
모든 페이지의 모티브가될 페이지를 구성합니다.
[ 노 프레임도 제외로 해두지요;;; ]
프레임을 나누게되겠지요?
프레임을 나누는 순서도 대강대강 하시면 안된다는것을 나중에가시면 뼈저리게 느끼기전에
프레임도 하나하나 잘 생각하시면서 나누어 줘야합니다.

6-3. 사이트메뉴에 링크걸기.
링크방법이 여러가지가 현재 웹에서 나돌아댕기구있습니다.
요즘에는 거의 밑줄을 없애는게 기본이되어버린것처럼 느껴질만큼 깔끔하게 링크를 걸어야겠지요.
자신에 맞는 방법으로 링크를 걸어주면 전체적인 구조도 일단락되는겁니다.

마지막. 혹시나해서 적어두는 작은 팁같지도 않은 팁들.

아 난 미니사이트를 만들어서 보드를 사용하니까 너무 조잡해져요;
->> 이런경우에는 주로 새창을 띄우게 됩니다. 적당한 사이즈로 띄워주면 되겠지요;;

나도 XXXXXXX 님처럼 멋지게 만들고싶은데 잘 안되는데요..?
->> 처음부터 너무 멋지게는 안되는거랍니다. 그리고 자신만의 스타일을 익혀두는것도 중요합니다.

아... 다른것들은 다음에 적어두겠습니다 죄송합니다 ㅠ_ㅜ;;
배가고파....서;; 철푸덕
번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48027
182 플래시,동영상 목록만들기 윤선미320 2007.12.01 11613
181 테두리가 둥근 아이프레임 홈페이지 만들기(나모편) [2] 로베 2004.05.10 11597
180 미니 홈페이지를 만들자 #2 [6] Eva010 2004.05.25 11402
» [ All User? ] #02. 개인홈페이지를 구성해보자. [8] Nersion 2003.01.13 11396
178 (나모) 그림에 마우스 대면 아래에 서브메뉴 뜨게 하기 [30] Probe 2003.02.06 11329
177 [웹사이트만들기]매핑테이블을 만들어 보세요 [13] file HomeBox™ 2004.04.19 11303
176 저작도구 템플릿- 5백종류 네비게이션버튼 포함 file 윤선미320 2011.06.07 11202
175 [참조] 웹폰트 사용하기.. [2] mo2ni 2002.03.06 11049
174 [특보] 웹폰트 만들기.. [18] mo2ni 2002.03.06 10991
173 [웹사이트만들기]사용자를 위한 디자인 file HomeBox™ 2004.04.29 10875
172 [Swishmax] 라벨을 이용하여 메뉴 만들기 [7] file 세나맘 2004.03.09 10616
171 교수-학습 자료 제작및 활용 강의교재 file 김종판 2007.11.13 10483
170 [제로보드강좌]9강. 회원관리/외부로그인 [45] 네찌 2007.01.04 10455
169 [제로보드강좌]12강. 최근게시물[이미지] 뽑아내기 [51] 네찌 2007.01.19 10290
168 [웹사이트만들기]화면설계와 구성요소 上(스터디에 사용한 폰트 설정법 추가) [5] file HomeBox™ 2004.05.05 9956
167 [ico] 즐겨찾기 아이콘 만들기 [13] file yami 2002.03.16 9680
166 페인터로 그림그리기..ㆁ [16] file 김태현 2003.12.01 9677
165 [제로보드강좌]10강. 최근게시물 뽑아내기 [42] 네찌 2007.01.07 9538
164 [강좌] Tile Macker (Image Ready) [4] file 페류 2003.02.27 9345
163 본메뉴에 마우스오버스시 서브메뉴 나타나기(허접강좌ㅡㅡ;;) [5] 박은석 2002.09.18 9233