webstar2013: Strukturierung

Beitrag lesen

Hi ich programmiere gerade eine Internetseite für ein Bistro. Bin eigentlich auch schon fast fertig. Nun versuche ich es aber flüssig (für responsives Webdesign) zu programmieren. jetzt habe ich schon gefühlte 10 mal neu angefangen und war mir immer über die Strukturierung der DIVs unschlüssig. Könnt Ihr mir helfen wie ich die Struktur des html dokuments gestalte?

http://test.bistro-max.de/test/

PS: ganz oben (header) sollen 3 bilder in einem Bild über die ganze breite gehen. hier meine verzweiflungsstruktur:

<div id="wrapper">
<header>
HIER SOLL DIE HEADER-GRAFIK REIN DIE SICH ÜBER DIE GANZE BREITE ZIEHT
</header>
<div id="container">
<nav>HIER DIE SIDEBAR</nav>
<div id="content">HIER DER CONTENT</div>
<footer>HIER DER FOOTERER</footer>
</div>
</div>

#wrapper = um den header bereich über die ganze breite zu bekommen
#container = um die sidebar (nav) und content und footer zentriert zu bekommen

Ist meine Denkensweise richtig oder wie würdet ihr es strukturieren?