Establish a visual hierarchy, with the "center stage"
dominating everything else. Consider these factors, though
none of them are absolutely required:
- Size. The Center Stage content should be at least
twice as wide as whatever is in its side margins, and
twice as tall as its top and bottom margins. (The user
may change its size, but this is how it should be when the
user first sees it.)
- Color. Use a color that contrasts with the information
in the margins. In desktop UIs, white works well against Windows
gray, especially for tables and trees. As it happens, white
often works in web pages too, since ads and navigation bars
usually use other colors as their backgrounds; also, Web
users have been trained to look for the plain text on a
- Headlines. Big headlines are focal points, and can draw
the user's eye to the top of the Center Stage. That happens in
print media too, of course. See
Titled Sections for more on headlines and focal
- Context. What does the user expect to see when she
opens up the page? A graphic editor? A long text article? A
map? A filesystem tree? Work with her preconceptions; put
that in center stage and make it recognizable. The user will
look for it -- this trumps all other rules about visual
perception. (But it doesn't mean you can frustrate her
by hiding what she's looking for! Some Web sites put their
main content so far down the page that it's "below the fold"
in short windows, requiring the user to scroll down to find
it. That's just sadistic.)
Notice that I did not mention one traditional layout variable:
position. It doesn't much matter where you put the center stage --
top, left, right, bottom, center, all of them can be made to work.
If it's big enough, it'll end up more or less in the center anyway.
Keep in mind that well-established genres have conventions about
what goes into which margins -- e.g., toolbars on top of graphic
editors, or navigation bars on the left sides of web pages. Be
creative, but with your eyes open.
If you're in doubt, take a screenshot of the layout, shrink it
down, blur it, and ask someone where on the page they think the
main content should start.
(Note: The name of this pattern came from a paper authored by P. R.
Warren and M. Viljoen.)