Skip to content
An AI-driven
UX & UI masterclass
Back to course
Design fundamentals Lesson 9 of 16

Guide the reading order.

Make important text stand out while keeping the rest easy to read.

Sculptural type, sunlight, and pencil marks exploring guide the reading order.

What you will learn.

Revise each of the ten Round 1 layouts once, explain its reading-order issue, and compare one change in detail.

Before you begin.

Start with the same ten Round 1 layouts from Make text easy to read and Make a poster from sketch to revision. Keep the originals untouched in your C27 Academy Figma file.

Learn the concept.

Guide the reading order

Words to know.

Hierarchy

The order in which the design helps you notice information.

Compare the bold colored words with the smaller sentence. Size, contrast, and position suggest what to read first. Check that the important information receives that attention.

Slide 11.

Hierarchy means the order of attention

Column

A vertical group of text or content.

One vertical division

Drop cap

A large first letter at the start of a paragraph.

An enlarged first letter

Italic

Slanted text used for a distinct style.

Slanted letterforms

Weight

The thickness of the letter strokes.

Thickness of the strokes
The idea in practice

See a worked example.

Read a real paragraph at the intended size.

For exampleCheck whether the paragraph is comfortable to read at its final size.

Name the heading and paragraph styles.

For exampleName the title, subhead, and paragraph before changing them.

Compare one change before adding another.

For exampleTry a larger title in one copy, then compare it with the original.

One revision demonstrated. Start with one existing layout where the supporting sentence dominates. Reduce that sentence’s weight and increase the headline’s space. Compare both with the same full copy at the same size, then explain whether the intended first, second, and third reading points are more apparent. Apply this reasoning to all ten, not only the example.