Basic Blog Design Principles

We all want our home on the web to have personality. Frankly, all blogs have some sort of personality. But is yours showcasing the proper one? Or does it suffer from an identity crisis?

When we begin working on our blogs, most of us understand that design is important, but just don’t know the rules of design to follow. Unless you pay someone to create your design, this will be left up to you. So it is helpful to have a basic understanding of simple changes you can make to create some visual impact on the web.

If you can keep these things in mind, you can create a lovely space on the internet, regardless of the blogging platform you use.

Remember the rule of threes. Try to stick to three main colors for your blog. When you start throwing more than that into the mix, it confuses the eye.

Solution: choose three colors based on the suggestions in principle #2, below. This doesn’t mean you can not have additional colors in your design. It just means that there should be no more than three main colors.

Site that provides a good example of this: The Nesting Place

Color Balance (using the color wheel)

  • Be careful when choosing a background pattern. What looks lovely in a small image can be very distracting when covering your screen.
  • Vibrant text colors are hard to read.

Solution: Choose colors that fall side-by-side on the color wheel or colors that are opposite on the color wheel.

Site that provides a good example of this:  Out on a Limb

Fonts – avoid Comic Sans, and other hard to read fonts. Serif vs San Serif – Serif fonts are fonts with tails; like this. Sans Serif fonts are fonts that do not have the tail; like this. Traditionally, Serif fonts are considered the easiest to read for printed material, because the tail pulls the eye across the word. However, blogging and other web design lends itself to a bit of flexibility on this due to the frequent use of short/one-line paragraphs.

Solution: Try to stick with the common fonts provided on blogging platforms, especially Times New Roman, Arial and Verdana.

Site that provides a good example of this: Everyday Mommy

Keep your sidebar tidy. We probably all start out with this as a goal. But before long, you get cute little graphics for posts you’ve written, or for carnivals you participate in. Before you can say “I all of this clutter is making my eyes bleed”, you’ve got a mess in your sidebar.

Solution: Consider creating a page dedicated solely to buttons and awards. When you receive them, place them on this page. Link to it from your home page, so that others can check them out when they choose to.

Site that provides a good example of this: Balancing Everything

Consider the emotion of the colors you are using. Do they match the words and posts you use on your blog? Do you use a cheery tone on your blog, but use dark, gloomy colors for it? Do you write with a sarcastic, biting tone, but have a romantic, floral print for your background? It’s your blog, so seriously, you can do whatever you want with it. But it you don’t want to confuse your readers, choose colors that are inline with the tone of your blog.

Solution: For a detailed look at the emotions of color, take a look at this article on color meaning.

Site that provides a good example of this: Oh! How Lovely!

A well-done blog banner has a lot of impact.

Solution: Even if you can’t afford a full blog makeover, consider purchasing just the blog header from a designer. They will most likely be happy and willing to suggest colors to use to finish the rest of the look.

Site that provides a good example of this: LucyKate Crafts

You can do it. Stick to these principles and you’ll have a blog that is visually equal to the awesome writing you publish on your blog.


  1. Thanks for the link!

  2. How helpful is this!!!!! Thanks….Lylah

  3. Karla,

    Thanks for the great post! The examples you gave for each point were very helpful. I’m an artist, so I really enjoyed visiting the site about color meaning. Thanks again.

    Keep up the good work!


  4. I can’t believe that there are even fonts that are better than others. I only think about colors! What if my font stinks! And now I’m wondering about that tail thing!

    What a great site!

    Thank you!

  5. that’s good stuff right there!

  6. These are great ideas! I’m bookmarking this for future reference.

  7. Thanks! GREAT tips!! I want to clean up my sidebars!!


  8. Karla, just found your new site & I’ll be back for more blog tips. I think I need to clean mine up a bit. Thanks a lot!

  9. Awesome post. I loved checking out all the links. I have been looking at a lot of blogs lately during my re-design and it is sometimes difficult to find really good examples…wish I had been by here sooner!

  10. Great article! Interesting color- emotion link! I just chose new colors for my blog, just seeing what I like, and here’s what they communicate:

    Aqua is associated with emotional healing and protection.
    Olive green is the traditional color of peace.
    Purple is associated with royalty. (God)

    Perfect for a blog that deals a lot with Christianity and personal growth!

  11. Another great post! I am totally in love with your site – it has been bookmarked.

  12. I enjoyed reading your post; I am running a small website on video conferencing I am a beginner in this business. I don’t know much about it but I am searching around for material that can increase my knowledge


  1. […] (For info on the design aspect of your blog, see my post on Basic Blog Design Principles.) […]

  2. […] 3 Boybarians Blog Desgin: Keep it Clutter-Free and User Friendly by Melanie at Blogging Basics 101 Basic Blog Design Principles by Karla at Modern Media […]

  3. […] (For info on the design aspect of your blog, see my post on Basic Blog Design Principles.) […]

Speak Your Mind