메뉴 건너뛰기

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 48030
62 ○호랑이에쓰라인作 =// 나모로 홈페이지 만들기 [1탄 노프레임 사이트 만들기] [3] file 호랑이에쓰라인 2006.05.31 7660
61 플래시 커튼효과할때 [10] Dearvil 2002.12.04 7733
60 #07. 홈페이지의 분위기 극대화시키기. [13] Nersion 2003.01.19 7747
59 [제로보드강좌]3강. 제로보드 설치하기 [22] 네찌 2006.12.20 7783
58 [레이아웃] 레이아웃의 수정법과 문서수정 [11] 구루미 2004.12.10 7877
57 [SWIFT 3D] 3D 회전하는 문자 만들기(로고나 배너등으로 응용해보아요~) [6] file ⓘ아이샤이 2003.09.14 7952
56 SWISH - 버튼만들기 8) 장면(Scene)이동하기 [3] file 아메 2003.04.09 7957
55 [SWISH] 잔상효과. [4] file 아메 2003.04.18 7969
54 LECTORA - 평가문항제작(4) drag&drop형 / Hot Spot형 문[제13-1강] [2] 에듀멘 2006.03.14 8090
53 MSN 접속 상태를 내홈페이지 표시하기! [13] 임동일 2003.07.28 8093
52 [아이콘 셋] 퀄리티 높은 아이콘 셋입니다. [3] file jury 2002.07.16 8112
51 [웹사이트만들기]홈페이지 제작전 준비해야 할 것들 file HomeBox™ 2004.04.19 8228
50 [HomePage Step] 홈페이지의 제작단계 [12] ZipShin 2002.12.27 8325
49 [웹사이트만들기]홈페이지 제작 강좌에 앞서 한마디 [3] file HomeBox™ 2004.04.19 8453
48 웹디자이너를 위한 드림위버MX에서 ASP어플리케이션 작성하기.... [11] file 박진현 2003.10.13 8519
47 팝플과 MSN Checker를 이용해서 "지금 누구있지?" 구현하기 [22] @gecko~ 2003.07.09 8613
46 [SWISH]책이 펼쳐지는 효과 [8] file 여어자 2003.05.18 8615
45 LECTORA-평가문항제작(2) 단답형 / 논술형 문제[제11-1강] [1] 에듀멘 2006.03.14 8735
44 [페인터] 귀여운 차이나풍의 소녀 케릭 그리기 [4] file Hwoarang 2005.02.10 8757
43 [제로보드강좌]6-2강. 여러가지 스킨 적용해보기[갤러리 스킨] [29] 네찌 2006.12.23 8769