February 19th, 2008
Converting Photoshop Web Template File To HTML/XHTML/CSS Web Page File Video Tutorial
In these videos tutorial, you will learn how to convert photoshop web template file in .PSD to HTML file and Css file.
These videos are form css-tricks.com. The video tutorials have 3 parts and they’re great video tutorials, you’ll learn how to convert file from photoshop to HTML and Css file and how to code Css file at the same time.
The videos tutorials are in quicktime format
Video tutorial 1 (10:10 minute)
Video tutorial 2 (17:10 minute)
Video tutorial 3 (31:53 minute)


March 11th, 2008 at 12:11 am
This is Awesome, thxs for ur sharing, thx u.
March 22nd, 2008 at 7:07 am
Superb series – very clear and some excellent tips and tricks.
Also a very good tutorial on HTML and CSS.
April 21st, 2008 at 11:28 pm
[...] my Previous post Converting Photoshop PSD To XHTML/CSS Video Tutorial (Part 1) from Css-trick.com, now Css-tricks released new video tutorials about this technique again because [...]
June 4th, 2008 at 1:04 pm
Brilliant!
July 21st, 2008 at 4:34 am
[...] Converting Photoshop Web Template File To HTML/XHTML/CSS Web Page File Video Tutorial “In these videos tutorial, you will learn how to convert photoshop web template file in .PSD [...]
August 26th, 2008 at 7:13 am
Great videos!
August 29th, 2008 at 3:15 am
very nice tutorials thanks for sharing
September 12th, 2008 at 3:28 pm
[...] 7- Converting Photoshop Web Template File To HTML/XHTML/CSS Web Page File Video Tutorial [...]
September 17th, 2008 at 2:14 pm
Thank u soooo much for posting these videos. Some people are able to learn better if they can actually see the work being done (visual learners) instead of just reading it. I am one of those people.
Thank you for taking the time to do this and share because I know a lot of work went into doing this tutorial.
October 16th, 2008 at 10:31 pm
awesome tutorials mate, got through your site while surfing google, and its an excellent one.
October 20th, 2008 at 5:20 am
Dude,where have you bee before . . .
Great tuts,very clean code,i am impressed.
Hope you will make more of these,they are fun to follow.
Perhaps for a darker photoshop template,with more blocks,i don`t know,perhaps some kind of a video or nusic template.
Like i sad,just great.
Thanks for sharing.
Respect
Edis
October 28th, 2008 at 11:21 am
AWESOME !!! I have been searching this kind of video so long and today I am very proud manage to download these awesome..
BRILLIANT…and thank you so much for sharing with us
November 9th, 2008 at 1:52 am
its a very kind of you to share this tutorial to people who need this kind of thing, live in front of my eyes, awesome !!!
thanks for sharing bro…
December 10th, 2008 at 1:24 pm
It’s the first time I give a feedback, but this tutorial was so professional that I have to change my bad habit! Clean, very easy to follow, and up to the point!
It’s not my business but it’s the first time I can say that I really understand the background of css and index files and the logic behind them. Even I worked on several web projects, and made professional photoshop layouts for them, but never feel the need to see it deeper.
Congratulation and see more!
Thank you!
December 22nd, 2008 at 3:34 pm
Great again! Thanks.
March 13th, 2009 at 11:57 pm
[...] 7- Converting Photoshop Web Template File To HTML/XHTML/CSS Web Page File Video Tutorial “In these videos tutorial, you will learn how to convert photoshop web template file in .PSD to HTML file and Css file” [...]
June 3rd, 2009 at 4:31 pm
You’re freakin awesome. I’m a web programmer who needed to learn the design aspects quick. I found so many worthless tutorials on the internet, including some of the ones from Microsoft. I found yours and its excellent. Most tutorials on the internet dont provide read world scenarios but yours does. Thanks a million. You’re one great person and if anyone tells you different .. THERE WRONG.
June 16th, 2009 at 1:02 pm
Wow, I’m with Gabor….have never left a comment either.
Wonderful tut! The detail that you go into really helps to understand the small yet important points.
Thank you so much for taking the time to share!
July 21st, 2009 at 7:12 pm
Most excellent. Job well done. It was a little rough but you expanded on quite a bit of css. Plenty of room for improvement, but you’ve given quite a bit info and lecture to allow others to follow up on their own, with your lesson.
-Hope to see more!
July 22nd, 2009 at 3:56 pm
Everyone here who watched your podcasts and left some comments say the same : your tutorials are great, very pedagogical and yet funny. So thumbs up for you Chris, thanx a lot for sharing your knowledge with us, and thanx the web and the open state of mind for bringing this knowledge to everyone. That’s how we all get better.
November 8th, 2009 at 3:48 am
Thank you this video
November 26th, 2009 at 2:16 pm
“Great compilation! Thanks a lot for putting it all in one place, but there is another one to add to your list.
http://www.xhtml-css-code.com/html/things-to-remember-while-coding-a-website-to-make-it-search-engine-friendly
Though, not exactly a psd to html conversion article, but one must keep these tips in mind while coding a PSD into search engine as well as user friendly web layout.
“
November 27th, 2009 at 1:29 am
Thanks for your help, thanks a lot..
December 5th, 2009 at 12:45 pm
[...] 0: Video: Converting Photoshop Web Template File To HTML/XHTML/CSS Web Page File Video Tutorial [...]
December 6th, 2009 at 2:44 am
Very nice explaining video, though I know html and css, I now get the idea how to analyze and convert images to html layout.
December 17th, 2009 at 3:43 am
[...] Converting Photoshop Web Template File To HTML/XHTML/CSS Web Page File Video Tutorial “In these videos tutorial, you will learn how to convert photoshop web template file in .PSD [...]
January 9th, 2010 at 3:46 pm
This is a good video series on slicing, very well done. You’ve inspired me to create some video tutorials myself. Unrelated: I’ve always admired the simplicity of the Mac’s Text Mate, it’s so sad there is no quality equivilent for PC. (Though I suppose it is just another reason to buy a Mac).
April 7th, 2010 at 7:44 pm
Thank you this video..
April 15th, 2010 at 11:56 am
Well designed template thanks for sharing it.
April 16th, 2010 at 1:17 pm
WoW its a very good tutorial for HTML and CSS.
see aslo this.its a professional site for HTML and CSS. tutorials
http://www.tutorials99.com
July 20th, 2010 at 10:01 pm
Very nice explaining video, though I know html and css, I now get the idea how to analyze and convert images to html layout.
December 10th, 2010 at 12:43 am
Congrats for the post. This is what i am looking for because i need some web layouts ideas.