The Keys to Typography

The typography on your website or blog can make or break its visual appeal. It can either compliment or detract from your branding and content. Typography is the visual style and format of text and symbols that appear within your texts. There are hundreds of fonts and typographical styles to choose from, including free web and proprietary fonts and styles from independent designers.

Read on to learn the keys to typography and how to utilize expert typography tips to improve the aesthetics of your website, blog, flyers or other digital media.

Image result for The Keys to Typography
Typefaces for Branding and Primary Text

The “typeface” of a font refers to it’s general appearance, which includes factors like boldness, italicization, serifs and style.

As you’ve likely noticed, different fonts can draw varying emotions from users. For instance, fonts used in scary movie posters and serious topics are often bold, dark, and sometimes embellished with a drip effect or fading. This can be seen in the Night of Terror font.

Conversely, fonts for fun or lighthearted prints like party invitations often use rounded edges with bubble effects or handwritten styling, such as in the case of FontSpace’s Sparklescolors font. These opposite end-of-spectrum examples separate thousands of other options and typeface niches. Which means there’s certainly several perfect fonts for your own projects.

Choosing a font that fits the mood of your branding or niche can get you off to a great start on building or revamping your website, blog or other print-contained media. It’s a good idea to browse free font sites like DaFont or FontSquirrel to find an attention-grabbing design for your site’s title and logo.

However. make sure that the font you choose is licensed for commercial use if you plan to make money with your website.

Most web hosting environments and browsers rely on browser-friendly web fonts and typography like those found in the Google Fonts repository. All Google Fonts typefaces are free to use, even on commercial websites.

Outlandish and decorative fonts are great for branding, and choosing one that sets the mood for your content can help unify your overall design. It can lead users to the right concepts regarding your projects. But, you wouldn’t want a heavily embellished font for displaying a lot of text as it can become hard to read.


If you’re writing more than a sentence or two, you should use a lower-profile font without much decoration so that readers can quickly digest your articles or captions.

Some of the best fonts for long blocks of text include Arial, Helvetica, and Times New Roman. These typefaces are easy to read and are often the default display option for blog posts and articles people read from desktop and mobile browsers.

Using Serifs and Spacing in Typography

Serifs describe the brackets that finish each pen-stroke in a typeface. Using fonts with serifs can give your content a more traditional, authoritative appearance. Which is great for news-related websites and educational content.

Sans-serifs fonts, or typefaces without serifs, are more modern and can make your tech-related and entertainment-based websites look more trendy and fashionable. When looking for the right typography for your projects, it’s a good idea to start by deciding whether or not you want to utilize serifs.

Spacing is another factor that’s important in typography. Titles, headlines, logos and other large fonts can be illuminated with large spacing. Smaller spacing is best for long blocks of text such as article content. It’s a good idea to keep the spacing on your fonts consistent across all areas of your site or blog.

You can space your fonts using CSS for font spacing or by adjusting the font options in your word processor or graphic design utility.

Using Weighting, Coloring, and Drop Caps in Typography

The “weight” of your font is as important as the typeface style itself. Heavily weighted, bold fonts provide thick lettering that can separate headlines from text blocks. They can also highlight titles on your blog or website.

Primary text areas should be restricted to less-weighted fonts that look better with smaller font sizing.

A great tip to consider is to use font packs that include a variety of weighting. Many font packs offer two or three different weights so that you can use the same font for your title, headline, and main text, while retaining the option to adjust the thickness of letters.

The key to choosing colors for your typography is to create a concise style guide before building your site or blog. This can include which background colors you’ll use, which colors should be used for headlines and titles and examples of how your logo looks in a small variety of color palettes.

Consider using the established complimentary colors to create the perfect contrast between your lettering, backgrounds and content.

If your site is stored on WordPress hosting, you can install a plugin like Central Color Palette to help you choose and switch between color schemes with a few clicks.

Drop Caps are large letters that can be used to start your articles. These are a carry-over from early prints of books and newspapers, and can show that you’ve put a little extra effort into making your content presentable.

You can create the Drop Cap effect for any typography using CSS for Drop Caps, or with a plugin like DropCapShortcode if you have WordPress hosting.

Success is in the Delivery of Content

Understanding these keys of typography will help you choose and utilize the best fonts for any web project. Remember to keep your more decorative fonts for your titles and logos, while bold versions of your primary font can be used for headlines and other large text areas.

Download free fonts that are compatible with your website platform and most web browsers to ensure maximal compatibility. You’ll also want to consider the overall mood and theme of your content when deciding whether or not to use fonts with serifs.

You may also like...