7 best practices when using type
Choices related to layout, spacing, colour, hierarchy, size, and typeface will make or break a design. Especially something meant to be used by others.
1. Pick a typeface that scales well
I need to ensure that I use a typeface which will be great even when scaled to smaller and larger devices. As users will be accessing your website from multiple types of phones, screen sizes, and resolutions. So, It’s imperative to choose a typeface that works well across different sizes, weights, and environments in order to maintain easy readability and usability.
2. Limit yourself to just one typeface
A majority of people recommend only using 1 typeface throughout your work, but sometimes it’s good to use 2.
Anything more would make your interface look unprofessional and chaotic.
If I decide to use more than 1 typeface I need to ensure that the font-families compliment each other while also providing enough contrast from one another.
In order to do this I’ll need to pay attention to:
I need to put the focus on key areas in my app in order to help guide the user through their journey of achieving their goal. There are many typographic ways to enhance your contrast levels. The two most common are font-weight and font-size.
Contrast means to be strikingly different than something else.
This allows designers to emphasise important elements on a page and to minimise the insignificant ones.
So, for instance my headers could be in bold whilst all the information below it is in regular font so show a sharp contract and the hierarchy of the important information.
4. Give your words sufficient spacing
Allowing your type to breathe is essential in conveying meaning and soothing the reading experience. Utilising things like leading and kerning allow you to really command the space of your interface.
A good practice when setting the leading is to use 1.2x — 1.5x the current font-size. This ensures paragraphs aren’t too tight or too spaced out.
The importance of kerning
There is no set number on what this rule should be as it really varies from typeface to typeface. When using kerning I need to always aim for equal spacing or for something that is optically symmetric.
5. Keep around 60 characters per line
This usually only applies to desktop as Medium are the prime example. As they keep the text block to about 680 pixels wide on desktop. This equates to around 75 characters per line.
A good rule of thumb is to keep around 60 characters per line.
Grids help establish order and consistency in your UI. Grids give designers a way to better handle alignment and justification of text and other items.
7. Don’t rely on math. User your eyes
Because of all the various typefaces and fonts, it’s difficult for computers to get it right every time and for every use case. So it’s important to keep playing around until it feels aligned or looks visually balanced.
https://medium.com/swlh/7-ui-typography-tips-c1500e8b3ec6
