Question

I’m working in a layout similar to this, with the difference that the logo will be on top of the navigation menu.

This will be the disposition of elements:
Layout http://dl.dropbox.com/u/27937302/layout.png

I think this should be really simple, but i can’t get myself to know for sure which tags should i use for the two main areas of the layout sidebar and content.

Should the whole left sidebar (including logo and main navigation) be inside a <header> tag? <aside> a simple <div> with <header> and <nav> inside?

What about the content side? it might have blog posts, portfolio entries, static pages, etc.

Consider that the whole content area will have to be dinamically added to the main template.
Also, the sidebar has a big image for textured background and it has to fit all height browsers.

Thanks in advance.

Answer 1

<nav> should contain the navigation, <footer> should contain the footer, and <header> should contain the logo, and possibly also the category links. However, you should then selectively set position: fixed, something like this:

#logo, nav, #side-of-footer {
    position: fixed;
}

The #side-of-footer part could be lots of things depending on the actual final stylesheet, how you want things to look, and how that footer part is currently marked up (in your design, the left side appears to be separate from both the footer and navigation though there is no reason for that).