Search
  • Rebecca Ogilvie

Type Hierarchy in Web Design

Typographic hierarchy is a way of laying out content so that it’s legible and easy for the reader to understand what content is the most important and allows the reader to scan the information and easily navigate through the content.

When designing for a web page it is important to know the content in which you're designing. Knowing the content fully will help you as a designer to highlight the important parts of the content and guide the reader around the website.





What do you want your reader to see first? The most important content on the page should usually be a big, bold font that first grabs your attention, that gets right in the readers face like titles for pages or projects.


After the most important typography has been established it helps to sort the content into different sections. The next level of hierarchy should be content like sub-headers which gives the reader clues about what they are about to read or body content.


This is where you want your readers to end up. The typography hierarchy before this should of acted like a stepping stone to the final piece of content you want the reader to read. This is where you can go into more detail about your product, service, or topic and it’s typically in a smaller font. It can be long piece of content like an article or just a brief description but it must be in a font that’s easy to read since it’s usually much smaller.


How to create a typographic hierarchy:


1. Use different typefaces and weights

2. Use different font sizes

3. Add white space

4. Add some colour

5. Use spacing to help organize your information


Enjoy the wonderful world of web design.












9 views0 comments

Recent Posts

See All