Font Hierarchy - The Basics of Text Size
We aren’t all graphic designers. We are marketers who need to get a job done. Even if you’re a designer and not a marketer or all of the above, it wouldn’t matter.
Because whoever you are, you need to think like your audience and give them a web page that any human and machine can navigate. Getting this job done starts with a principle called Font Hierarchy.
All text on a landing page should have three levels of text size.
- Big text at the top for the heading (H1), consider 48px
- Medium sized text for subtitles and section headings (H2-H6), consider 36px.
- Regular and readable text for paragraphs ( p ) 12-16px.
The text used should also follow the style guide settings of H1, H2, p, etc. So that web browsers, search engines, devices, and your future self can easily display the text in any condition when needed.
Here is a landing page using 3 levels of font hierarchy to demonstrate what this principle looks like, and a preview within the Unbounce builder.
Happy page building!