Previously i wrote about the graphic design trends in 2014, so i’ve decided to keep on talk about design trends. This time i’m going to showcase the best fonts for web design and how to use them.
The best fonts for web design: my list
First i will list the best ten fonts, both free and premium. So let’s start saying that typography is all about creating aesthetically pleasing layout. The web is based on text, so it’s really important to arrange the type in order to get a smooth and readable page.
By the way, let’s see which are the 10 best fonts for web design.
We all knew it would have been in this list. Too many words have been spent by designers from all around the world about this piece of art. Do i really have to talk about it’s readability? Helvetica neue is a new version of the Helvetica typeface. This font brings many features in order to meet the needs of web designers.
Helvetica can be great on brand identities, but paragraphs displayed on digital screens looks really great with this typeface. If you want your readers to remember the text choose this. It’s been the default font for OS X until the Yosemite release.
This is just an immortal sans serif type. Minimal websites are nowadays based on strong typography. This fonts is highly recommendend for bold headings.
I really love this font. If you’re crafting something modern looking, you have to use it. IMHO it is stunning when used for titles in ultra italic weight.
It’s a well known monospace slab serif font. But most of all it’s readable and highly available. It was originally used by IBM and it’s birth dates back to 1950.
If you need a slab font, choose it. This is absolutely one of the best fonts for web design. A free font that really looks like this one is Rokkitt, available here.
Basically it’s made by straight lines and pleasant curves. The creator says “it all started with my love for U. One day this uppercase letter U just came to me as an image in a daydream.”
You can find it on the standard web compatible list, this makes it works well with a great amount of devices.
Since the Ice Cream Sandwich release it has been the standard typeface for Android. Works smooth across lots of different devices (and screen resolutions), this makes it a great font for the digital usage.
I’m so funny.
Other really good fonts are Myriad Pro, Cabin, and Ubuntu, but if you need a sans serif typeface you can use League Gothic (which is now available for free) or Bebas Neue.
Best fonts for Web Design: How to use them
We have just seen some great fonts. It’s time to know how to use them. In fact, choosing the best fonts doesn’t means that you can use them all together at the same time.
As we first said:
“Typography is the art of arranging type to make written language most appealing to learning and recognition”
— Rabe One (@OneRabe) 22 Ottobre 2014
Let’s see how to create clean layouts using fonts the right way.
Rule #1: Choose one base font and one display font. Don’t try to use lots of different typefaces, and most of all make sure you choose the appropriate font for your subject matter.
Rule #2: Take control of every white space between the font shapes. Adjust Leading (the space between lines), Tracking (or letter-spacing) and Kerning (the process of adjusting the spacing between characters in proportional fonts). A funny way to discover the kerning is this online game.
Rule #3: The goal is to improve text readability, so remember: don’t exceed with the width of the columns. Columns are made to contain between 45 and 75 characters: This allows the reader to easily move between lines.
Rule #4: Web designers are now able to justify paragraphs thanks to the CSS3 property text-justify. This is really useful, as much as the text-align property.
I hope this quick guide can help you. These were the best fonts for web design in my opinion. Do you agree? What’s your favourite typeface? Is there a font you really hate? Let me know, feel free to leave a comment or share this article.
You can read my articles about design in my author page, i’m waiting for your feedback!