ProBlogger: The Best Typography Tools To Make Your Blog Super User-Friendly

The Best Typography Tools To Make Your Blog Super User-Friendly

Posted: 05 May 2016 06:00 AM PDT

This is a guest contribution from Leona Henryson.

As a blogger, you might spend several hours working on a single post. You search for topic ideas that are trending and relevant to your followers. You spend time researching and narrowing down your topic even further. You write your post, then edit and proofread until it is free from errors. Finally, you select the images that you are going to use, resize those images, and then find perfect places in your document for them.

Well written content and engaging images are great things, but if they are your only focus, you are missing a big piece of the puzzle. That piece is typography, and it is more important than you might imagine.

A Brief Primer on Typography

Typography includes the elements of spacing, point size, font type, color, style, and formatting. You can use typography to add great visual appeal to your posts, but that is only the beginning. Your use of typography and influence the user experience, and even help you to convey the message that you want to your readers.

A blogger with a good understanding of typography can use their skills to influence where attention is drawn on a web page, which information stands out, and even the order in which readers will look at text and images.

Imagine the ways that you could use these skills to increase the emotional impact of your web page design and blog posts, or how typography could be used to motivate your readers to answer your calls to action.

poetry-720609_640

Yes, Type Really is Important

Is it that big of a deal if you choose the wrong type for your blog? Absolutely it is.

The wrong font, the wrong color, and even the wrong size can result in posts that are difficult to read. If you have ever clicked away from a website because reading was giving you eye strain, chances are the culprit was poor typography choice. Even worse, your typography choices can cause you to lose credibility. For example, when researchers discovered the "God Particle", the announcement itself was overshadowed by the fact that the people behind it decided that it would be a good idea to post the news using comic sans font. Rather than focusing on an amazing, scientific discovery, the focus became the unfortunate choice of a much maligned font.

Unfortunately, this isn't an isolated incident. Businesses have, on many occasions, been rightly criticized for using fonts that are intended for not so serious applications. If you have seen the meme that contains a bulletin written in Comic Sans font with an attached note that reads, "We are a Fortune 500 company, not a children's lemonade stand. Why are we using Comic Sans?" you can probably relate.

Typography Best Practices

To start with, it is a good idea to learn a few basic rules of typography. Some of these rules include:

Choosing font colors that contrast with your background
Avoiding serifs in your text
Scaling your font size by selecting the smallest font first
Considering your message when choosing a font
Being subtle when using typography to make an emotional impact
When making bold choices with typography, be careful not to go too far

There are a few other things to consider that are audience dependent. For example, if your readers tend to be over 40, you might want to test your font selections at different zoom levels to ensure that it is still readable for those who need to read larger print. You should also consider how your typography choices will look on mobile devices.

photo-1461360422312-048b738a1830

Great Typography Tools

Here's the best news. You don't need to be a web design expert to use typography to make your blog more enjoyable for your followers. There are many great typography tools available that make improving the look of your blog a truly user friendly experience.

FFFFALLBACK

Have you ever been on a website and noticed blank spaces, little rectangles, or other symbols where there should have been text? This means that the browser is unable to display what is written using that particular font.

Unfortunately, there is simply no way to pick a font that is going to work perfectly in every browser or on every device. Sometimes things just aren't going to be displayable. Fortunately, what you can do is select a fallback font. These are web safe fonts that will display when your chosen font does not work.

The FFFALLBACK tool allows you to experiment with fallback fonts in order to find one that works best with the look and feel of your blog. Since you are able to pick the font that is used, you minimize the impact of design degradation on your page.

WhatTheFont

If you've ever stumbled across a font that was really amazing, and you wanted to know what it is, WhatTheFont is a great online resource.

Simply upload an image of the font to the website and it will show you the fonts that match your mystery font the closest. If your font cannot be identified automatically, you can submit the font to the user forums. There, typography enthusiasts will helpfully get to work finding out what font you have discovered.

In some cases, you can get results from your inquiry in just a few hours or less.

Font Picker

Your computer comes loaded with tons of fonts. After that, as you download certain apps, games, and even templates for word processing software packages, even more fonts are installed.

Unfortunately, finding them and sorting through them is a real pain, especially if you try to do so using basic windows search functionality.

Font Picker aggregates all of the fonts that you have installed on your computer. You can see what each font looks like, and pick the one that has the best look for your current project. The app allows you to eliminate fonts you don't like, and to see how your text looks when displayed using various fonts.

Thinking With Type

Okay, Thinking With Type isn't a tool per se. It's actually book, but it is a great primer for anybody who is interested in learning about the importance of typography as it applies to all forms of written communication, including blogging.

Not only is the book a great resource, the accompanying website also has a ton of amazing information on typography use. If you visit the website, be sure to check out the "Extras" page. There is a ton of great information, and a bit of tongue in cheek humor.

Note: If you are reading this article and still wondering what the big deal about type is, this resource is strongly recommended.

Google Fonts

Google fonts is a collection of free, open source web fonts that you can select for your blog or other web content projects.

The fonts available were all specifically designed for use on the web. This means that you are much less likely to have readability or display issues if you use one of these fonts.

If you are currently relying on traditional fonts, many of these were designed for print, not for display on a screen. They certainly weren't created with mobile in mind. If you see a font that interests you, click on it. Google will display a few variations of the font (bold, italics, etc.). If you like the font enough to keep it, simply click the button to add it to your collection.

Typedia

Here is another excellent educational resource on typography. Think of it like the Wikipedia of typography, only a lot more accurate.

You can explore the website and learn about all kinds of facts, techniques, and history related to typography. There are also discussion forums where you can learn from typeface enthusiasts.

If you are really interested in learning more about the nuts and bolts of typography, you should definitely bookmark this page.

Typostrate

If you want to use typography in a more creative way, this website is perfect. Typography artists submit their work to this website, and they use the website to find inspiration.

If you enjoy the look and feel of websites like Pinterest, you will love this page. Of course, enjoying the work of some amazing artists is only the beginning. Typostrate also has templates, guides, and helpful videos. If you get really good at working with typeface, you can even upload some of your own work.

TypeWonder

If you want to quickly preview a variety of fonts on your blog, check out TypeWonder. All you do is paste in your URL, and it will allow you to quickly see how different fonts render when you use them on your blog.

If you would like to get even more functionality out of this utility, try downloading and using one of the many extensions. The website also has a typetester tool. This allows you to type or copy in text, and then see how it looks using different fonts.

If you find a font that you like, you can click a button to download the font to your computer.

TypeGenius

Let's say that you have chosen a primary font to use on your blog.

Now, maybe you want to choose a couple of secondary fonts for design purposes. Rather than manually testing all of the fonts that you think might work, why not use TypeGenius? All you have to do is let the tool know which font you have selected, and it will return a variety of secondary fonts that will complement that font.

BlokkFont

Many people use Lorem Ipsum to demonstrate what a finished product will look like using a given typography selection (e.g. font, size, color, etc.). Unfortunately, for many people it is difficult to visualize what their content will look like as it is laid out across the page. This is where BlokkFont comes in handy. It replaces the generated Lorem Ipsum with simple geometric blocks. This allows you to consider spacing and other type concerns without getting stuck on random words. If you struggle a bit with visualization, this can definitely help.

Conclusion

As a blogger, it is perfectly natural that you would tend to focus on content and messaging above other considerations. In fact, you should continue to keep your focus there for the most part.

The important thing is that you understand the role that good typography decisions can play when it comes to creating and maintaining a successful blog that is visually appealing as it is interesting to read.

There is a saying that people eat with their eyes first. This means that even before they consume a piece of food, they are making judgments about that food. The same thing applies to your blog. If readers click into one of your posts and find it to be visually appealing, they are more likely to keep reading.

Leona Henryson is a graphic designer and social media specialist with a deep passion for blogging on all topics related to her educational and career backgrounds. Follow@LeonaHenryson and read more of her posts at LeonaHenryson+.

The post The Best Typography Tools To Make Your Blog Super User-Friendly appeared first on ProBlogger.