Vegetarians Carnivores Vegans Omnivores Fruitarians  
 

Large Content Tabs

Example of a large content template with tabs.

Content Area

We have developed 3 layouts of the content area.

  1. Fixed width.
  2. Fixed width w/ boxed side content
  3. Dynamic width w/ side content

Fixed width should be used on pages where there is large amounts of text. Text that spans the entire screen is difficult for people with larger screens to read. If you have some news, related links or content that you want to display in side boxes you can use the either the fixed or dynamic width formats that contain the sidebars.

It is important that your web site be no wider than 740px. This width will allow most site viewers to see the site without scrolling. The following dimensions should be followed:

Without Right Sidebar
 
With Right Sidebar
Section Width   Section Width
Left Navigation 160px   Left Navigation 160px
Spacer 15px   Spacer 15px
Content 565px   Content 380px
      Spacer 15px
      Right Sidebar 170px
  

The spacer and left navigation are already in the templates. The most important thing is to make sure that you do not have anything wider than 380px on the page with the sidebar and 565px on the pages without sidebars.

In the content area you do not need to use any fancy code. The HTML in the content area should not need inline styles or special classes. As in this page, only XHTML comparable standard tags should be used. If you are displaying an email anywhere on the page you should use the address() java script function (see source code for example or web.uvic.ca/webcoor/resources/email-hide.html). This will help stop email harvesters from getting your email into their spam lists.