One of a designer’s most crucial responsibilities is to efficiently organize content within a design so that it is simple to grasp and consume. One of the most crucial skills a designer can develop is good typographic hierarchy because a lot of the content designers work with is text-based.

The greatest approach to truly grasp constructing an efficient hierarchy is to practice and experiment, but there are a few rules designers should learn before venturing out on their own. After all, you can’t effectively break the rules if you don’t first understand what they are.

Typographic Hierarchy: What Is It?

Typographic hierarchy directs the reader’s attention to the information that is most crucial and least important.

Typographic hierarchy directs the reader’s attention to the material that is most crucial and away from the information that is just illustrative of the key themes.

Typographic hierarchy on the web is composed of a variety of elements. These consist of:

• When attempting to construct a typographic hierarchy, inexperienced designers typically start by considering size. And for good reason: Readers can recognize it right away. Larger is more significant, whereas smaller is less significant. But with so many other ways to establish order, size can end up being a crutch.
• Another approach to creating a hierarchy that is obvious even to those who are not designers is to make a typeface bolder or thinner.
• A color is a terrific option that is frequently disregarded when trying to establish hierarchy. Even using lighter and darker tones of the same hue might produce a hierarchy that is more obvious. Typographic hierarchy can also be increased by increasing the contrast between the type and its background.
• In addition to contrast in color, typographic hierarchy is also created through contrast in type size, weight, and style. Most users won’t be able to tell the hierarchy exists if the variation in type size is merely one or two points. Designers should instead employ immediately recognizable sizes, weights, and styles to contrast elements like headers and body text quickly and effectively.
• Case. From a reading standpoint, capitalizing body text is generally not a good idea, however, using uppercase characters in headings or subheadings can aid distinguish between various headings or other types.
• Alignment and Position. Where type belongs in a hierarchy can be greatly influenced by the placement of headings, subheadings, and other types that a designer wants to stand out. For instance, the centering type makes it more noticeable. Setting type outside of a page’s normal margins can also help that type stand out within the page’s hierarchy.

AOLCC offers flexible, online Technology diploma programs that can be finished in only one year. If you subsequently decide to pursue a complete degree, it can also count toward a certificate and Diploma in Technology. Future savings on a degree might amount to an entire year!