Tech moves fast! Stay ahead of the curve with Techopedia!
Join nearly 200,000 subscribers who receive actionable tech insights from Techopedia.
A typographic hierarchy is a system that uses typography – the size, font and layout of different pieces of text – to create a hierarchical division that can show users where to look for specific kinds of information. It is an organizing system for establishing order in a set of data. By creating different sizes, shapes and blocks of text, developers can direct the user's eye to the information that an audience needs the most, or otherwise categorize that information visually for the audience.
The immediate example of typographic hierarchy is to take a general set of information, such as a product description, and change it from one generic block of text into several distinct units. Suppose there is a product review or description including the name of the product, its price, its description and specifications – all written in one simple text block. It is fairly difficult for the audience to read and take in these different bits of information, partly because they do not understand what bits are playing each particular role. To put it another way, when they are looking for a specific thing, like price, they have to comb through the entire block of text.
A typographic hierarchy method would take each particular element, starting with the name, the price and other items, and split it up into different sections with different sizes of text and fonts. The name would often be the largest block, possibly followed by the price, which would be in its own font in a piece of white space to distinguish it from the rest of the information. Specifications are often put in bullet points to distinguish them from other text.
Generally, typographic hierarchy is a discipline that is very useful in Web design and graphic design in order to get more specific results.