Many bloggers (especially newer bloggers) tend to play around with the many, many facets of their websites design… but how close attention have you paid to your site’s typography?
Seeing as this is what your reader will (hopefully) be spending most of their time looking at, you’d think it be of utmost priority.
However, many a time I have seen bloggers obsess over theme options and pay very little attention to their sites most important aspect: the words on the page.
In this post I’d like to go over what I consider to be really important typography elements for your WordPress blog, and even throw in a few tools you might be able to use in order to create a more effective typographic layout for your blog’s design.
At the end of the day, if people find your content interesting, they will read it, but there are a few elements you need to be away of so that you do not lose readers over something like your blog’s font choice.
Fact of the matter is, the coloring on your blog matters, and on this point I’m going to cut right to the chase: if you are using anything else other than dark lettering on a white background, you are probably doing it wrong.
In some instances, such as the “sexier” music blogs and other blogs that focus more on the media present, and/or contain short updates, white on black text can be acceptable, and can fit in with the blog’s theme nicely.
However, if you plan on operating a traditional WordPress blog that is filled with long text posts that feature a lot of information and/or description, than you need to know that many studies have shown time and time again that the human eye simply prefers dark text on a very light background.
In this matter you need to play to your audience at large: while you may prefer light on dark yourself, think of the majority of your readers, most of them would rather read you content with dark text on a light background, and for your blog’s popularity’s sake, you ought to just let them have it.
While the plain ol’ black on white text might seem boring, let your content shine in that area, and if you love colorful design, then show it elsewhere: nobody is saying that you can’t have a brilliantly colorful header or blog background, but for the post area, keep it basic and let your readers be able to read all of your content without getting a headache from your “yellow on green” post area.
Yes I did make this title just for the lame pun.
But seriously, if you haven’t noticed among the big blogs, size 14 font is the new size 12. This isn’t anything revolutionary on keeping readers to stick around through clever psychology, it is for the simple fact that bigger fonts are easier to read, especially on the computer.
What insight I’d like to offer pertains to the size of the spacing between letters and between words, which can greatly affect your posts (and therefore your blog’s) readability.
The key here is simulating the type of print your would see in a book that is easy to read, as most of the major publisher’s have perfected this aspect over time, you will see many books following a close format to how the words are displayed on the page.
One thing to look out for is known as “leading”, which is the amount of space between the lines of text, and an element that can greatly effect the readability of your text content.
Generally speaking, the spacing of your text should look natural too you, and based off of my own experiences, it is better to overshoot the spacing rather than undershoot; at worst, over-spacing looks tacky, but for under-spaced content, it can appear almost unreadable, or at least a burden to read (see above).
The other important aspect that often goes overlooked, but is easy to catch with just the eye is the “measure” of your text. The measure is simply how wide your text content is. This is why, unless you are using WordPress to present a sales page, you don’t usually want to go full-width, see below for a comparison.
Again, much of this can be determined by the human eye, or what is most comfortable for you to read yourself. It’s just that many bloggers will use other tools to write their posts, and then after they are posted on their site, the editing is done, so not much attention is paid to the text layout for less meticulous blog posters.
You’ll notice that the bottom example is one that is often used in newsletters, and this fact holds true: for an email or newsletter sent to subscribers, narrower emails are more often (and more consistently) read, but for blogs, a nice balance is needed to be easy on readers eyes so that they can flow from one word to the next in a long post.
Changing Your Theme’s Font
As I’ve noted, while the above aspects are fairly important, you shouldn’t go do something radical such as change your blog’s design (one that you may enjoy) simply to have better typography, especially since there are far easier (and cheaper) options available.
If you wish to keep your theme (or use any theme for that matter) while still retaining complete control over your blog’s type, I would highly recommend the Font Uploader plugin, as featured on CodeCanyon.net.
This plugin allows you to do exactly as described, I know because I am an owner of this plugin and use it on a variety of sites, oftentimes when I feel like I’ve found the perfect theme, but am disappointed with the themes font size or styling.
I can now comfortably use any theme design that I want, because I know I can take care of the font settings all from a $10 plugin that installs on any site.
Another option is the WordPress Typography plugin, which offers similar resources in changing and modifying the font aspects of your site, and is also compatible with all WordPress themes.
The benefits of these plugins is that you are now not forced into abandoning a WordPress theme just because the font is outdated or not suitable for you site’s style: you can now adapt any WordPress theme’s font to your desires, all with plugins that can be used for unlimited sites. Overall both are a great bargain and I’d recommend them for your growing collection of WordPress sites.
Unfortunately for those with an eye for unique design, I cannot recommend too many fonts that fit the bill of what we’ve discusses above: mostly because you should be using web-safe fonts, which are accessible to all browsers/readers, ensuring your content is view-able to the widest possible audience.
The 5 main choices in this regard seem to be Arial, Heveltica, Verdana, Georgia, and Courier. These seem to be true for all forms of publishing that is related to blogs, from blog posts themselves to e-books. Heveltica seems to have been making a popular return as a body font recently, and although it is loved by many, I will have to go ahead and sound blashpehmous here when I say that I think it is more suited for titles/headers than it is for a body font.
By far my favorite (although it is a bit boring) is Arial at 14pt. Clean, professional, and highly readable, I believe that this is far and away the best body font for a site (and you’ll see that sites like Problogger and Copyblogger agree with me).
My second favorite is probably Verdana, it seems to be highly popular with Thesis Theme users and it offers a more creative substitute to the basic Arial font, although in my opinion (depending on the sites design) it looks a little less professional.
All in all I feel like I should make it clear here that you shouldn’t be freaking out over your font if you are not a designer and simply want to blog, just be sure you aren’t limiting your site by selecting a hard to read or unusual font that may not be accessible or bearable on your reader’s eyes: use your own good judgement in this regard.
Create A Text Hierarchy
The last aspect that I consider essential to successful blog typography and allowing your visitors to read easy is that of “text hierarchy.”
Creating a strong visual hierarchy is very important for readers to be able to quickly navigate from most important content to least important and gives them a sort of scaffolding to quickly find specific content they’re looking for. It gives a design structure and a logical flow of presented information making it feel more inviting for visitors.
This mostly falls in line with advice you may have heard before: make liberal use of the enter key, no more than a few lines before you space down, and use lists and H1 titles to separate distinct topics within each post, to allow easy browsing.
You may have heard these things before, but are you implementing them? Readers have a highly increase bounce rate from a post when it is not “browseable”, that is, if they can’t get the idea of a post with a quick scan, then they are much less likely to read the whole thing.
So along with proper text formatting, also remember to remind your post formatting, or you may end up losing readers who are browsing your content that could have been loyal subscribers, but clicked away and were lost forever.