The right fonts can make or break a web design project. To help you get started, we've sourced the 35 greatest free web fonts – but, with all this choice, how do you select the best face for the job?
Whether you're new to web-based type or a seasoned practioner who's short on time, follow these 10 quick steps to make sure you start your projects right every time...
10 commandments of web typography
- Read the text. Take notes.
- Get a sense of the tone and feeling.
- Look for reoccurring words and numbers.
- Note sections and subsections in the text. How many levels of headings will you need?
- Note other text-based elements you have to set. Are there captions, pullquotes, numerical data, a featured paragraph? Titles in the text you 'll need to italicize?
- Start considering appropriate fonts — at the size you plan to use them. They 'll look different as text and headline.
- Discard fonts that don 't support the tone of the text, have problems within reoccurring words and numbers, that can 't accomplish what you need it to do.
- Test the remaining fonts cross browser. Don 't build your site only to learn the font doesn't work cross browser.
- Attend to "the holy trinity" of good text: size, line-height, line-length.
- Use your line length to set the grid if possible. If your site is responsive, consider line length when setting breakpoints.
Mastered these tips? Elliot Jay Stocks reveals how to take your web-based typography to the next level.
Words: Laura Franz
Image: Greg Goins
Liked this? Try these...
