For the 'puzzly' composition of pages you need to use templating. Great overview can be found in the answer to How to include another XHTML in XHTML using JSF 2.0 Facelets?. The layout itself is HTML/CSS-related, so you need to check that out first.
If you want to produce one part of a template conditionally, there are two possibilities: to do that from a master template, or to do it from a template client. Of course, you could create many templates, as others recommend, but this is counterproductive and hard to maintain in my opinion.
If you want to render a part of template conditionally, you can include rendered="#{view.viewId = '...'}"
attribute to JSF components in master template.
Alternatively, if you want to 'overwrite' the default part of a template, that for example has a left panel, just define the target area as an empty one in a template client like <ui:define name="left" />
.