Common ways to express pages

The common way of page expression is part of the entire Web interaction design method:

Designers in the design of the page, should be on the page to establish a number of visual levels, to guide the user's visual focus. Draw the attention of the user to the most important elements, and then steer the line of sight to other, less important, information. This makes it easy for users to quickly and easily find their own needs, better completion of reading, browsing tasks. Here are some common ways to express several pages.

First, the page's browsing order

The user scans the page when the line of sight tracking, which is called "visual flow." Good design allows people to flow along it in a smooth order. People's general habit is from left to right, from top to bottom.

From left to right, top to bottom: For a long time, users have been accustomed to reading from left to right, from top to bottom, so when the page design we need to let viewers look at the text from a direction, the user's eyes from left to right, from top to bottom, this will be faster and more effective. Don't let the text flow like this:

This arrangement is also possible, still from left to right, top to bottom:

button to the right:

Upper left corner first: in the following figure, the higher the brightness, the more concentrated place, indicating the more attention:

From top to bottom, left to right is the default visual flow direction. The intense focus will attract the eyeball first, then the secondary information.

Therefore, in the browsing order by the front, the position, that is, the first seen position, is easy to focus on and memory of the place, that is, "upper left corner first". Because people often don't have enough time to browse the Web, or stop browsing or connect to other pages quickly after they get the information they need, the upper left corner is often the visual focus.

Snap To

In the design of content typesetting, aligning the content to the right creates a good double boundary that extends down the middle of the group of objects (using the Gestalt principle-the continuity principle), and the benefit is to strengthen the boundary to guide the reader's vision to a smooth downward extension that helps to form a good visual flow. The following figure: