8 steps to a more readable blog
This entry was posted on October 24, 2007
What use is a blog that your visitors can’t read? Where’s the point in you working hard on great content if no one can see what it’s about? Here are my top 8 tips to making your blog more readable.
- Keep your lines short. No more than 15-20 words is good. If you have a fluid layout that’s designed to stretch for larger resolutions, consider using max-width in your stylesheet so you can limit the width to 1000-1200 pixels.
- Use a generous line-height. 140% is a good rule of thumb. Too much and you risk your visitors’ eyes getting lost. Too little and your text will be unreadably squashed.
- Colour contrast is good! Dark grey (not black) on white is best, and dark on light is easier to read than light on dark.
- Never ever ever use Comic Sans MS. Ever.
- Small text is not good. Yes, it’s good for your meta data, but it’s not good for your main body text. If you do insist on using small fonts, at least size them in a unit other than pixels so all your visitors can resize your text as needed.
- Allow plenty of space between blog entries. If you’ve spaced out your text, you should space out your entries. Whitespace is good - cramped blogs are not.
- Never use more than three different fonts. One font is best, two fonts is acceptable, but three’s a crowd. Instead, try experimenting with font-variations, font-weights, colours, and sizes. You’ll be surprised what you can achieve.
- Don’t type all in capitals. Capital letters on the web implies that you are yelling at your readers. Do not yell at them!
19 lovely people have commented
“Colour contrast is good! Dark grey (not black) on white is best, and dark on light is easier to read than light on dark.”
Depends on your audience, ha ha. For people with relatively good eyesight this is fine, for people with certain types of reduced vision, contrast is the best thing. I know quite a few people with low-vision that can only read things that are printed in white with a black background. I used my computer on this setting at the Canadian National Institute for the blind, and found it to be much easier on the eyes. It may be why I prefer darker layouts, because I can visually stand it better. White backgrounds can give me a headache, especially when combined with harsh fluorescent lighting…
How can you set maximum widths?
I have seen people talking about it here and there, but I have been to lzy to look it up..
#wrapper {
max-width:1000px;
min-width:600px;
}
It won’t work in Internet Explorer, but it should work with everything else.
I am loving these series honestly. It is amazing that you have so much time to keep writing so frequently. Good job and keep them coming! I hope to introduce some of your suggestions into my upcoming redesign.
^ Yeah, you’d be surprised what I sacrifice for my website. D:
I can read white text on a black background but it’s actually painful and I start squinting. Black on white is the way to go! Spread the word. 
Thanks for the tips, hopefully my blog is readable, but i’ll try and follow some of these pointers if i’m told otherwise. 
I prefer using ems. Do you know 140% in terms of ems?
^ Not off the top of my head, unfortunately. I’d suggest just having a play around. Or go with 1.4em which could possibly be 140% as a decimal.
The best advice you gave was “Never use comic sans.” I just can’t understand how people can actually like the damn font. lol
Another one you might want to consider is when writing a blog to exclude hyperbole. People will often ’skim’ or mentally highlight keywords whilst reading online, therefore the more concise the entry is the easier it will be to ’skim’!
I myself can stand comic sans (to an extent) on random writing that I read, but if you decide to post the writing on your website, please change it to Verdana (my favorite) Ariel (not the best, but it’s neat) or even Times new Roman (though this can give a very ‘default’ impression)
Yes, don’t yell at the visitors, lol, nice one 
colour contrast is also a great tip, nice list
I can’t read anything that uses Comic Sans, seriously. That typeface irrates me.
Hey, this totally makes sense and I agree with it all! Thank you for posting it. I really don’t like when people use a font that everyone may not have on their computer. It sucks. More people should read this post.
Good tips. I would say that the surroundings also have a say in this matter. If there is too many flashing images and scripts rolling it drags my eyes away from the written content.
The most important one is #4. If I see a site using Comic Sans in any way, I go to pour bleach in my eyes.
As for point 1, I think it’s better to speak of number of characters on a line as oppose to pixels. With new monitors with higher definitions pixel size is becoming a less fixed measurement of length.
I normally set my content elements to about 60-80ems.
# Keep your lines short. No more than 15-20 words is good. If you have a fluid layout that’s designed to stretch for larger resolutions, consider using max-width in your stylesheet so you can limit the width to 1000-1200 pixels.
I think thats true, because of that tip, now my blog is getting even more hits lol (trust me it was realyl ugly before)
Leave a comment?
·
Sean said:
This was really helpful! I think I have to impliment some changes to my new layout after this, thanks a lot!