Need help with design

I am trying to build my first website sample. We covered web design in my school but didn’t get too advanced in graphics/css.

I want to make a design that looks just like the one in the photo I attached below. I want the page centered in the browser like that image, and I like the multi-layer design. Like one rounded layer ontop of another rounded layer and the footer links in the bottom rounded layer.

Just look at the image you will see what I mean.

What is that type of design called? And how can I replicate it? I’ve viewed the source on the HTML but its really confusing to me still. I’ve been searching for a tutorial to make a design like that but since I don’t know what its called, I can’t find anything usefull.

Is that design done with images or is it done with just colors and css?



Definitely with images, basically three separate background images for the page background (to have the left and right border in one image!), the header and the footer. That’s if you don’t need a flexible/fluid/liquid layout, i.e. you can live with a fixed width, otherwise it gets slightly more complicated.

The Wordpress default theme uses this technique, check it out here:

Also, using Firefox + Firebug (use the glasses icon) helps when looking at this sort of stuff.

The Wordpress default theme uses this technique
Wordpress is good for that, just find another similar better looking template. We use Joomla and our site uses that style, they are also a lot of Joomla templates similar to the design you want.

So if you choose for any CMS both of them are good, but I will always recommend Joomla.

Good luck

That looks like its about 99% images.