33 comments

6 Simple Blog Design Tips For A Better Blog

When it comes to designing your blog's layout, simplicity is key – especially if you're a beginner.

Your overall blog design should be kept simple and clean. Content should always be the main focus of your blog, but having a clean design layout is important. Your goal should be to make it easy for your reader to navigate your site, and find the content they want to read or see.

Simple Design Tweaks Make Blog Better

There are lots of great articles on ProBlogger about design (and a great on here on IFB about color combinations), but one in particular said that among other things, you should design your blog to make these things clear to the reader:

Where am I?
Where should I begin?
What is the most important thing on this page?

Simple, right?

But you can easily sabotage your readers' ability to navigate and find what they're looking for with a cluttered, distracting blog design. Here on IFB, we've rounded up 6 simple blog design tips that can benefit bloggers of all levels. Check them out below and let us know your thoughts in the comments.

Make Sure Your Header is Simple

Your blog's header is the first thing a new reader sees, so make it good! I personally prefer simple font-based or typography headers with the blog's name in them (ex. Into The Gloss), but the right images can be fun as well. Also, don't make them too tall so they take up valuable real estate at the top of your page – you should be able to see your first post title and some content before the fold.

Use Full Width Images

If you post outfit pictures, collages, or any images on your blog, they should ideally be the full width of your content column. And hopefully it goes without saying that all your images should be the same width.

Uniformity is key to simple blog design; you want the eye to flow easily over images (although there shouldn't be too many).

Use a Blog Design with One Sidebar

I really find that blogs with a main content column and one sidebar are more clean-looking and appealing. They're also easier to read; your eyes aren't “confused” about where to go, they naturally go first to the widest column where your content is. Interestingly, eye tracking studies show that readers generally view pages in an “F” pattern – first horizontally across the top, then down a bit and across, then vertically down the left side of the page. If you look through some of the images in the studies, a left sidebar generally gets left out of what the reader looks at altogether because the eye goes first to the content. So why have it?

Make Sure You Have Content Before the Fold

Generally readers focus most of their attention above the fold (how often do YOU scroll down?), and sometimes don't' even go further to see what else is on your page, or even finish your article, so make sure a reader can get the main idea of your first post before having to touch their mouse. Repeat visitors and engaged readers will usually scroll down, but readers who come from search engines want to find what they were looking for quickly without scrolling down, so make sure they can. (Analyze your stats to see which pages get the most search engine traffic, then make sure key information is at the top of those posts.)

Place the Most Important Information at the Top

This advice follows from the previous, but it's worth an extra look. Did you know that your about page is the second thing people look for when they get to your blog? Make sure the link to your about page is prominent, and if you have a widget in your sidebar with a photo and some “about” text, make sure it's near the top of your pages. Also, place your social buttons near the top of your pages, as well as your navigation bar.

Use a White/Light background

Too much contrast on your pages make them difficult to read – stick with a white or very light background for your page and ALWAYS a white background for your content areas.

How have you tweaked your blog design to make it better? Any other tips? Let us know in the comments below.

Editor's Note: This post was originally published on June 21st, 2013 by Grechen Reiter. It was updated on December 26th, 2017 by Laura Kell.

Leave a Reply

Your email address will not be published.

33 Responses

  1. Stephanie

    Great article! Also, to make sure that all posts have a good set of social sharing buttons.

    Reply
  2. Nasreen

    Really great tips! That point about eye-tracking is really interesting, going to read the article now. I have a simple header, everything’s black and white with a hint of colour but what I find hard is to translate my personality to the page. I don’t want it to look like everyone else’s but I don’t want to make the page very busy looking either. I feel like it’s just so plain right now.

    If anyone has tips, I’d greatly appreciate it!
    http://lazyobsession.blogspot.com

    Reply
    • Grechen Reiter

      your header is good! maybe add a little color? but otherwise, your site is great, very clean 🙂

      Reply
      • Nasreen

        Thanks Grechen! I think you’re right, a little bit more colour is what I need 🙂

    • Danielle

      Your blog is amazing!!!! The header is perfect,I viewed it in mobile so the background was white but your post are top notch❤

      Reply
    • Ashley

      Just looked at your blog and I love it! You just gained a new follower(:

      Reply
    • Grechen Reiter

      Melissa – you don’t have to use sidebars at all, i do think they help organize all the “extra” stuff though.

      Reply
  4. Andra Dorolti

    I think I follow most of the rules!
    However, I like to start a post with a photo, before I write something… what you said got me thinking… maybe I’ll change that 🙂 But even so.. I feel that some people will just not read, anything at all.. no matter where you write..or how much you write.. Depends on what everybody looks for, I guess…

    thank you for the tips!

    Reply
  5. Miche

    I think I hit most of these (though, my sidebar might be a little messy?) Any tips/advice/critiques always welcome!
    http://www.buttonsandbirdcages.com

    Reply
  6. Juliana

    I really loved this post! I’ve been fiddling around with my layout lately because I knew I wanted to change something, but wasn’t very sure what to change. I loved this post because the tips were really helpful and helped me narrow down what I should change, but if anyone has any suggestions, I’d really appreciate it!

    – Juliana
    Coco and Picasso

    Reply
  7. lucia

    great article!!! very usefu, thank u so much for the tips

    GIVEAWAY ON MY PAGE www.thestyleoflucia.com

    Reply
  8. Laura Neuzeth

    Great article! I have to agree, simplicity is very crucial in a blog. When I see a blog that is very cluttered or colorful I tend not to read it. I just like to be able to read it easily and too many colors can be distracting from the text.

    Reply
  9. Anne the SpyGirl

    A font that is easy to read. Cursive fonts, no.
    Font color that is neutral. Shocking pink is very difficult to read!

    Reply
  10. Muna

    thanxxx 😀 …so this article confirms that I have done a good job until now? I hope so! I leave the floor to the readers, pass to my place and let me know what you think! Have a nice weekend!

    http://munascoolture.blogspot.it/

    Reply
  11. The Science of Happy

    Yay, my blog does all of these!

    http://thescienceofhappy.blogspot.co.uk/

    Reply
  12. choolee

    i think i hit most of this tips…
    do you guys think i should add some more stff in my sidebar? or filled enough?

    chicchoolee.blogspot.co.at

    Reply
  13. Miss City Chic

    i honestly agree 100 percent with these tips! simplicity simplicity when it comes to a blog design! Also, crisp photos definitely draw me into a blog 🙂

    Reply
  14. lesimplyclassy

    totally just went and retweaked my entire blog, thanks for the tips! xx
    http://lesimplyclassy.blogspot.com.au/

    Reply
  15. Tavoya

    These are great tips. I have taken the strategy of following the formula of top fashion magazines and Retailers sites that I like. I’ve learned there is a reason I love these sites and it is their ease of readability and ease of navigation.

    www.haute30.blogspot.com

    Reply
  16. Kendall with Sex and the Suburb

    We recently gave our site a mini-makeover so it’s great to see some of the changes we made on the list of things to-do. Some of the list we have always been doing but it was fun to play around with our site to give it a new look and the ‘relaunch’ has been a lot of fun.

    I’m sure everyone is very busy but any feedback would be greatly appreciated! Love it or hate it? 🙂

    Cheers,
    Kendall
    http://sexandthesuburb.com/ (I don’t usually leave my site since I read not to previously on IFB but this time it seems right to haha)

    Reply
  17. Odette

    I agree with all of these tips the only thing I haven’t done is place the most important information at the top, but I will get to it, as I’m redesigning my blog.

    Reply
  18. Olive

    I love this post, it’s so interesting how making a few slight adjustments can make your blog look so much more visually pleasing.

    I must say though, I disagree with images having to be the same width as the content. For landscape images, yes, absolutely, but for images in portrait format it’s just too much. This usually makes them so big that I can’t see the whole picture on my screen at once and I have to scroll down to see the rest. Personally I find it annoying and disproportionate.

    Reply
    • Ashley "Ashe" Robison

      Olive, I typically feel the same! What I do is (in photoshop), merge two portrait images into 1 jpeg. This way they’re still the same width, but aren’t disproportionate either! So best of both worlds. (That’s just how I personally cope with keeping them all the same width while not having a MASSIVE portrait.)

      Reply
  19. Danielle

    Great Article❤ I really need to change my header :/ Maybe some of you fantaboulous fashion bloggers can tell me what to tweak?

    Reply
  20. Amanda

    Great tips! Love it, sometimes it is hard to come up with this stuff alone.

    http://inspirationandsensation.blogspot.ca/

    Reply
  21. Shermaine

    great tips how can make my blog better ?
    beautycaboodle.blogspot.com

    Reply
  22. JustJessica

    Great advice for someone just starting a blog like myself! I’m finding this site very useful, THANKS!!

    Reply
  23. Arun Kallarackal

    Hi, thanks for sharing these tips. The points you mentioned will definitely help me improve my blog. Thanks again 🙂

    Reply
  25. Ashley

    I’m just working on redesigning my blog and getting it back on track after a long hiatus! I’m working with Blogger and I can’t figure out how to remove the shadow on the background of the blog! Any help?

    http://www.thecoutureset.blogspot.com/

    Reply
  26. Sharad

    Thanks again for helping me in improving my blog. As i am beginner so, it really help me.

    Reply
  27. Noman Sarwar

    Awesome tips you have shared, here i just want to add one more that there must be comprehensive ‘about the author’ section at the end of each blog post in order to add a professional touch to your blog and writing as well.

    Through this way, it would be easier for your readers to know the author without visiting the other pages of your blog.

    Reply