Hierarchy is one of the most important things in design. It tells people what to look at first and highlights important information. Here’s how I use hierarchy in my work to keep my designs clean and readable.
Size First
The easiest way to incorporate hierarchy in design is the size in your typography. Biggest = Most Important, drawing the users eyes first. I typically follow this logic: Title > Heading > Subtitle > Paragraph > Notes.
Important text is Bold
Another great way highlight key points and words is to use Bold text. When writing an explanation Important Words can get lost. Using Bold text to highlight your Key Words can combat this issue.
Color for Emphasis
Color plays an important role in hierarchy. Darker colors tend to draw the users eye first. Following the same logic as size, I make the larger words darker, lightening as the words get smaller. I often do this through monochromatic scale, but it can also be done with multiple colors; Using brighter, more eye catching colors for titles and more neutral colors for paragraph text.
Spacing Creates Structure
Spacing is one of the most underrated forms of hierarchy. I use it to group related elements, separate topics, and create visual breathing room. All together this creates easier readability and cleanliness. Remembering, negative space is just as important as the content.
Hierarchy isn’t often recognized by the average user, but is certainly notice when it isn’t present. Paying attention to hierarchy when creating your layouts will make or break the effectiveness of getting your message across. For me, it is one of main things I focus on to meet my goal of cleanliness, readability, and comprehension.
