Blog Tip Sharing Project 5: Blog Design

A nice* blog design makes people want to stay and read.

Nice (in reference to blog design) adj. “A blog that doesn’t make your eyes bleed when you click over.”

I think that everyone has opinions on what a nice blog design is, some of us think a background design looks really cool, where others think that lots of white space is the cat’s meow.  Some people like two sidebars, others prefer three or even four.  Since this blog series is about what has worked for me, that’s what I’ll focus on, but also include some links to helpful articles and blog posts I’ve read on the subject.

Today we’re going to cover overall blog design…and yet again I’m giving you the much coveted list.

1.  A unique design makes you look more credible than a default template (like those provided by Typepad, Blogger, and WordPress.)

I know that when I switched from one of Blogger’s stock templates to a unique three-column design with custom header, I had an increase in readership.  Certainly there are exceptions to this, as two of my favorite blogs, Swistle and Oh, The Joys, simply use the Minima template provided by Blogger and they are doing justfinethankyouverymuch without a fancy pants design.

There are thousands of free templates that you can find simply by googling “free template for blogger/wordpress.”  Also, simply adding a unique header, easily made with the assistance of a program like Photoshop Elements can spiff up a basic template.  If you happen to use Blogger for your blogging platform, Tips for New Bloggers is a great site that walks you step by step through tweaking and customizing the basic templates.

If you prefer a truly unique design, there are many reasonably priced web designers who can help you.  Here are just a few…

Dawn and Coming to a Nursery Near You
Dress My Blog
Temptation Designs (on a brief hiatus due to the birth of her second baby boy!)
Judith Shakes Designs
NW Designs
Oh My Stinkin Heck
Izzy Blog Design and Graphics
Blogs Gone Wild
Splat Creative Designs
Swank Web Style
Jenny at Absolutely Bananas (headers and buttons)
Me! I can help make headers…but that’s about it.

2.  Whatever template you choose MUST be fast loading

When people have 1000+ unread in their Google Readers or those who’ve stumbled upon your blog have to wait for your page to load, they simply aren’t going to wait and will click away.  Therefore, you are LOSING READERS.   Waaa!

I had to take my twitter badge off of my sidebar because it was causing slow loading time.  That makes me want to cry, but I did it FOR YOU because I heart you even more than I heart twitter.  Other things that slow loading time are cluttered sidebars, coding errors, and flashy ads or backgrounds.

3.  Make sure that whatever template you choose for your blog looks nice* in all web browsers.

You can check this by going to browsershots.org.

4.  Your blog should be easy to navigate.

a)  Is it obvious where to comment on your blog?  Also, don’t make people have to register to comment!  Adding that step could possibly make people throw up their hands in frustration!  Edited to add:  I’m not referring to blogs powered by Blogger, but rather blogs that require you to register to even comment.

b)  If your header isn’t “clickable”, then you really need to make a button that people can push to send them to your “home” page.  This is easily done in your sidebar…for example on my last template, my header wasn’t clickable, I made a “home” button by writing this code:

<a href=”http://playgroupsarenoplaceforchildren.com>HOME</a>

You can also make your header clickable…somehow…if anyone would like to share with the class how to do this, please do so in the comments section.

c)  Is your most recent post the first thing at the top of your blog?  If it isn’t, people aren’t going to scroll around looking for it and you are LOSING READERS!  WAAA!

5.   Did I mention before the design should look nice*?

Oh yes, I did! And this is what I mean…

Think about these things…the colors you choose for your background, headers, links, and fonts.  Make sure they are easy to read.  Stay far, far away from tiny fonts, they’re too hard to read!  Beware of really elaborate or flashing backgrounds, as they can distract from your content.  If you have ads on your site, make sure they don’t overwhelm your content.

There is also a debate around the blogosphere about music that automatically plays on blogs.  I personally don’t mind the music, but there are people who swear that they immediately leave if music starts playing.  It’s just something to consider.

Here are a few links to posts that discuss blog design…

Make Your Blog Design Work For You

17 Resources for Creating a Blog Design

Good Blog Design

Next week I’ll discuss your blog’s sidebars and use of pages.  It will be a RIOT.

I’d love to hear what you all have to add about nice* blog designs.  Please, please, please, please…make certain your comments don’t sound like “I hate blogs that…”  I certainly don’t mind people putting in your opinions about what makes for a good blog design, just please consider the feelings of others.  Also, let me know if you’ve seen any results from StumbleUpon this week…I’m so proud of you who have really jumped right it and stumbled your little hearts out!

Previously in this series…Part 1, Part 2, Part 3, Part 4

64 Responses to Blog Tip Sharing Project 5: Blog Design
  1. Headless Mom
    June 21, 2008 | 12:33 am

    I’m loving this series. I’m getting ready to go custom and all of these tips help-a lot!

    Headless Moms last blog post..One Hundred Push Ups

  2. Good & Crazy
    June 21, 2008 | 12:53 am

    Well this was up early…
    I came in search of your stumble lesson to share with a friend and this was already there…
    I’m ready to prettify my blog…let’s do this!

    Oh, and I see the changes in your profile info, picture etc…aren’t you all cute?

    Good & Crazys last blog post..Parenting Today. But maybe not tomorrow.

  3. Elizabeth
    June 21, 2008 | 1:17 am

    Thanks for this series of posts on blog tips–they are very helpful for a new blogger like me!

    Elizabeths last blog post..Books again, and the (not so) high cost of home ownership

  4. Knot
    June 21, 2008 | 5:12 am

    I usually make my own designs. I latched on to a place called “Final Sense” that makes Blogger templates. The CSS for the colors is what I don’t want to wade through so I find the text color I like then just simply make a new background and implement it. I’ve see what’s involved with wordpress and …. uh no thanks … Blogger has the others beat on that.

    Knot

    Knots last blog post..Quickly

  5. feener
    June 21, 2008 | 7:20 am

    first i love your blog set up, who did yours and is it wordpress or blogger. i am in the midst of wanting to update mine and change it. but i really don’t know where to start.
    i like how when someone comments it leaves their last post.
    i like easy navigation and not frilly flowering TONS of badges stuff
    i really like when people put the shared items. i think that is a great quick way to find other blogs of interest
    i don’t even know if my blog makes people sign in or use a code???
    hubby is techie and yet he hasn’t helped out

    feeners last blog post..ummm

  6. Maggie
    June 21, 2008 | 7:21 am

    I have to say, I am one who really prefers that music not play automatically. When there is loud music that all of the sudden starts blaring out of my speakers I am usually less than excited about it.

    I do agree that a custom header is something that really makes a difference in the appearance of your blog — I think it’s always nice to see what people come up with!

    Maggies last blog post..Summary Saturday: Project 365, Week 25

  7. rachel
    June 21, 2008 | 7:41 am

    This was well written, again. You’re doing a wonderful job on these blog tutorials/tips.
    I’m not a fan of music on blogs and if it takes forever to load, I’m out of there.
    I think I passed the check test on these tips. ;-) I hope.
    Have a wonderful Saturday and good luck staying off the computer!

    rachels last blog post..A Strawberry ‘Ku

  8. amy
    June 21, 2008 | 8:03 am

    thanks jen-
    I never knew about browser shots! cool. So what does my site look like to you? A mess? Tell me! :)

    amys last blog post..In the washing of the water will you take it all away

  9. Kendra
    June 21, 2008 | 8:14 am

    Thank you so much. This is very helpful. I have just started blogging and I’m trying to get mine to look the way I want. I worry that it is too bright right now. I’ll see how it goes and may end up changing it again.

    Kendras last blog post..Changes

  10. ohmommy
    June 21, 2008 | 8:32 am

    Cute sassy new picture. Congrats on the google search too!

    Educational as always. I have changed some things on my blog since you started this series. Thanks.

    And… sidebars next week. Eeekkk… I. Can’t. Wait. I never know what to do with mine.

    ohmommys last blog post..Oh. My. Gosh. I am not ready to stop singing.

  11. mep
    June 21, 2008 | 8:32 am

    Yes, yes, yes! This is the post I have been waiting for! I have been eager to customize my blog and have done some internet searches for tips but come up short. Thanks for the great list of resources.
    Hopefully, I’ll come up with a custom header soon! I love yours, by the way.

    meps last blog post..Dear Abby, I just found out my husband is a polygamist or possibly just someone else’s babydaddy . . .

  12. Cathy
    June 21, 2008 | 9:05 am

    I just turn off the sound on my laptop if music starts playing – I don’t click away. = )
    I love when there’s something extra on blogs – like dooce wtih her daily pictures and bossy with her guess and press. That way, even if they don’t post, there’s something I can look at.
    And being able to click to home is so important – if I can’t find the home button I get so frustrated!

    Cathys last blog post..‘cuz I’m a Sheep, Haiku Style

  13. HRH
    June 21, 2008 | 9:15 am

    I am a StumbleUpon convert and am now holding a StumbleUpon revival with alter calls. Seriously, close to 300 additional visitors yesterday. If anyone would like to join my congregation, my page is: http://texasholly.stumbleupon.com/

    Thanks Jennifer for the StumbleUpon information and for being such a sweet StumbleFriend.

    I love this information too. A blog design is such a personal thing and it has to hit the writer right and the reader right. Not an easy balance. Just as a two cents thing, I am a fan of no music. For some reason it is never the music that I am in the mood to hear. I just turn it off on my computer so it is not that big of a deal, but that is my two cents.

    HRHs last blog post..What to wear when trapping beavers…

  14. K
    June 21, 2008 | 9:42 am

    Yeah autoplay music drives me crazy. When H was a baby he was startled awake on more than one occasion by loud midi music blaring out from some webpage. I always leave my volume on mute now just avoid the occasional musical page. Music drags down the loading time too.

    Ks last blog post..Birthday Crown

  15. Jennifer
    June 21, 2008 | 10:09 am

    feener, My blog is proudly powered by WordPress (self-hosted) which is different that WordPress.com sites.

    I designed my header, which frankly, I’m really proud of!

    This template was designed by http://antbag.com.

    Thanks for liking it, I really like lots of white space. I need to figure out how to make my center area wider somehow.

    Your blog doesn’t make people sign in…in fact, I think that I need to clarify that I’m not talking about blogger blogs…I’m talking about blogs that you must be registered to even comment. Off to add that edit into the post!

  16. Jennifer
    June 21, 2008 | 10:13 am

    amy, I really like your site! Especially your header, it’s dainty, small, and not overwhelming. You also post lots of picture, which is something I personally love. And the picture of yourself in your sidebar is fabulous! I’ll touch on that next week.

  17. Jennifer
    June 21, 2008 | 10:15 am

    ohmommy, one of the greatest things about your site, is your pages (under your header). It really helps keep the clutter in the sidebars down to a minimum.

  18. Jennifer
    June 21, 2008 | 10:17 am

    HRH, so glad SU is giving you results! Woo hoo! As we speak there are 34 people on my site RIGHT NOW since this post was stumbled by someone, which is ALOT for me!

    I’m off to go thank the kind person who stumbled the post!

  19. Irene
    June 21, 2008 | 10:17 am

    I would also add that unless your blog is ONLY pictures with very little text, never use reverse type (light type on dark background). Photos look great on a dark background, but text doesn’t. It may look nice, but it is so much harder to read than dark text on white or light background. (I learned this tip from my days writing and designing marketing materials, but it is SO true!)

    Irenes last blog post..Photostory Friday! FIRE!!!!!

  20. Mrs. Who
    June 21, 2008 | 10:55 am

    This series has been incredibly helpful for me! I have a suggestion for you and any readers who are interested. It’s something I learned about on another blog just recently and now I do it constantly. Whenever you have a link in your post, it’s easiest for your readers if it opens in another window. For example, I went to the site you suggested to check how my blog looks, then I was stuck there while I waited and had to reopen your post to read the rest. You can tell it to open a new window like this:
    1. Put in your link.
    2. Go to the html code and find the link.
    3. Where the url is located, like this: , type target=”rightside” inside the url
    4. Like this:
    5. It makes life so much easier for your readers!

    Mrs. Whos last blog post..For Fun Friday – June 20, 2008

  21. Mrs. Who
    June 21, 2008 | 10:57 am

    OK, I don’t know why my example didn’t appear – maybe it didn’t like the way it was typed. Anyway, here’s what it should look like: “http://iknowwhereyoucanfindit.blogspot.com/”target=”rightside

    I didn’t put the < signs because maybe that’s what it didn’t like!

    Mrs. Whos last blog post..For Fun Friday – June 20, 2008

  22. jean
    June 21, 2008 | 11:00 am

    I’m still getting the hang of SU. Right now I’m having having fun clicking stumble and seeing what comes up. I’m still trying to figure out what the other stuff. I may have to go back and read the SU post again.
    Lovin the series though!

    jeans last blog post..Psst I Have Something To Tell You But I Cant Tell You Yet

  23. Jackie
    June 21, 2008 | 11:01 am

    Useful tips… thanks!
    I HATE when I visit a site with music because –
    #1 – Maybe we don’t share the same taste in music
    #2 – It’s difficult to have some quiet ‘quality time’ with your computer when someone else’s music starts spontaneously…

    I kid…
    Not really…

    I’ll be back to check out your next installment of this series!

    ;)
    Jackie

    Jackies last blog post..4 Hour (not so) Funny Bone…

  24. Jennifer
    June 21, 2008 | 11:04 am

    Mrs. Who, That is a great tip! When I put a link in my site, I have the option of making it open in another window…I’ll try to remember to do that from now on!

    Thank you!

  25. that girl
    June 21, 2008 | 11:08 am

    I’m going to wordpress this week, so this was timely :)

    that girls last blog post..ThatGirl Reviews: KungFu Panda (B+)

  26. Jennifer
    June 21, 2008 | 11:08 am

    Oooh, I had one more thought about links opening in another window…you can make any link open in another window by left AND right clicking on it!

    I’ll still try and remember to make links automatically open in another window, though!

  27. Tonya
    June 21, 2008 | 11:42 am

    Great tips.

    I for one hate music playing on blogs. I either turn the volume way down if it’s a friend’s blog or I just don’t visit. It seriously annoys me.

    With headers you can use a website called Scrapblog to make a custom header. It’s easy and addictive too.

    Tonyas last blog post..HAPPY BIRTHDAY TO ME!

  28. Andrea's Sweet Life
    June 21, 2008 | 1:06 pm

    I am still trying to figure out how to change things on my site, because I am totally ignorant of such things AND because I use Quick Blogcast, so a lot of the commonly suggested things don’t work for me. This series has been SO helpful!

    I like a site that is easy to navigate. I like lots of pictures, but content, too. I’m more into entertaining posts than anything too educational, unless I’m looking for something specific. The one pet peeve I have so far is people using abbreviations (like text or message board speak) in their posts. I’m not sure exactly why it bothers me so much, but it’s enough to make me not come back.

    I’m fairly new to blogging and just had my 100th post! I’m giving away some FREE CHOCOLATE, so come on over and enter to win!
    http://blog.sweetlifesite.com.

    While you’re there, take a look around and give me any suggestions on layout, design, etc! I SURE need it!

    Andrea’s Sweet Lifes last blog post..Get Your Free Chocolate!

  29. moo
    June 21, 2008 | 1:16 pm

    This was great! I have a really hard time reading the “darker” background-ed blogs and anything with music … I’m out of there!

    Can’t wait for the next installment!

    moos last blog post..seriously, is this week over yet?

  30. Marilyn
    June 21, 2008 | 1:21 pm

    Excellent tips, my dear! A subject (that used to be) near and dear to my heart. :)

    I loved your SU post. I didn’t see any results on my blog, per se, but I enjoyed seeing some new sites and giving some props to my peeps. ;)

    Marilyns last blog post..You Need to Read – June 21

  31. Jennifer
    June 21, 2008 | 2:06 pm

    Andrea’s Sweet Life, I think your blog looks excellent! I like what you have in your sidebars, not too much clutter. It’s a easy to navigate theme, easy to comment…Nice job!

    Glad you’re enjoying the series!

  32. Maggie's Mind
    June 21, 2008 | 3:01 pm

    I recently had my blog redesigned, and it’s a place I like to go and to post even more now. I’ve eliminated so much of my sidebar crap, but there is still more to get rid off. I did make some changes so that at least the post itself will load before some of the slower widgets because it’s so true about people not wanting to wait around – folks are busy. I’d love to hear your thoughts if you feel like visiting mine.

    I strongly dislike music on a blog. To me it’s no different than people who blast their music at a stop light not caring that most people probably do not share the same taste and don’t want to hear it. If I have to hunt around for where to hit pause or stop or whatever, it’s easier to click away. Forever. Harsh, but true. There are a few people that I like enough to visit anyway, but I still wish they would make the music more “opt in” rather than “opt out.”

    Maggie’s Minds last blog post..Haiku Friday 6/20/08

  33. Jennifer
    June 21, 2008 | 4:17 pm

    Maggie’s Mind, Your blog looks FANTASTIC!!! I haven’t visited in awhile, sorry, but WOW!! It really is great.

    I love the header and colors. I love the two sidebars on the right. It looks very clean.

    Nice job!

  34. dysfunctional mom
    June 21, 2008 | 6:01 pm

    Just weighing in on the music thing, I”m not a fan of that either. I don’t immediately click away, but I do immediately hit “MUTE”.

    dysfunctional moms last blog post..Today, I had a chauffeur.

  35. Jean
    June 21, 2008 | 6:01 pm

    OK you were looking for a clickable header tutorial and here is one. http://betabloggerfordummies.blogspot.com/2007/03/clickable-headers-for-new-blogger.html

    Now I will warn you that the color on this bloggers tutorials is awful, but the content and instruction is simple. Hope it helps!

    Jeans last blog post..Psst I Have Something To Tell You But I Cant Tell You Yet

  36. Marye~
    June 21, 2008 | 6:34 pm

    I have been doing my homework and I even thought I jump ahead so I changed my blogs template just before I came to class. Of course I used one of blogger templates. I will look into being more creative after class.
    I also posted, something I haven’t been doing because I was down about not having any comments. Well, as I discovered, quite by accident a number of people I know have been reading, but haven’t been posting. I hope you can do a class in the future about how to get people to post.
    Thanks for everything Jennifer!

    Marye~s last blog post..Gardening in the Yard

  37. applepiesf
    June 22, 2008 | 12:57 am

    Lately, I am understanding why people have anonymous blogs. “Andi’s Exciting Life” started out as a way to share photos and kid updates with family and friends, but I often would like to talk about other things as well. The trouble is, making sure it is interesting, funny, and appropriate for all the people who might read it (my mom, my boss, conservative friends, strangers, etc.) is pretty limiting. I don’t want to share anything too personal, use harsh language, or gossip about anyone for fear of offending my (few) readers. That makes it pretty dilute (and kind of boring).

    So… Now that I am thinking of starting a new blog from scratch, this series is especially helpful! I really appreciate you taking the time to help us all out!

  38. Dawn @ Coming to a Nursery Near You
    June 22, 2008 | 4:41 am

    Awesome post, Jen and of course, I Stumbled you :) Thanks for the shout-out :)

    Dawn @ Coming to a Nursery Near Yous last blog post..Photo Hunter – water

  39. [...] Blog Tip Sharing Project 5: Blog Design [...]

  40. ali
    June 22, 2008 | 9:07 am

    to me…a CLEAN design is the number #1 most important thing. it doesn’t have to be fancy – or super awesome, like mine (hahah. i didn’t design it, so i take no credit for it) but it has to be easy on the eye. and easy to navigate.

    total dealbreakers for me? reasons i will click the heck right off your site? white writing on a black background. YEESH. ouch on my eyes. or automatic music. EEK!

    alis last blog post..tuition well spent…and a race around the world

  41. Sarah
    June 22, 2008 | 9:22 am

    Thanks for the tip on the browser checker!! I’m happy mine looks alright in most of them (all but a few I didn’t recognize). I’m always working on my sidebars, cleaning them up…it’s so hard to let go sometimes :D

    Sarahs last blog post..Weekly Winners – 6/22/08

  42. Queen of Shake Shake
    June 22, 2008 | 2:44 pm

    I don’t know about others, but I find reading a blog with a black background very achy on my eyes and I’ll click away. it really does strain my eyes and they aren’t getting any younger.

  43. VDog
    June 22, 2008 | 9:32 pm

    Ditto the black background/white type thing… it’s like that staring at a picture of a black skull then looking at the white wall game you played as kids.

    Kristen @MU said it best: “2008 is the year of the unadorned blog!” LOL

    VDogs last blog post..Supermodel (You Better Work!)

  44. Fairly Odd Mother
    June 22, 2008 | 10:24 pm

    Thank you, thank you! I finally got a ‘home’ button on my site. Now, if only I could figure out how to replace Blogger’s About Me stuff with something I’ve written. Any tips?

    Fairly Odd Mothers last blog post..Cheaper Than Therapy

  45. Worker Mommy
    June 23, 2008 | 12:37 am

    Vouching for Sam at Temptation Designs. That woman totally rules. I am in love with my blog design ;)

  46. Jennifer
    June 23, 2008 | 7:05 am

    Fairly Odd Mother, I think that you can choose not to display your “About Me” section, or you can put your about me at the bottom of your page.. Then you can use Bloggers text widget to write what you want. I did that when my blog was powered by blogger. It looked like this:

    I’m Jennifer
    [br/]
    Mommy to…..
    [br/]
    Wife….
    [br/]

    The [br/] put breaks in between the lines otherwise it would have looked like a paragraph, although paragraphs are just fine (I just wanted to show you how to do it that way. The [ are replaced with the “greater than” and “less than” signs < ,>. Also, there is no space between the < and the br. I just wrote it that way so that it would show up.

    If you want to use a picture in this text box, I think you can do that by putting a code from an image hosting site like Photobucket. I upload a picture I want to use, then resize it to “avatar”.

    Hope that helps!

  47. Jennifer
    June 23, 2008 | 7:12 am

    Worker Mommy, your blog DOES look fantastic! Sam does great work. She helped me with some coding on this site, without her my header would still be left aligned…I couldn’t get that sucker to center for the life of me!

  48. Mrs. Who
    June 23, 2008 | 7:50 am

    This comment is in response to the person above who asked about changing the “About Me” section on blogger. The best way I have found to change any of the information on the sidebars in blogger is to do it in a post. Just open a new post, create whatever you want with pictures, etc. Then copy the html code. Now go back to your layout and choose which side you want it on, choose to add html code and paste in your code. Voila! You can put anything on the sidebars this way.

    Mrs. Whos last blog post..Pssssst. Wanna Win Something?

  49. Domestic Chicky
    June 23, 2008 | 2:11 pm

    Hi Jennifer!
    I have SO enjoyed this series, and have sent a few clients over here for some “blogging 101″ help. I can help you with your main content width if you want…anything for another BD chick ;-)

    Domestic Chickys last blog post..Ack!!

  50. andi
    June 23, 2008 | 9:53 pm

    You just keep on rocking this blogging help thing. Thanks! I think for a lot of people blog design is overwhelming at first, but if they can even add a bit of uniqueness to their site via a header at first, I think that makes a lot of difference. (This coming from a big design chicken who uses a default template with a unique header).

    andis last blog post..How to embarrass yourself at work