Help me slice this layout

[slayer202]

I have a layout made in photoshop I want to slice. I am not sure exactly what the best way to do it is.

here is the layout
http://www.reggin.net/sigs/other/at.jpg

Here is what I am thinking:
Since I don't think most people will have the font I used, start with slicing the header, along with each of the menu links.
Next the 2 images.
Next the 3 little links on the bottom of the page

Here is where I get a little confused

The grey empty menu area on the right side(will delete this and just use background color on the cell). Or should I slice a section of it to make into a table so I can code it to expand if needed?

Then I think I need to slice out each of the grey lines running down the layout. How do I code this later to expand down the page if the main content area expands? Same with the "border" lines on the sides of the layout. I am going to change them because they look crappy.

Next is the content box itself. Do I slice the very top, the very botton, and just 1px of the middle area to expand? Of course I also have to slice the little corner pieces. The text there I am just trashing obviously.

Am I missing anything? Any help is much appreciated

 

[troytime]

the best way is to change that font to something standard, use about 5 graphics and text links with CSS

you should be able to get the exact look without all the graphics

if you insist on doing it the old fashioned way, just use the photoshop slice tool and save for web.

 

[slayer202]

well I don't know anything about CSS and I don't plan on having a large number of pages so I don't know if it is even worth it for me to learn right now. how exactly are CSS pages made? can dreamweaver do it? keep in mind I know nothing about it.

to your last comment, not sure you really read my post

ty though

 

[troytime]

the grey area on the right, is that going to be a subnav?

the vertical gray lines: if you want them to extend vertically when you have pages with more content, make them a cell of the same table that holds your content. give that cell a bgcolor of your line, and use a transparent pixel graphic to set the width of the cell
when your content stretches the table vertically, that cell (your line) will stretch with it.

the content box itself, just like you said. top graphic, bottom graphic, and a one pixel slice accross for a table background
you can probably find a very similar effect using css though.

 

[clamum]

A CSS page is just a text file, like an HTML page, that contains rules as to how the HTML elements are presented. For example, you can add a rule to the content box that specifies a 1 pixel solid grey border around, which will look just like you have except you don't have to worry about images. It's not very hard to learn and IMO you should learn it if you're making a website anyway. Here's a couple links that have a lot of information about CSS and web design in general: W3Schools and HTML Dog.

I don't think that page would be too hard to layout in CSS, and you could keep the images if you wanted. The borders you could do with CSS. I probably couldn't help you too much with laying that page out (I'm still learning) though. I'm sure someone else like LoKe or notfred could though.

 

[slayer202]

Originally posted by: troytime
the grey area on the right, is that going to be a subnav?

the vertical gray lines: if you want them to extend vertically when you have pages with more content, make them a cell of the same table that holds your content. give that cell a bgcolor of your line, and use a transparent pixel graphic to set the width of the cell
when your content stretches the table vertically, that cell (your line) will stretch with it.

the content box itself, just like you said. top graphic, bottom graphic, and a one pixel slice accross for a table background
you can probably find a very similar effect using css though.

hmm not too sure what you are saying about the vertical lines. you arent saying that I should make a slice completely across the page for the middle cell correct? are you saying add a 1 px slice of the vertical line in the same table area where the content box slice will go? i'm kind of confused

 

[troytime]

for the vertical line, don't use any slice
just use a table cell bgcolor
use a 1px wide transparent gif to size the cell

for the border of your content box in the middle, you can either do the slicing and tabling, or you can do a simple table with border, or you can do a css border

 

[slayer202]

Originally posted by: troytime
for the vertical line, don't use any slice
just use a table cell bgcolor
use a 1px wide transparent gif to size the cell

for the border of your content box in the middle, you can either do the slicing and tabling, or you can do a simple table with border, or you can do a css border

i don't really get what to do for the vertical line :/

 

[troytime]