|
포토샵 파일을 HTML/CSS로 변환하는 강좌 모음 |
웹디자이너와 그래픽디자이너는 유사한 툴을 사용하여 컴퓨터로 창작물을 만드는건 비슷하지만 HTML과 CSS에 대한 퍼블리싱 능력에서 가장 큰 차이점을 보입니다. 그만큼 웹디자이너에게 HTML은 필수이자 항시 노력해야하는 요소인데요. 자신이 만든 디자인을 실제로 구현을 못한다면 그것만큼 난감한 경우도 없지요.
오늘은 웹디자이너가 포토샵으로 만든 디자인을 HTML이나 CSS로 변환하는 강좌를 소개해 드리겠습니다. 강좌를 통해 좀더 효율적으로 코딩하고 레이아웃을 실현하는 방법을 배울수 있습니다.
모든 강좌는 영어로 제작되어 있어서 조금 난감한 부분이 있는데요. 구글 크롬을 설치하여 자동 번역 기능을 사용하면 어렵지 않게 강좌를 보실수 있습니다.
Convert Your Product Landing Page From PSD to HTML
이 강좌에서는 PSD를 HTML, CSS 프레임 워크, 자바스크립트를 사용하여 변환하는 방법을 배울수 있습니다.
Sleek Coming Soon Page Design
이 강좌는 홈페이지 오픈 예정을 알리는 페이지를 만드는 내용입니다. 1부. 2부로 나눠져 있으며 1부는 포토샵을 이용하여 디자인을 만드는 과정을 배울수 있으며 2부에서는 만들어진 PSD를 이용하여 HTML로 변환하는 방법을 알수 있습니다.
Converting a clean magazine-style PSD template to HTML/CSS
이 강좌는 PSD를 HTML로 변환하는 방법에 대해 몇가지 팁과 조언을 담고 있습니다. 구체적인 설명 보다는 전반적인 흐름을 배우기 좋은 내용입니다.
Designing a highly-professional website, from the sketch to the code
이 강좌는 기업형 비지니스 홈페이지를 제작하는 방법에 대한 강좌입니다. 포토샵 과정과 HTML 변환 과정으로 나눠서 설명해주고 있습니다. 강좌를 위해 PSD + HTML / CSS를 다운 받을수 있어서 쉽게 접근하실 수 있습니다.
Code an Awesome Minimal Design from PSD to XHTML & CSS
이 강좌는 CSS3와 웹 개발자에 제공하는 새로운 기능을 사용하여 웹페이지를 만드는 과정을 담고 있습니다.
Code a Photoshop File to a Working Website
PSD를 HTML로 코딩하는 방법을 배울수 있는 강좌입니다. 빠르고 쉽게 페이지를 코딩하는 방법을 알수 있으며 강좌에 필요한 PSD, CSS 파일을 다운 받을수 있습니다.
How to Code a Grunge Web Design from Scratch
1부, 2부로 나눠져 있으며 1부는 포토샵을 이용하여 그런지 테마의 웹 레이아웃을 만드는 방법을 설명하고 있으며 2부는 HTML과 CSS로 변환하는 방법을 배울수 있습니다.
Coding The PSD File Into CSS and HTML
이 강좌에서는 HTML / CSS 코딩, PSD 분할 및 웹사이트 성능을 향상시키기 위한 몇가지 팀을 소개하고 있습니다.
Code a Modern Design Studio from PSD to HTML
현대적인 디자인의 스튜디오 PSD 템플릿을 XHTML / CSS 코드로 변환하는 과정을 담은 강좌입니다.
Converting Dezign Folio From PSD to HTML
이 강좌에서는 단계별로 PSD를 HTML로 변환하는 방법을 알 수 있습니다. CSS 프레임 워크, 자바 스크립트를 사용하여 레이아웃을 생성하는 방식으로 한단계 진보된 과정을 배울수 있습니다.
Convert a 3D Portfolio Dark Layout From PSD to HTML
크로스 브라우저 호환 및 동적 레이아웃에 일부 CSS 스타일과 자바 스크립트를 사용하여 레이아웃을 생성하는 방법을 배울수 있습니다.
Coding a Band Website Created in Photoshop
이 강좌에서는 PSD를 깔끔하게 XHTML / CSS 코드로 설정하는 방법을 학습할 수 있습니다.
Create a lovely textured web design from Photoshop to HTML/CSS
이 강좌에서는 좋은 질감을 사용하여 멋진 웹 사이트 레이아웃을 실현하는 방법을 배울수 있습니다.
Create a Chalkboard Style WordPress Layout
이 강좌에서는 칠판 스타일의 워드프레스 PSD 레이아웃을 XHTML로 변환하는 방법을 학습할 수 있습니다.
'웹싸이트 디자인강좌' 카테고리의 다른 글
| [ 이벤트 팝업소스 ] 활용도 높은 웹싸이트 전체화면 레이어 팝업 소스 (31) | 2012.08.22 |
|---|---|
| [ 플래쉬 무료 프로그램 ] 1분만에 플래쉬를 제작할수 있는 초간단 플래쉬 무료 프로그램 (0) | 2012.05.15 |
| [ 포토샵 타이포그래피 ] 타이포그래피 폰트 조합공식 기초강좌 (14) | 2012.03.14 |
| 웹디자인에서 자주쓰이는 리본만들기 (원본소스 포함) (12) | 2012.02.07 |
| 홈페이지 인터페이스 정말 쉽게 만들어보자 (31) | 2011.12.28 |
