(H1) Panel Builder 66/33% Layout
This page uses a 66/33% panel builder with no background
Nested within that left-column is a 100% panel with background
(H2) Explanation
Having content in it's own panel gives better visual separation
Nesting panels allows for greater control of content including alignment and discreet background combinations, ultimatley giving you more options for grouping like-content.
Another layout technique is stacking panels, which when used with backgrounds, assists in visually separating topics. Be aware that some components have native backgrounds (e.g. Feature Box, Flip Panel, Block List) that don the same effect.
Component Tutorials
Place less important info. further down the page, "below the fold"
Documentation on components used to make this page (in order of appearance):
- Heading
- Panel Builder
- Text Editor (this component)
- Flip Panel
- Feature Box (inside flip panel)
(H2) Other 66/33% Samples
Get some ideas from real pages that use a similar layout: