![\"5](\"https:\/\/i0.wp.com\/problogger.com\/wp-content\/uploads\/2023\/09\/5-Simple-Font-Changes-to-Boost-Readers-Comments-and-Shares-on-Your-Blog.png?resize=1024%2C573&ssl=1\")
<\/p>\n<\/p>\n
This guest post is by Bnonn of Information Highwayman.<\/a><\/em><\/p>\n You may not realize it, but the font settings on your blog can have a huge effect on how many people read your content.<\/p>\n And how many people read your content has a huge effect on whether a post goes viral.<\/p>\n How huge? Well, by some accounts I’ve read, just one common mistake with colors could reduce readership by a factor of five. And if you\u2019re not making that mistake, you\u2019re probably making at least one of four others. So in this article, I\u2019ll give you the five most important best practices for presenting text to keep readers glued to your content, and away from the old back button.<\/p>\n At the very top of the the pile of legibility problems is font size. Back in 2005, Jakob Nielsen reported<\/a> that in a survey of web design problems, bad fonts got nearly twice as many votes as the next contender\u2014with two-thirds of voters complaining about small font sizes.<\/p>\n Sadly, nothing has changed since then. A random sampling of new blog designs at SiteInspire<\/a> (a web design gallery showcasing the best of the best designs) shows that the average font size for body copy is 12 pixels<\/span>. Some as low as ten pixels<\/span>. None over 14 pixels<\/span>. Similarly, if you randomly sample offerings from the popular Elegant Themes<\/a> or ThemeForest<\/a>, you\u2019ll find that every single theme sets post content at 12 or 13 pixels.<\/p>\n And of course, other theme creators tend to follow the lead of the bigwigs.<\/p>\n But as usability and typography expert Oliver Reichenstein of Information Architects points out<\/a>, 16 pixels<\/span> is the font size that browsers were intended<\/em> to display by default\u2014and it is not<\/em> big. 16px text on an average screen looks about the same size as 12-point text in print. That\u2019s the default size for most magazines, as well as all word processors, because it\u2019s the size people find most comfortable to read. Many people\u2014especially those over 40\u2014find it very difficult to read smaller text. As Reichenstein observes:<\/p>\n There is no reason for squeezing so much information onto the screen. It\u2019s just a stupid collective mistake that dates back to a time when screens were really, really small \u2026 At first, you\u2019ll be shocked how big the default text is. But after a day, you won\u2019t want to see anything smaller than 100% font-size for the main text. It looks big at first, but once you use it you quickly realize why all browser makers chose this as the default text size.<\/p><\/blockquote>\n Fortunately we\u2019ve pretty much moved past the days when content authors thought that fuchsia on blue text<\/span> was cool. But white on black text<\/span>, known as reversed type, is still pretty common. As are variants like white on some other dark color.<\/p>\n Reversed type reduces not only the number of people who\u2019ll bother to read your content, but also their comprehension<\/em> of it. This is because it strains the eyes. Staring at reversed text for an extended period tends to create a kind of \u201cglare\u201d effect, where you feel like the letters are too bright to look at. Depending on what research you consult, studies show that light on dark text reduces your readership between 50% and 400%.<\/p>\n Why risk losing so many readers? Black or very dark gray on white looks clean, and there are plenty of great themes that use those colors.<\/p>\n Here\u2019s another little-known rule that a lot of blogs break. In order for your eye to easily follow one line to the next, you want no more than 75 characters in each line. This is called the line measure. Beyond a measure of 75 characters, it\u2019s hard to track the end of one line to the beginning of the next without getting lost.<\/p>\n On the other hand, if you have a measure of less than 45 characters your eye will get fatigued quickly, because you\u2019ve barely started to read one line when you have to jump to the next. You feel like you never get a chance to rest.<\/p>\n For this reason, your ideal post content area will have lines of text about 60 characters long. Of course, you do also have to take aesthetics into account. On many blogs, the \u201cideal\u201d measure leaves a huge gap on the right margin, or makes the text seem squished into a tiny area. I use a measure of around 70 characters on my own website<\/a> for exactly that reason. But if you\u2019re pushing past 80 characters, you\u2019re reducing your readership\u2014guaranteed.<\/p>\n Fortunately this is a less common mistake. If you\u2019re using a professional theme, you probably don\u2019t need to worry.<\/p>\n To give you an example, I\u2019ve set this paragraph at the default line height (also called leading, after the strips of lead used to separate lines of text on old printing presses). It feels cramped and uninviting to read, and it\u2019s hard to follow the lines from one to the next because they blend into each other.<\/p>\n On the other hand, this paragraph is set with a line height of 200%\u2014equivalent to double spacing in a word processor. I\u2019m sure you\u2019ll agree that the lines here feel way too disconnected from each other, and unless you\u2019re submitting a research paper this is not<\/em> the way to go.<\/p>\n Finally, this paragraph is set with a line height of 150%. That means that for every pixel of font size, there\u2019s one and a half pixels of distance between the lines. This turns out to be pretty reliable sweet spot for most fonts you\u2019re likely to use on a blog\u2014but feel free to experiment between about 130% and 160% to see what works best for your own content.<\/p>\n This last tip isn\u2019t exactly a font issue. But it fits into the same general category. Bloggers routinely include images in their posts. Whether or not that\u2019s really<\/em> a good idea is a topic for another time\u2014but for now, let me just give you one piece of advice.<\/p>\n The left margin is sacred. It\u2019s how we track text down a page in the Western world. It\u2019s the \u201cground\u201d out of which the lines grow (often to quite different lengths), and it\u2019s the foundation for our eyepath as we read down the page.<\/p>\n But if you break the left margin, that all goes to hell. Your eye has to scan around to try to pick up the new margin, so you can keep on reading.<\/p>\n In other words, every time you left-align an image, you put a speed-bump in your reader\u2019s path. And you\u2019re compounding the problem by dragging his attention away from the text with your visually dominant image. Needless to say, readers who keep being distracted and having to relocate the left margin often don\u2019t read to the end of a post\u2014so they often don\u2019re share it or comment on it.<\/p>\n By “drop caps” I mean initial capitals, where the first letter of the first word of your post stands out much bigger than the rest. According to research conducted by Ogilvy & Mather, this increases readership of a piece by an average of 13%.<\/p>\n Drop caps aren\u2019t built into most blog themes, and they can be tricky to do on the web, but if you\u2019re up to a little coding, check out this tutorial on how to create them<\/a>.<\/p>\n Now is the time to head on back to your own blog and see which of these five important best practices you\u2019re not practicing. Then, fixum! But don\u2019t forget to share the changes you’ve made in the comments below!<\/p>\n <\/p>\nFont size\u201416px minimum<\/h2>\n
Use dark on light text\u2014reversed is no good<\/h2>\n
Line width\u201445 to 75 characters<\/h2>\n
Line height\u2014130% or more<\/h2>\n
The left margin\u2014don\u2019t break it<\/h2>\n
Bonus tip: drop caps increase readership<\/h2>\n
Five mistakes: which ones are you making?<\/h2>\n