Advice Needed On How to Convert PSD Template to HTML

thefreelancesquad · 05-11-2009, 08:27 PM

Hello, does anyone have anysuggestions on how to covert a PSD Template to HTML? What tools do you use or recommend?

pavondunbar · 05-11-2009, 10:24 PM

Hi there...

To convert a PSD to HTML, you must do the following:

1) Use the Slice Tool in PS to slice the PSD file. Each file you slice will be saved as an image and stored in its own folder.

2) Once you are done slicing, go to FILE-->SAVE FOR WEB AND DEVICES and save the PSD as HTML with images. Make sure you have JPG set to maximum.

3) Open Dreamweaver or your favorite program to make the changes you need.

4) Once you are done, upload the image folder and the new HTML file to your server.

It seems simple but is a little complicated. If you need a tutorial, I have a 10 video tutorial on how to do it step by step.

Let me know and I'll send it to you...free.

Hope this helps and good luck with your endeavors.

Pavon

rocketsites · 05-14-2009, 10:34 AM

Slicing and exporting the graphics from photoshop as html is probably the best and fastest way if you are a complete beginner. But it is by far not the best way to produce a good quality html template especially since it has no concept or ability to produce a "clean" template using semantically correct css, with the correct use of background images, header tags, etc. Instead it basically creates static images for eveything which is not ideal because:

it creates more code that is necessary
it creates images for things that dont need to be images (for example, solid background colors and text)
does not edn itself to scalability (ie when you go to add more pages to your site)

You will never beat hand coding of the psd template by a person experienced in css and html. My advice is to learn how to do this or go to a service that specializes in PSD to XHTML/CSS templates. Just google "psd to xhtml".

TheCren · 05-14-2009, 11:09 PM

That's an interesting process. Thanks, Pavon!

thefreelancesquad · 05-15-2009, 04:28 PM

Pavon, could you send the free video tutorials. I can't PM at this point, but contact me about the videos.

The Freelance Squad

05-11-2009, 08:27 PM	#1
thefreelancesquad Active Warrior Join Date: Mar 2009 Posts: 36 Thanks: 0 Thanked 0 Times in 0 Posts Social Networking	Advice Needed On How to Convert PSD Template to HTML Hello, does anyone have anysuggestions on how to covert a PSD Template to HTML? What tools do you use or recommend?

05-11-2009, 10:24 PM	#2
pavondunbar Casino Extraordinaire! Join Date: Dec 2008 Location: Long Beach, CA Posts: 332 Thanks: 99 Thanked 48 Times in 39 Posts Social Networking Contact Info	Re: Advice Needed On How to Convert PSD Template to HTML Hi there... To convert a PSD to HTML, you must do the following: 1) Use the Slice Tool in PS to slice the PSD file. Each file you slice will be saved as an image and stored in its own folder. 2) Once you are done slicing, go to FILE-->SAVE FOR WEB AND DEVICES and save the PSD as HTML with images. Make sure you have JPG set to maximum. 3) Open Dreamweaver or your favorite program to make the changes you need. 4) Once you are done, upload the image folder and the new HTML file to your server. It seems simple but is a little complicated. If you need a tutorial, I have a 10 video tutorial on how to do it step by step. Let me know and I'll send it to you...free. Hope this helps and good luck with your endeavors. Pavon
	$1,000,000+ wagered daily. 2,500+ games. 30+ prestigious online casinos. 1 site. Learn Kickass Poker Secrets and Beat The Online Casinos!

05-14-2009, 10:34 AM	#3
rocketsites Warrior Member War Room Member Join Date: Mar 2009 Posts: 6 Thanks: 0 Thanked 0 Times in 0 Posts	Re: Advice Needed On How to Convert PSD Template to HTML Slicing and exporting the graphics from photoshop as html is probably the best and fastest way if you are a complete beginner. But it is by far not the best way to produce a good quality html template especially since it has no concept or ability to produce a "clean" template using semantically correct css, with the correct use of background images, header tags, etc. Instead it basically creates static images for eveything which is not ideal because: it creates more code that is necessary it creates images for things that dont need to be images (for example, solid background colors and text) does not edn itself to scalability (ie when you go to add more pages to your site) You will never beat hand coding of the psd template by a person experienced in css and html. My advice is to learn how to do this or go to a service that specializes in PSD to XHTML/CSS templates. Just google "psd to xhtml".
	Michael Judkins ******************************** Make Money From Home Doing Voice Overs Find and Advertise Garage and Estate Sales**

05-14-2009, 11:09 PM	#4
TheCren HyperActive Warrior Join Date: Apr 2009 Location: Pittsburgh, PA Posts: 285 Blog Entries: 1 Thanks: 20 Thanked 20 Times in 19 Posts Social Networking	Re: Advice Needed On How to Convert PSD Template to HTML That's an interesting process. Thanks, Pavon!
	Niche Marketing Tools and Info

05-15-2009, 04:28 PM	#5
thefreelancesquad Active Warrior Join Date: Mar 2009 Posts: 36 Thanks: 0 Thanked 0 Times in 0 Posts Social Networking	Re: Advice Needed On How to Convert PSD Template to HTML Pavon, could you send the free video tutorials. I can't PM at this point, but contact me about the videos. The Freelance Squad