Subscribe via

3 Web Design Mistakes That You May Need to Fix NOW

In this post I will discuss some of the web design mistakes that I have done on this blog, and what I did to fix them.

A few months ago, I was fortunate enough to get free advice from a friend of mine, Emily Luong, who happens to be a professional graphics designer.  Aside from being a graphics design geek, she’s put in good work on nice sites like Edelbio Skin Care Blog so I do not take her advice lightly.  I asked her to review my blog and what do you know?  It needs improving!

What did the blog look like before?

If you haven’t noticed the changes, here are some snapshots of what my blog looked like before (plus some comments in RED).  Please compare the snapshots to what my design is now.

Web Design Mistakes 1

Web Design Mistakes 1

Web Design Mistakes 2

Web Design Mistakes 2

3 major design mistakes

  1. Mistake: Clutter everywhere
    Solution: Unclutter things by adding padding.

    In the first image, you will notice that there are way too many things going on at the top of my sidebar.  When a reader glances over to the sidebar, all they see is a blur of colors.  Adding padding between things helps readers identify different objects whether it be sections, advertisements, images, or text.  Adding proper padding could result in readers diving deeper into your blog and higher advertisement click-through rates.

  2. Mistake: Complicated design
    Solution: If padding fails then simplify.

    You can only use padding so much until it hinders your design.  If your site is still visually confusing after adding a good amount of padding, you should look into simplifying your design.

    In the first image, you will see that I have all of my social network homes listed on the sidebar.  Do I really need to show this to everybody on every page?  Of course not.  Things of this nature should be move to the about page where your readers can find more information about you (the blogger).

    Also in the first image, you will see that I had a date badge.  Why do I need this date badge if I already display the full date in the post footer?  I know date badges have become popular lately (I’ve seen it on many blogs), but if it doesn’t serve a purpose then out the window it goes.

    Lastly, in the second image you will see that I had a few widgets from social networks and other internet tools.  I do not believe that anybody would need 10+ social network widgets in the sidebar.  I find that it’s best to only display 1 or 2 widgets that help get the most (and most relevant) traffic.  I can then focus on building my blog exposure on those social networks (that work) instead of spreading myself thin across too many social networks.  Aside from the obvious quality traffic & time saving benefits, I now have a less complicated sidebar.

  3. Mistake: Unorganized information
    Solution: Guide your reader by establishing an information hierarchy.

    If readers come to your blog for the content, your better make sure that they can easily find yours posts at a glance.  You can control the way a reader reads your site by organizing your information in a hierarchy using font size and font color.

    If you haven’t noticed, the hierarchy I chose for my blog is the following (more important > … > … > less important): post title > sidebar section title > post text > comment text > nagivation links > everything else.  I also made my RSS subscription images extra big to draw readers to subscribe.

    More important things should have larger fonts with higher color contrast.  Less important things should have smaller fonts with lower color contrast.

In Conclusion

Comparing my current blog design to the snapshots taken a few months ago, you can see how such simple changes has tremendously improved my blog design.  These tips are quite basic, but definitely powerful.  They are easy enough to implement without having to majorly redesign your blog.  I would like to encourage every body to take a quick 5 minutes to evaluate your blog to see if these tips can help you out.

On another note, do you see other things wrong with my site design that I did not address in this post?  Are my suggestions just bogus?  Please feel free to share in comments!  I promise that there won’t be any harsh feelings.

Save and Share
StumbleUpon
Reddit

10 Responses to “3 Web Design Mistakes That You May Need to Fix NOW”

[go to last comment]
  1. Will

    Nice post; I too should take another look at my padding situation. I did so somewhat recently, but didn’t fix it to large enough degree.

  2. Thaya Kareeson

    @Will
    Thank you for visiting. Please let me know how it works out for you.

  3. Artem Russakovskii

    Love the new subscribe icons. Also, I think Emily’s suggestions are great, but you’ve overdone it a bit on the titles – I think they’re too big now, or maybe too bold. Just my opinion.

  4. Thaya Kareeson

    @Artem
    Thank you for the compliments. The titles may be a little too big as your said because some of my titles are now taking up 2 lines. Another suggestion Emily had was to make the text all caps and decrease the font size. That way you can get away with smaller font (and fit more), but achieve the same attention grabbing effect.
    On a side note, to make any text uppercase, you can add this to your CSS property:

    text-transform:uppercase;

    I will experiment with this for my post titles.

  5. Sid Savara – Personal Development

    I really love the new RSS Feed icon as well, it’s awesome. Is that creative commons’ed as well? Would totally understand if it’s not. Did you create that?

  6. Thaya Kareeson

    @Sid
    Thank you but I did not create the icon! I found it in a set of freeware icons at FastIcon. I can’t remember where I grabbed the email icon from, but I’m pretty sure it had a freeware license (I’ll update later once I find it).

  7. Sid Savara – Personal Development

    Cool! That site is great. I am going to go use some of their other freeware icons =). You did a great job matching the icon with your main logo design – it all looks really good with similar styles.

  8. self defense Rob

    *sigh* My blog needs so much work…

  9. Thaya Kareeson

    It doesn’t look to me like your blog needs so much work at all. Regardless, take baby steps :).

  10. TigerTom

    4. Make what you want the visitor to do _VeRy_ obvious. The ‘Buy’ button or ad link should be right in the visitor’s face.

[go to first comment]

Leave a Reply