Make Reading Your Blog Easier: 3 Tips

I love cruising the web, checking out different blogs. I've been doing a little surfing lately and there are a few things regarding design and usability I thought I'd mention.

1. Limit your header image height

I recommend you keep the header image on your blog less than 150-200 pixels high. (If you can squeeze your nabvar nicely in that space too, you get bonus points!) Don't think it can be done? Check out The Pioneer Woman. Her header image is 121 pixels high and her navbar is another 45. That's 166 pixels for a great-looking header. (Click for a larger view.)

The Pioneer Woman Header

I have visited a number of blogs recently with really large headers — some so large that when the site pulls up, all I see is the header and in order to read any content, I have to scroll down. This is not ideal.

Take full advantage of the space "above the fold" (what one sees as soon as your site loads and without scrolling). Don't fill it with your header. Instead, make sure readers can see at least some fresh content as soon as your site pulls up.

2. Just say no to light text on a dark background (in most cases)

Light text on a dark background makes reading very difficult. It's much, much easier on the eyes if you have a light background with dark text.

There are some sites that work with a dark background but they're generally image-focused (photography sites with lots of photos, for example). If your posts contain mostly text, a white or almost white background is a better choice.

3. I need space!

I know I'm going to ruffle some feathers here. This is just my opinion, so I'd love for all of you to weigh in in the comments.

Too many sites feel overwhelmingly cluttered. Now, I will admit I am a minimalist by nature, and I go for things as plain as they come. In other words, I'm on the extreme end of "boring". :) Just look at my pathetically plain sites.

But oh my goodness, I see a lot of sites with highly-decorated backgrounds, plus sidebars with all kinds of widgets and buttons and friend lists and gadgets and gizmos…and even some flashing and blinking and dancing. Oh my!

My advice? Be not only selective, be strategic about what you place in your sidebars. I think too often we view our sidebars as "leftover" space. Don't just throw something up there because it's cute or fun. Keep only the things that are critical to your blog's success.

If you want to make money with ads, put up a few ads that are really effective (above the fold!) and ditch the rest of it (or put it on a separate page). If your blog is all about friends, a widget highlighting your community is good, but go easy on the widgets. Not only can they make your site feel cluttered, they can also slow your site down.

If, after optimizing your sidebars, you discover you have space for something fun or cute, go for it, but in general, less is more when it comes to blog design.

Do you agree? Disagree? What tips would you give?

Comments

  1. i hugely agree on the sidebars. i always emphasize in site navigation on my sidebar

  2. Your comments about space are consistent with Joy from Five Js Design who spoke at the Savvy Blogging Summit. I'm thinking of ditching my blogroll and am looking for a plugin that will show recent visitors and their most recent post. I seen that on Blogger just need to find it on WordPress.

  3. I like all those tips. I made my header smaller halfway through my design, but it is still probably too big. I really focused on an uncluttered sidebar, although I do still have some things there. I am definitely not a design pro, so any tips are great!

  4. These are all really great tips! I'm immediately turned off by cluttered sites with way too much going on in the sidebars.

  5. Well, shux! I have two of your negatives. I can't do much about my header, the theme dictates the size. I personally like my header though. It's unique, but big. I can see how people don't want to scroll down…one could really wear out their little fingers by doing that :) Then my font is white on black. This is a problem if the reader has a vision problem. If your vision is perfect, it's not hard to read. I guess if anything, you could go to my site to check your vision, if the words start to look fuzzy, you need glasses, haha! I have debated changing the font to a different color than white. I have only had one complaint. I know that this is good advice, they have all been a concern of mine in the past. I am locked into mine since I love my theme though. Thanks for the post.

    • Amy :

      LOL, T, you crack me up. One of your greatest strengths is being your own person. I've admired that about you for a long time. I need more of that!

  6. Katie :

    That's so true — the only blogs I read regularly have clean, organized space. Good tips! Thanks.

  7. I think scrapbook style blogs can be hopelessly cluttered. What I'm about to say will seem spammy and I'm sorry but it's really legit, LOL: At my new site I am hoping to show people how simple scrapbook style blogs can be. It should kind of be like that jewelry rule of taking off one piece before leaving the house.

    So many digiscrappers have beautifully minimalist layouts and I hope to figure out how to apply that to scrapbook style blog design.

    Everything else is spot-on, though. Except I think a well-done photo header or scrap style header can go as high as 300px without seeming like overkill. I also think sometimes that really short headers make a blog seem more like a business website than a personal blog but I know that you kind of are tallking to bloggers trying to make money, so that concern doesn't apply to your target audience. I think. ;)

    Thanks for all of your good tips. I posted at Beautiful Blog Designs this week and talked about your stickiness post and the Seth Godin plug-in.

    (Can I look any less spammy today? Sorry. *blush*)

    • Amy :

      Yes, extra care needs to be taken with scrapbook-style blogs. It can be done, but it can be tricky. I'm not a scrapbooker myself because I lack the creativity, but I enjoy browsing through the gallery at Two Peas in a Bucket. My unprofessional opinion on the matter :) is that a lot of scrapbookers are GREAT at filling their layouts with all kinds of eye-catching layers. Lots of detail can really enhance a photo or two on a page, but online, when there's a lot of text, it's harder to pull off.

  8. I'm a little afraid my header might be too big now. I agree with all your points. Very often the design overwhelms the content. But it's their blog and that's what they like I guess.
    Speaking of readability how come you don't have a mobile theme Amy?

    • Amy :

      Oh I don't think it's too big. I certainly wouldn't go any bigger, but I think it's definitely not something to worry about at this point. :)

      And about my lack of a mobile-friendly theme…oh my. Well, I'll tell you this, it's on my list — just like a new logo, improved sidebar, better navigation, more user-friendly pages, a Facebook landing page (!), and the list goes on and on!!! LOL! I'm so busy writing about how everyone should do all this stuff and I am so not practicing what I'm preaching. I'm so undone. :)

  9. Oh, I know my header is taller than that. I may have to rethink it before I get too attached to the new one. I just cleaned house when it comes to my sidebar, but it's leaving me feeling like it's not quite right. I have to get to work figuring that out, too.

    Thanks for all of your tips! I enjoy reading your posts.

  10. Ha! We just made my header smaller about an hour ago. Whew! I need a new design, but don't like all the cartoon-y, cluttery looks that most seem to be going with now. These are good tips to remember- thanks.

  11. Thanks Amy – this is great advice we hope to live by! We're minimalists too. ;)

  12. Great tips. I'm getting ready to move to WP and will try to put these tips in place when I make the move!

  13. Great tips Amy!
    I think/hope my site complies with all your rules!
    I'm also a big fan of "white space" and I like sites that are open and airy feeling.
    Thanks again for the great advice.

    • Amy :

      It's impressive how you've packed a lot of info in — it's very compact and yet I don't feel cramped. I appreciate that!

  14. I am going to launch my new blog site, http://www.karynclimans.com later today so your article re: blog site tips was perfectly timed! I agree with your comments. It drives me nuts when I have to scroll down just to see a site's content. The mast is important but not that important! Some sites are definitely too busy …. I don't know where to begin. As well, if I have to search too hard for links, I give up trying. They should be placed in an obvious spot. Now it's your turn to critique my new blog site. Please let me hear the good and the bad!
    Cheers,
    Karyn

  15. I am using wordpress for my site and blog at this time. Is there an easy way to add a sidebar?

  16. I agree, good rules! My header is too big, I realized it a few weeks after having a designer make it…I'll have to ask for a new design…there are some things you don't think about till you've made the mistake…! some of us have very little skill with html and graphics, we have to hire someone to do it for us.

  17. Hi Amy,

    I think I have to do some work on my sidebars. Now that I actually look at them, they're not very satisfying, but I'm not sure what to do. I had a vague feeling there was something wrong with them, but never really thought about it until now. LOL You're helping me 'see' my own blog!

    Thanks for yet another great post!

    Annie Kate

    PS Feel free to enter this post in my Tightwad Tuesday meme if you wish.

  18. Great advice! I'm excited to read all the other wonderful posts you have. I want to learn and improve my blog. Would love feedback if you ever have time! :-)
    ~Melanie

  19. Great advice, thank you.

  20. hi amy! your site is fantastic! just wondering…i'm using the theme you recommend now (atahualpa) but i'd like to add my own header image. how do i do that? thanks so much! =)

  21. WordPress has free themes that allow you to upload an image – not too big – for your header. The theme I have now let me insert a smallish photo – which I love!

    I'm also not one for much clutter on the sidebars but I do think all that stuff serves a purpose. When I surf to a new blog, I can quickly see what communities a blogger is akin to. The trick is: how much bling on the blog? lol

    monica

  22. Headers: I have gone to sites where the header seriously filled up the whole page with an image or what have you. Not kidding! I'm not sure what the thinking is by this, because I've seriously almost missed that there was anything more to the blog/site at all…

    Clutter: some of those "Cutest Blog on the Block" type designs are just so, so bad. Folks…if you like cutesy designs and patterns? Save 'em for your bedspread or curtains. I have left blogs before because the design was too hard on the eyes. And whatever you do? NO AUDIO!

  23. Amy!! Your site has been an IMMENSE resource to me!! You and I commented back and forth before Christmas about my blog and I was having so much trouble moving from WordPress.com to .org – so I called it quits until after New Years – but now I am up and running and I COULD NOT HAVE DONE IT WITHOUT your help!!! You are so Awesome to do this for all of us greenies!!! THANK YOU!!!!

  24. Love these tips! Especially the one about the extra large headers. That is my biggest pet peeve when I visit blogs. I hate having to scroll down a half a page just to see some content.

  25. I agree with everything! I made my header smaller a few months ago so that my biggest money making ad could be 100% above the fold. I also don't clutter too much on my sidebar, I won't read sites that I feel like are far too cluttered. And the black background with white letters, does this make anyones eye hurt for a few minutes after reading it? I actually really wanted to feature another woman's blog content on my site, but after seeing her site was brown background with pink letters, I just couldn't send my readers over to her, not matter how great her contest was.

  26. Hi Amy,
    this is my first time on your blog. Great tips, so glad I ran into it. I've been wanting to change my header and make it more attractive and having an image that matches the title of my blog. I also want it to match my button as well. How can I do that?
    Thanks for your input.
    ~Karla

  27. Mary :

    "I need space" – is SO true. Doe ANYONE know how to make those neat little boxes in the sidebar, the ones that have 2-3-even4 buttons accross?? I desperately need to organize my bloggers, and I have searched forever. I don't even know what it's called!

  28. Ok, well I am in the process of changing things up a bit. I get the no light text on dark background for posts…but what about headers? I think you even have a dark background for your header…so I assume when you are referring to light on dark being a no no, you are referring to content..not headers…

    • Amy :

      Yes, a little pizazz in the header is fine, it's the main content I'm referring to. :) It's just that reading anything at length, light on dark, is hard on the eyes.

  29. 1by1 :

    Great Tips, Thanks Amy :-)
    I am just starting out with blogging & I will now try to limit the header space and I also feel a need to increase the text font size!

  30. 100% totally agree with all 3 of your tips. I've been blogging off and on for about 7-8 years, have had many different blogs, and I've always stuck to the principle of clean & uncluttered. That's not to say that I don't appreciate the use of color and pattern on a blog — especially for craft and creative blogs — but so many of them are simply too overwhelming. I thought it was just me — I kinda go spastic when my poor pea-brain receives too much stimuli at once — so I was glad to read your take on those over-decorated blogs from a professional perspective!

Trackbacks

  1. [...] Make Reading Your Blog Easier: 3 Tips – Some great tips. Yep definitely need to clean up my sidebars! [...]

Leave a Comment

*