making a web layout (with images)

JM
Posted By
Jason Moe
Jul 17, 2004
Views
199
Replies
5
Status
Closed
I’m trying to make a web page layout using Photoshop Elements 2. I’m wanting to make the whole layout with borders and other graphics entirely within Elements and then export all of the images as separate images so that they are pieced together seemlessly when viewing them in a web browser. In other words, instead of making each individual picture and then trying to get them to align together correctly using HTML, I was hoping that PE2 had a way of automating this. I hope that I explained it well enough for you to understand what I’m trying to do. Can Elements 2 do this?
Related Tags
image layout

Master Retouching Hair

Learn how to rescue details, remove flyaways, add volume, and enhance the definition of hair in any photo. We break down every tool and technique in Photoshop to get picture-perfect hair, every time.

MM
Mac_McDougald
Jul 17, 2004
No.
You’re talking about slicing a big image into lots of little ones, then putting them back together with HTML table.

full Photoshop/ImageReady will do it.

This technique, IMNSHO, is vastly overrated, does not speed up download much, sometimes stalls entirely, etc. Plus, you’re just adding SO many bytes that could better be accomplished with combo of images and real text instead of all image.

Plus plus, big sliced images just look like hell loading, I think.

Mac
JF
Jodi_Frye
Jul 17, 2004
yup, I agree.

placing ‘ HEIGHT/WIDTH ‘image sizes in your code also speeds loading.
JM
Jason Moe
Jul 17, 2004
Thanks for the info. I was wondering how the larger companies programmed their websites which have tons of smaller images pieced together and didn’t think that they mapped them all out into a table by hand.
ML
Mark_Levesque
Jul 17, 2004
Most of the better websites make use of cascading style sheets, which allow you to place images where you want them (among other useful properties). There’s a multiplicity of information on the web including these two resources which I’ve found helpful:

<http://www.pageresource.com/dhtml/indexcss.htm>

<http://www.w3.org/MarkUp/Guide/Style>
GD
Grant_Dixon
Jul 17, 2004
Jason

I tend to agree with Mac on this one but there are some uses for slicing.

While it takes longer to down load a parts compared to the sum it may be beneficial to people with slow hook-ups to at least see things happen. But Mac has pointed out often a part graphic will not get downloaded and this is very annoying. Giving you client something to look at while the download takes place can be address by progressive jpgs or gifs.

If you are doing this to have a part of you image clickable you might consider ismap instead.

If you want to have part of you image as a roll over this can be done with CSS and/or java script but the is on area were I would also considering slicing an image.

If you still want to do this sort of thing the tool is included with other graphic software Photoshop and PaintShop Pro to name two but you can also get it as a free down load. It has been a long time since I used one of these programs but if my memory hasn’t failed me I think that CoffeeCup (PC Stuff) offers a free tool for this. Well not only that CoffeeCup (PC Stuff) has lots of free stuff to help the web designer out.
http://www.coffeecup.com/freestuff/ If you are a Mac user or just want to find out other PC freebees go to http://www.tucows.com and do a search.

Grant

MacBook Pro 16” Mockups 🔥

– in 4 materials (clay versions included)

– 12 scenes

– 48 MacBook Pro 16″ mockups

– 6000 x 4500 px

Related Discussion Topics

Nice and short text about related topics in discussion sections