Layout methods used in Zen's CSS

Zen core

The CSS layout method used in the core Zen theme is based on the mostly undocumented “Border Politics” layout method. The theme developer can use a liquid layout or fixed-width layout that is extremely flexible and has source-ordered XHTML, meaning the main content comes before anything else in the XHTML source, but does not necessarily come first in the visual display of the page.

The parts of the page are placed in the XHTML in the following order:

  1. Header
  2. Content
  3. Navbar
  4. Left sidebar
  5. Right sidebar
  6. Footer

But the page will visually appear to be presented to the user in the following order:

  1. Header
  2. Navbar
  3. Left sidebar
  4. Content
  5. Right sidebar
  6. Footer

Since the content is placed near the top of the XHTML source, both accessibility and search engine optimization will be greatly improved.

Zen Classic

The Zen Classic theme uses a liquid or fixed layout based on the CSS found in Garland, the Jello Mold layout. However, it is still much easier to modify than the Garland theme.

 
 

Drupal is a registered trademark of Dries Buytaert.