메뉴 건너뛰기

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
2115 [동영상강좌] 제14회차 - Path로 간단한 도형을 그려보자 아이티스터디 2006.02.02 4319
2114 [동영상강좌] 제13회차 - 직접 패턴만들어서 배경꾸미기 [4] 아이티스터디 2006.02.02 6604
2113 [동영상강좌] 제12회차 - 이미지로 패턴만들어서 배경넣기 아이티스터디 2006.02.02 5093
2112 [동영상강좌] 제11회차 - type툴로 달력만들기 아이티스터디 2006.02.02 3839
2111 [동영상강좌] 제10회차 - 칙칙한 얼굴 뽀사시하게 만들기 아이티스터디 2006.02.02 5681
2110 [동영상강좌] 제9회차 - 공개폰트 다운받기 아이티스터디 2006.02.02 5181
2109 [동영상강좌] 제8회차 - 멋내기 글자 만들기 아이티스터디 2006.02.02 5342
2108 [동영상강좌] 제7회차 - 배경이 투명한 이미지를 만들어보자 [1] 아이티스터디 2006.02.02 5147
2107 [동영상강좌] 제6회차 - 테두리 흐릿한 이미지 만들기 아이티스터디 2006.02.02 4094
2106 [동영상강좌] 제5회차 - 이미지 사이즈를 내 맘대로 수정하기 아이티스터디 2006.02.02 5854
2105 [동영상강좌] 제4회차 - 컬러사진을 흑백사진으로 만들어보기 아이티스터디 2006.02.02 2769
2104 [동영상강좌] 제3회차 - 공개 블러쉬소스 다운받아 멋진 이미지 [2] 아이티스터디 2006.02.02 3112
2103 [동영상강좌] 제2회차 - 브러쉬만들기 아이티스터디 2006.02.02 11844
2102 [동영상강좌] 제1회차 - 선택툴 이용해서 개체선택하기 아이티스터디 2006.02.02 4742
2101 [페인트 샵 X] 비오는 효과 [6] file dah 2006.02.01 6086
2100 컬러 와/배색/보색/대비색 등의 웹에필요한색채조율 [수정] [2] piasol 2006.01.26 6795
2099 포토샵 7.0 - 문자 , 그림뒤에 네온효과 만들기, [2] file 한솔v 2006.01.25 12637
2098 아이프레임홈제작강의)) 02 . Main.html 파일 수정해보기 [7] 〃샤르프〃 2006.01.24 6311
» 아이프레임홈제작강의)) 01 . 기본디자인 구성하기 〃샤르프〃 2006.01.24 4389
2096 포토삽 7.0 초간편 홈페이지 만들기 [1] 이재희 2006.01.22 10080