Search

Newsletter

Get our latest updates. Sign up with your email.

Popular Posts

Design Your Posts to Guarantee They Get Read

6 min read
3 views
Design Your Posts to Guarantee They Get Read

Of all the edges I know of, embracing amazing design is the easiest, the fastest and the one with the most assured return on investment.

–Seth Godin

Looks matter. We don’t always want to face it, but it’s true. People will make judgments about the quality inside based on looks alone. A pretty package gets more attention every time. So how can you make your posts more attractive to help guarantee they get read?

Better Formatting for More Readable Posts

You’ve seen the advice to make your posts more scanable. While some will debate that people do read online, scanability aids readability. The more visually interesting you can make your posts the more your post will draw the eye all the way through and the more your words will get read. The good news is it’s fairly easy to do if you keep formatting in mind as you write and remember a few ' /></a></p> <p>I have to admit I’ve not always done a good job formatting posts. My post design has improved over time, but it still has a long way to go. In part my poor formatting is a result of an overall design that didn’t anticipate a blog. When I created this site I opted for a <a href=liquid layout over a fixed layout. The fluid design means the width of the main content column changes making it more difficult to control how the images will display. I’ve shied away from adding images in the past, but that’s no excuse for poor formatting.

Take a look at the image to the right. It’s an older post stripped of the site design around it. Not very inviting is it? You have to really want to read that post to get through it all. The post does make use of subheadings throughout, but it’s about as poorly formatted as a post can get. Ironically it’s a post arguing that graphics are important to a balanced design.

David Airey pointed out the irony in a ' /></a><a href=' /></a> <h3>Consistently Well Designed Posts</h3> <p>While I’ve done better with the formatting of my posts over time, I still have much to improve. There are blogs that consistently get the formatting right and they make a great example for learning. Look at the three posts below from DoshDosh, SEOmoz, and CopyBlogger. Each links to the original post as do all the screen shots in this post. I cropped the DoshDosh and SEOmoz posts a little. Both continued longer down the page, but the formatting you see continues to the end.</p> <a href=' /></a><a href=' /></a><a href=' /></a> <p>Notice the liberal use of images in Maki’s post on the left. There’s a rhythm to the post. Heading, text, image, heading, text, image, heading, text, image, etc. The images also add a lot of color to the post. Rand’s post (above center) makes use of images as well with the same pattern, though the images don’t contrast as much in their color.</p> <p>Brian’s post on the right has only the one image, but it includes headings, lists, and a blockquote. The blockquote itself is a list. The post is more distinctly formatted above the fold, which makes sense as once you’ve gone below the fold you’re probably already hooked. Still the post contains a good deal of whitespace throughout.</p> <p>By the way if you click to any of the three sites above take a look at the subscriber counts they show. Yes, all three have great content, but ask yourself if the post design also contributes to those counts.</p> <h3>Formatting isn’t only in the Images</h3> <p>The screen shots above might lead you to believe that a good post design is all about the images. Images are the most powerful of the elements listed above, but they are not the only way to format a post. A post without images can still be inviting to read. Consider the two posts below, one of my own and one from Daily Blogging Tips</p> <a href=' /></a><a href=' /></a> <p>Neither post contains an image, though both use lists to create whitespace. My post includes a blockquote at the top, but Daniel’s post is designed better as it uses shorter paragraphs to create additional whitespace.</p> <a href=' /></a></p> <p>Both posts are limited in their formatting, but neither is particularly long and so not a lot of formatting is required. The key to crafting a well formatted post is in the balance. Too little and you have a long and boring string of text, too much and you have a crowded mess with everything in the post fighting for your attention.</p> <p>The post to the left is from SEO Book. It does contain two images; one for the post date and one in the blockquote, but both are subtle. Most of the formatting is text based in the use of lists, a blockquote, and three levels of headings. Aaron’s post makes great use of color in the subheads as well as the links. The post is very inviting.</p> <p>SEO Book posts are generally formatted well, but if you look through them you’ll notice very few have additional images beyond the two this post uses. The formatting is nearly always done through text elements.</p> <h3>Your Presentation Improves your Information</h3> <p>It might sound strange to think that the way your information is presented can actually improve the information. The information is still the same isn’t it? Yes. but the way you present your content does make it easier or more difficult to comprehend and that does alter the information received by the reader.</p> <p>Look up to the original screen shot of my post that used no formatting. Would you read it? I probably wouldn’t. I’m surprised anyone did. I could have made a great argument for using images in your posts, but who would know. If you did read it you’d likely struggle through, which would lead you to absorbing less of what’s said.</p> <p>As you write your next post think about how you could improve it visually. Images will have the most visual impact, but you can create an inviting post without them. The key is to find some way to create areas on the page that contrast with the standard paragraph.</p> <p>Are you conscious of your post design as you write? What elements do you use to format your posts and create a more appealing visual design.<br /> <a href=' /></a></ul> </div> <script> (function() { function initCopyableSections() { document.querySelectorAll('.article-content .copyable-section').forEach(function(section) { if (section.querySelector('.copyable-section__btn')) return; var btn = document.createElement('button'); btn.type = 'button'; btn.className = 'copyable-section__btn'; btn.setAttribute('aria-label', 'Copy to clipboard'); var label = section.getAttribute('data-copy-label'); btn.textContent = label ? 'Copy ' + label : 'Copy'; section.appendChild(btn); btn.addEventListener('click', function() { var contentEl = section.querySelector('.copyable-section__content'); var text; if (contentEl) { text = contentEl.textContent.trim(); } else { var clone = section.cloneNode(true); var btnClone = clone.querySelector('.copyable-section__btn'); if (btnClone) btnClone.parentNode.removeChild(btnClone); text = clone.textContent.trim(); } if (!text) return; navigator.clipboard.writeText(text).then(function() { var t = btn.textContent; btn.textContent = 'Copied!'; btn.classList.add('copied'); setTimeout(function() { btn.textContent = t; btn.classList.remove('copied'); }, 2000); }); }); }); } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', initCopyableSections); } else { initCopyableSections(); } })(); </script> <!-- Tags --> <!-- Correction Form --> <div class=

Found an error or have a suggestion? Let us know and we'll review it.

Share this article

Comments (0)

Please sign in to leave a comment.

No comments yet. Be the first to comment!

Latest News