This page sets out how the design is intended to work.

Overriding Ideas

The website has been designed to respect your settings. Font size and column width is determined by the user. This flexibility has limitations and the website will degrade at settings that are beyond the norm. The important thing is that it degrades gracefully without losing functionality and legibility.

Visually the layout avoids closed boxes, the whitespace of the page is allowed to flow in and around elements. Hopefully this results in a page that feels light and open. Exceptions to this open rule can be found in the banner of the homepage and the warnings, tips and other messages that need to stand out. These have been designed as closed boxes.

Screen sizes and proportions vary greatly from small portrait oriented phone screens to huge, wide desktop screens. This variety is a challenge that can never be adequately met, but by respecting user settings and avoiding fixed width layout the user have more scope that usual to control their experience.

Two main types of sites have been identified. Information Sites and Tools, these two types have different requirements, for the former the simplest possible layout is preferred well structured text laid out in one wide or two equal columns is recommended. For the latter sites more specific layouts are required and a control panel like approach might be suitable. For sites that present a lot of data much of the text can be set to a relatively smaller size.

Layout Diagram

do-layout.png

Typical content page (Note that the tool panel on the right had side is deprecated for non-tool sites)

do-layout-columns.png

Typical top level index page

Content Area

Top Level Pages

Special styles

test123