Typography, or the visual representation of type, can communicate more about your brand than words alone. Your websites’ typefaces should assist in amplifying your brand’s voice, while also looking sharp and easy to read on the screen.
As an artist, and designer myself, I want you to understand that even something that seems as basic as a font, that we use every single day to communicate, was created by someone. For this reason, some fonts are free to use for your own profit, and some you will need to purchase a license to use.
Our Resources File can help you find fonts you can download and use, or if you work with me or another designer we can help you with finding the perfect font pairings. (Skip to the end if you came for information on that!)
In this guide, we’ll discuss a few of my top choices and best free Google fonts for your website.. ready?!
Designed by: Łukasz Dziedzic
A sans serif font that’s equally suited for both titles and body text. Its rounded, classic proportions create a sense of harmony and warmth.
Designed by: the Indian Type Foundry
One of our favorites, Poppins is a sans serif type family whose clean, minimalist aesthetic is based on geometric forms and perfect circles.
Designed by: Joe Prince
This font was created with website design in mind, maintaining high legibility in any context. Influenced by modern Swiss design, Questrial’s look is based on full circles.
Designed by: The Indian Type Foundry
This display font’s high contrast is a great fit for your site’s titles and headers, making it one of the best fonts for websites.
Designed by: Julieta Ulanovsky
A geometric sans serif, Montserrat feels modern and clean while boasting a distinctly recognizable look.
Now that you’re familiar with some of the best fonts for your website,
here’s a guide for choosing the right ones:
01. Make sure your fonts match your brand’s tone
Ensure that your font scheme is cohesive with the rest of your visual branding.
Whether it's sophisticated and trendy or rugged and adventurous, your use of typography should contribute to your website’s overall storytelling.
02. Rank your fonts by the importance
As a rule of thumb, never use more than three fonts on your website. Moreover, each of these fonts should carry different levels of importance.
In order to retain a clear sense of hierarchy, choose a primary font, a secondary font, and an optional accent font. View the image below for a few of our favorite font pairings.
03. Learn the basics of font classification
The art of typography is rich and complex - ranging from legibility to text alignment and spacing. As a start, focus on the most important classification first: the serif, sans serif and script fonts. Here’s a quick summary of each one, and when to use them:
Serif fonts: A serif is a small line at the end of a stroke in a letter or symbol. Serif fonts are considered classical and elegant, and are mostly associated with print. Examples include Times New Roman, Georgia and Bodoni.
Sans serif fonts: These are fonts without serif lines at the end of their letters. Sans serifs are clean, modern and often neutral-looking, making them a great fit for web design. Examples include Helvetica, Arial and the infamous comic sans.
Script fonts: Scripts, including cursive fonts, are modeled after handwriting styles. It’s best to keep this style limited to titles only, as writing your body text in script would most likely present a challenge for your audience. Examples include Lobster and Lucida Handwriting.
Want to see the GG Font pairings? Check out the breakdown on our home page.
Credits to the Wix Blog for Samples.
Wix is typically our platform of choice for clients, as it is EXTREMELY User Friendly with many beautiful templates, tutorials, and amazing customer service!
Want an inside look at what you can do on Wix? Contact me for a free consultation! Kallty@goodnessgraphics.com
Comments