Typography: Modular Scales

There’s always a need for varying sizes of typography within design. Headings, call outs, and paragraphs of content all need different text treatment. It’s fairly obvious you don’t want to have a heading looking the same as the rest of your content. You want that heading to be bolder, bigger and more attention grabbing. You also don’t want to be reading pages upon pages of large italic copy. Sizes will vary with type choices as well. A font like futura will have a smaller x-height (height of the lowercase letters) than a font like Source Sans so you will need to adjust the line-height accordingly.

There are tons of decisions you need to go through as a designer to properly set up your type. It’s one of the most (if not the most) important thing we do: delivering content to the reader in an impactful and legible way. If the type is set properly most of the time the average reader won’t even notice. That’s good! As people tend to really notice when things look horrible or illegible.

A tool to keep your type in check

A Designer will usually have an instinct on creating varying type sizes for the job at hand but there is a tool you can use to verify or reference when choosing your type sizes. A Type Scale or a Modular Scale is a very useful tool. The idea is that you choose a ratio like 1:618 and a type size like 10px and multiply and divide from the ratio to get your multiple sizes. A sweet webpage that can help give you these values in a visual way is http://type-scale.com/ . This method has proven to be successful for many centuries. You may be familiar with scales called the Golden Ratio or Perfect Fourth. The Golden Ratio is probably the most familiar as it was used periodically by classical Greek and Renaissance mathematicians, architects, and scribes. Using a modular scale can help you keep your headings uniform on your website or other project. You may be surprised and find out that you were already subconsciously following a portion of the scale already just by instinct.

“A modular scale, like a musical scale, is a prearranged set of harmonious proportions.” –Robert Bringhurst