Last week I blogged about the way the visual system works and suggested some implications for blog post formatting. This week, I want to get specific. But first, if you didn’t read last week’s post and you’re wondering why bother, here are pictures of two blogs (I’ve attempted to hide the specifics). Which one would you rather read?
Even with images this small, most people would immediately choose the second one.
I went to the first blog because the headline in LinkedIn made it sound interesting. It probably is. But I didn’t stick around to read it. It just looked too long and intimidating. The second one, on the other hand, is inviting. It was easy to get the main points just by scanning.
As a blogger, that’s what you want to strive for. Given that you need to optimize your posts for scanning, the very first step is to make sure you have the tools to do so. In WordPress, the tool is your theme. If you’re not using WordPress, it might be your template or your CSS stylesheet. Whatever the case, you can’t build a scannable post if you don’t have the basic building blocks to do so.
At a minimum, here are things I would look for in a platform or theme:
|Whitespace||You’ve all heard that one before, but it’s true. Your theme should be airy. You want plenty of padding between the body (your posts) and any columns or chrome. It helps the user distinguish the “blog” from the rest of the site. Remember the proximity point from my first post? Whitespace helps create groupings that leverage that proximity principle.|
|Multiple heading levels||I like to have at least three levels of headings. Headings are an obvious way to allow the user to scan your post and get a feel for the content. Having several levels allows for subheadings and lets you create hierarchical relationships in your post.|
|I don’t always use the headings as intended, though. Sometimes I use them as just a simple formatting technique to emphasize a sentence here or there.|
|Bold, italics, and colored fonts||Bold is a must. I’ll often bold key sentences in paragraphs throughout my post, to call out all the high points. That way, if someone just skims the article, they’ll read the bold items and get the critical information. It’s nice to have a less heavy way to add emphasis, and I sometimes use italics for that. Italics are generally considered not as readable online, though, so use them sparingly.|
|Ideally, my theme gives me the opportunity to use colored fonts. Of course, you have to be careful with this for several reasons. Color-blindness is one. Also color is used to indicate links, so people may think that the text you’ve colored is a link. For that reason, don’t use blue (the conventional link color) for emphasis. I like a muted red, if possible, because most sites don’t use red for a link color, and it draws the eye well. It’s not a friendly color for the color-impaired, though. On the other hand, the emphasis isn’t critical.|
|Pull Quotes||I’ve installed the Pullquote plugin for WordPress, and I use it frequently. I really like pull quotes because they draw the eye, break up the wall-of-words, and are a great way to highlight the best sentences in your post. I use them especially in my long posts, scattering them relatively evenly throughout the page. (I do wish I had a little more control over where they appear though.)|
|Lines||I haven’t used the line technique that much, but adding lines between sections or paragraphs, either plain lines or graphical ones, is a good way to break up the page and group items. Your theme may not provide this. One way to get around that is to insert a graphic that’s an artsy line. Another technique is to insert a table with one row and one column and no left or right border, in order to set content apart. I used this technique on a couple of my posts to highlight an “advertisement” for people to take a survey I was conducting.|
These are some of the tools you should look for in your theme. Presumably, you have the ability to also insert graphics and use ordered and unordered lists (bullets), as well. Those are also important elements to use for scannability. Once you have the tools, you need to remember to put them to use. In the next post, I’ll talk more about some specific ways to use these various tools to make your post scannable.