Description
...
Layouts consist of:
VerinTop
Ribbon
Header area
Main workspace
Left panel (optional)
Right panel (optional)
Footer (optional)
...
Page title (mandatory)
Header text, e.g. page description
Page controls which operate on whole workspace, such as Search, Tabs, or an Action Menu.
Where possible, the structure of the header should be consistent across different pages within the same product.
Placement and Positioning
...
The panel may be a static element on the page, or within a collapsible Filter Pane.
 |   |
Structure
The left panel will usually consist of:
a header describing the panel contents.
a List of options. Any other examples?
additional information or actions relating to the filters.
...
An optional right-hand panel should present information and actions relating to selected items within the main content, or additional content related to the main workspace.
The panel may be a static element on the page, or within a Details Pane.
...
a header describing the panel contents.
the main panel contents. Any consistency? Can be anything?
Placement and Positioning
...
appear to the right of the main workspace.
have a fixed width. But variable between products? The examples are all different.
The panel height depends on its type:
...
Make sure there’s a natural flow between elements on the page, from top to bottom, left to right.
Prioritise the most important elements to facilitate user decisions.
Form associations between related elements by keeping them in close proximity and using graphical similarities.
Horizontal symmetry ?
Make sure each section is distinct and identifiable.
Be aware of common scanning patterns. F patterns are common for lists of information, learnt from popular search engine designs, where users scan across the top and down the side of the page to find the information they’re looking for.
...
controls in the header area which don’t affect the entire main workspace.
a footer in web apps.
graphical content in the footer.
...