PDA

View Full Version : How To Make HTML/Web Layouts In Photoshop?


robinhood
09-28-2007, 10:21 AM
I have downloaded some free templates (http://freetemplates.webdesigningcompany.net/) on the net and it in psd file. How do I convert it to html and how could I make an html/web layout in photoshop like the one I got on the net. I believe psd file is a normal standard file for templates

bcarl314
09-28-2007, 02:26 PM
brianj is our resident photoshop guru, I'm sure he'll be able to post some info on this.

brianj
10-05-2007, 11:37 PM
Robinhood, it's quite easy to create HTML from a Photoshop file.
Look for the slice tool as shown...

http://www.540interactive.com/photoshop_slice_tool.gif

You create HTML tables by creating boxes using your slice tool around your desired graphic elements.

Photoshop will then number each area and recognize that as a slice.

Go ahead and Save for Web. Click save and at the bottom of the dialog box it will give you options to save HTML and IMAGES...

http://www.540interactive.com/photoshop_html_slice.gif

A folder will be created call images along with the HTML file.

That should do it!

Admin
10-31-2009, 07:29 PM
Photoshop has a lot of features like being able to slice up a web design into html. The best way to get a strong overview of Photoshop's features is to watch these instantly viewable video tutorials on the basics of Photoshop. Reading the manual to learn something new in photoshop takes a long time. Watching someone else do it and narrate what they're doing as they perform the steps is the fastest way to learn.

Here is the link to the best site I've found to learn the basics of photoshop (http://www.udm4.com/ccount/click.php?id=5)

jubach
11-22-2009, 02:15 AM
i am not yet familiear in using the slice tool. is there a free tutorial site that gives detailed information?

vinyl-junkie
11-22-2009, 03:58 PM
Have you searched Google (http://www.google.com/search?q=photoshop+tutorial+slice&sourceid=navclient-ff&ie=UTF-8&rlz=1B3GGGL_enUS331US331)? There are lots of free ones. Several page one results from the above link are video tutorials.