메뉴 건너뛰기

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 48035
2095 포토샵 7.0 - 문자 , 그림뒤에 네온효과 만들기, [2] file 한솔v 2006.01.25 12638
2094 아이프레임홈제작강의)) 02 . Main.html 파일 수정해보기 [7] 〃샤르프〃 2006.01.24 6311
» 아이프레임홈제작강의)) 01 . 기본디자인 구성하기 〃샤르프〃 2006.01.24 4389
2092 포토삽 7.0 초간편 홈페이지 만들기 [1] 이재희 2006.01.22 10080
2091 [동영상강좌]최근개시물 적용방법 [2] 조한철 2006.01.19 2601
2090 [동영상강좌]로그인 스킨 적용법 에관한 강좌 [3] 조한철 2006.01.19 2491
2089 이천일님처럼 제 부족한점 평가좀해주세요 T^T 부탁드려요~ [6] file 호신 2006.01.16 5090
2088 Zboard_Pain#1. 첫강좌 - 간단하게 심플한 버튼 만들기 [3] file Zboard_Pain 2006.01.12 9197
2087 [ 나모웹에디터FX 웹 캔버스 ] 웹캔버스로 디자인하기 … ① [4] file 전세웅 2006.01.06 6224
2086 자막처럼 흐르는 배너만들기; [4] file 혀니ⓥ 2005.12.28 17320
2085 필름과 같은 효과만들기; file 혀니ⓥ 2005.12.27 17563
2084 연필로 그린듯한 효과 [5] file 야호 2005.12.25 13572
2083 간단한 복제하기. [1] 김동현 2005.12.12 5957
2082 *포토샵으로 간단한 글씨효과 나타내기 [펌] [2] 민개 2005.12.11 11266
2081 이미지혹은 글자에 그림자 넣어주기 [9] KantRa 2005.11.18 9770
2080 좌우로 열리는 알림판 [9] file 아킨도 2005.11.18 9815
2079 배경을 깨끗 하게 자르는 또다른 방법~! [16] KantRa 2005.11.18 12737
2078 [illustrator] 동영상강좌 / 삼색 태극문양 만들기 / 기초부분 [1] 다모폐인 2005.11.15 5920
2077 포토샵 7.0 - 25. 포토샵+드림위버+제로보드의 연동 [14] 서기 2005.11.11 15985
2076 포토샵 7.0 - 24. 싱싱해 홈페이지 제작하기 [18] 서기 2005.11.11 20976