PDA

View Full Version : Help with photoshop and HTML guides.


fivecheebs
3rd March 2005, 13:05
Now, let me firstly say, i am so new at web design you can still smell the plastic wrapper! ;)

Im teaching myself from this book "Advanced web design" (its more of a phat magazine really). Its starts by telling you to lay a page out in PS which i have done, then set some guides ... easy then it says this...

Understand the table
To create the graphic assets for our design we need to understand how it will be converted into an HTML table. Open the "home.psd", and "page.psd" files from the book CD to see the table structure clearly marked as a separate layer. Replicate this on your own version Now i can see a separate layer on said files and if i remove the all other layers from view im left with the guides (can allways be seen) and a layer with red boxes outlining the separate parts of the page.

What it doesnt tell you is HOW to replicate the red boxes around each element! :rant: they arent just drawn boxes, its something else?

Please help?

fillip
3rd March 2005, 15:06
Well, I'm not quite with you in regard to the red outlines for each element. I presume that you're working in PS at this point, and the red lines are in addition to the guides which show where the image is chopped up?
Don't s'pose you can post a screen grab showing the image opened up in PS could you?

But using a table to control layout of the images on the page is so passé, as Star will tell you CSS is the way to go.

Starbuck3733T
3rd March 2005, 15:23
I believe those are called 'slices'.

and you took the words right out of my mouth.

fivecheebs
3rd March 2005, 15:25
But using a table to control layout of the images on the page is so passé, as Star will tell you CSS is the way to go. haha, git :p i just knew you / star would say something along those lines. FWIW, i think the table then helps create a CSS but i havent got to that bit of the book yet lol (i read through it about 3 or 4 months ago but dont accurately remember what it asks you to do), i think its coming up once i get this table layed out.

Yes im still in PS now, going to use dreamweaver immenantly. It may be that these red lines are slices ... what do you reccon? (ill still post a screenie if you like but im going to have a go at it). I wish the author of this book had joined up thinking! :rant:

ahh ty star :p posted at the same time and confirmed my suspisions.

Maybe when i have done this you can help educate me in the way of the CSS :h34r: or at least a better way of doing what im doing lol

Starbuck3733T
3rd March 2005, 15:50
Sadly, my from scratch CSS layout skills are not masterful... yet.

There's a book called "HTML Utopia: Designing without tables" published by SitePoint that is AWESOME in this regard.

fillip
3rd March 2005, 17:41
I believe those are called 'slices'.
I thought they may have been but mine appear as orange lines not red. http://wizdforums.co.uk/images/smilies/unsure.gif

To be fair, for a newbie, using a table to align a bunch of sliced images is far from being a cardinal sin, I've still used that method with my latest stuff simply because PS and ImageReady do all the leg work for you and I couldn't be arsed to mess with it. http://wizdforums.co.uk/images/smilies/happy.gif