메뉴 건너뛰기

XE : Xpress Engine




웹디자인 강의

아이프레임홈제작강의)) 01 . 기본디자인 구성하기

안녕하세요 샤르프입니다.
음.. 지금부터 홈페이지 제작 강의?를 시작해보려고합니다.
크하하 이상하더라도; 이해해 주시구요 많이 허접합니다만 ㅠ
제 샤르프방식대로 진행하도록 하겠습니다.

첫번째, 우선 포토샵으로 기본디자인을 구성해야겠죠?
저는 조그맣게 디자인을 하겠습니다. ^^

포토샵 :)  File - New
누르셔서 원하시는 사이즈를 적어주시고 엔터를 눌러주신후
이제부터 자신이 원하는 디자인을 맘껏 찌끄려? 주세요


모두들 자 디자인 짜셨나요?^^
디자인을 짜신후 저장해주세요
그다음 현재 작업하신 창을 닫고 저장하신 파일을 불러오세요

그럼 다음 단계로 넘어가도록 하겠습니다.

이제 이미지를 잘라주셔야 겠죠?
어렵지 않으니까요 모두 잘따라오실수 있을꺼에요?^^~

포토샵에서 아무것도 누르지않은채로
( K ) 키를 눌러주세요  [ 한글을 영문으로 바꿔주신후 눌러주셔야합니다. ]
누르시면 칼모양같은 툴로 선택이 되죠? 슬라이스 툴인데요

이것을 이용해서 이미지를 잘라보려고합니다.
그럼 아래와같이 자신이 원하시는 이미지로 잘라주세요


다 짜르셨으면 저장을 해줍시다
ALT + CTRL + SHIRT + S  를 눌러주세요
그럼 창이 하나뜨죠
그 창위에 상단에  ( 오리지널 ) ( 2 -UP ) ( 4 - UP )
이란 메뉴가 있죠 거기서 4 - UP으로 들어갑니다.

그럼 똑같은 이미지가 네등분 되있죠?
그중에서 이미지 퀄리티가 제일 좋은것으로 선택합니다.
용량이 클수록 퀄리티가 높아지겠죠?
오른쪽 위에 SAVE 를 누르시면 됩니다.

누르시게 되면 조그만 창이 하나뜨는게 OK 눌러주시면됩니다.
이제 저장된 이미지를 확인해봐야겠죠? 저장하실때 지정해주신
폴더로 들어가봅시다.

폴더로 들어가보니 main.html 이란 파일하고
(imges) 란 폴더가 생겼죠?!

어랏! 못보던 폴더인데 무엇이 들어있나 열어보았더니;
아까 잘라주었던 이미지들이 들어있었네요 >ㅁ< 크하하 ㅎ

main.html 이란 파일을 열어보니 아까 잘랐던 이미지들이
테이블속에 박혀?! 있네요 그쵸 이정도 하셨다면 50% 정도
따라오신거에요 ~  시간도 적게 들고 너무 빨라서 놀라지 마세요~

그럼 다음편에선 나모웹에디터에서 main.html 파일을
수정하는 작업을 해보겠습니다. 기대해주세요

Cooming Soon ...
번호 제목 글쓴이 날짜 조회 수
공지 공지 강좌를 올리기전 공지사항을 읽어주세요 [12] Eccen 2004.12.15 48031
142 [힐링포션의 그림판강의] 명암있는 구체 쉽게 그리기 [18] file Heal.P.XERO 2003.02.12 5968
141 SWISH (스위시) 메인화면 설명 [2] file 아메 2003.02.13 4213
140 폰트 글씨 분명히하기? 라고 해야하나.ㅡ.,ㅡ [8] newpy 2003.02.14 4892
139 SWISH 메뉴 설명 file 아메 2003.02.14 3658
138 웹 디자이너가 주의해야 할 주요원리 [13] 깜보 2003.02.16 7606
137 SWISH 주요 기능설정(Movie, Text, Transform, Action)부분 [1] file 아메 2003.02.24 2827
136 [기초] 링크된 레이어 잠그기(Image Ready) 페류 2003.02.27 2753
135 [강좌] Tile Macker (Image Ready) [4] file 페류 2003.02.27 9345
134 스위시 설명 4번째 레이아웃창 살펴보기 file 아메 2003.02.28 3262
133 SWISH Effect 설명 file 아메 2003.03.03 3391
132 SWISH 6번째 설명 [2] file 아메 2003.03.03 3253
131 SWISH 버튼만들기 [2] file 아메 2003.03.14 5544
130 SWISH 버튼만들기 두번째 (테두리 만들기) [2] file 아메 2003.03.18 5799
129 SWISH 버튼만들기 3)image button [2] file 아메 2003.03.18 4092
128 SWISH - Sprite설명 file 아메 2003.03.21 3359
127 [SWISH] 버튼만들기 4) Image버튼 (Sprite추가) [1] file 아메 2003.03.26 12762
126 [SWISH] 버튼만들기 5) Convert to button [2] file 아메 2003.03.28 4399
125 SWISH - 버튼만들기 6)링크걸기(Url) file 아메 2003.04.01 5183
124 SWISH - 버튼만들기 7)무비안에서의 이동 [5] file 아메 2003.04.04 4343
123 SWISH - 버튼만들기 8) 장면(Scene)이동하기 [3] file 아메 2003.04.09 7957