I think your blog design can make or break your blog. It might not be as important as amazing content, but sometimes a bad design can turn someone off before they even give your content a chance. Total bummer right? That is not what you want to happen to your blog.
Not gaining readers simply because of something you can change is flat out dumb. Don’t miss out on readers because of common blog design mistakes.
Now I know not everyone is a designer or can code their blog themselves. But there are certain things you can definitely do on your own or keep an eye out for when you choose a blog design or theme. Knowing the blog design mistakes to avoid is incredibly helpful.
Now imagine there are two blogs with very similar content. One has a nice, clean and easily navigable design the other is hard to read and seems to have no rhyme or reason to the layout. Which one would you rather stick around? I don’t know about you but I would without a doubt choose the first one!
Are you curious to see what 25 common blog design mistakes you could be making but can totally fix?
1. Your blog looks cluttered.
Nothing is worse than landing on a blog and not knowing where to look or knowing what to do next. People have short attention spans, TIME magazine says that now you have a shorter attention span than a goldfish. A GOLDFISH! That is crazy. If people can’t make sense of your site because there is too much clutter, they will just leave.
How to Fix: Make sure that every thing on your site has a purpose and has enough breathing room.
Tip: Ask a few people to take a look at your site. Ask them what their first impression was and what action they think they are supposed to take. If most are confused, you know you’ve got a problem.
[bctt tweet=”Is your blog cluttered? Plus 24 other blog design mistakes to avoid.” username=”blogmelovely”]
2. Your blog has bad navigation.
Bad navigation can be anything from not having any navigation (an absolute no-no), to overcrowded navigation (make use of drop downs people!) to too much navigation. Have you ever been to a site where there is both a navigation bar and navigation in the sidebar but they both look like the main navigation? There is no distinction between them and you just don’t know what is more important.
How to Fix: Make sure you have a top navigation bar. This is the most common place for navigation. Think of big retailers like Target and Nordstrom. They use a top navigation bar with drop downs for categories. It is intuitive and you know exactly what to do.
3. Text is difficult to read.
There are many reasons why text can be hard to read: the font is too small, the font itself is hard to read (think of script fonts), there is not enough contrast (light text on a light background or dark text on a dark background), and reverse text (light text on a dark background).
According to Design Hacks, with more high definition screens and great type options available you don’t necessarily have to use a sans serif font. Though that has been the standard for years.
On Blog Me Lovely, I still chose to use all sans serif fonts. Well besides a script font in my logo.
However, be sure to choose a font with distinct letterforms, that come in a variety of weights and that are easily readable when small.
4. Too many fonts are being used.
Choosing fonts can be so much fun. It is amazing to see all the options there are. But that can get you into trouble. Too many fonts can make your blog look like an unfocused mess.
How to Fix: Stick to 2 – 3 fonts max.
[bctt tweet=”Stick to 2-3 fonts max. Plus 24 other blog design mistakes to avoid.” username=”blogmelovely”]
5. Too many colors or colors that hurt your eyes.
Just like fonts, you can have too many colors. For Blog Me Lovely, my colors are pink, purple and blue. Even within those colors though, I stick to one tone. It is part of what creates a recognizable brand. Think of Tiffany and Co. You would recognize their blue anywhere.
The tone, tint or shade of the colors matter too. Some colors are just hard on your eyes. And colors look different on screens. At some screen angles, colors can look incredibly light and hard to distinguish. Be sure to keep that in mind.
How to Fix: Choose colors that are pleasing on the eye. Ones that don’t bleed into the background and provide contrast. Even better if you look into the psychology of color!
Remember, you don’t just use a color because YOU like it.
6. Lack of visual hierarchy.
A visual hierarchy is super important. It tells the reader where to focus and what is most important.
Think of textbooks, there are titles, headings and sub-headings. There is a logical hierarchy and you know what is most important without even thinking. That is how you want your blog to be.
How to Fix: Make sure you have logical size, color, font, etc. changes between titles, headings and body text.
7. Your logo/header graphic is too large.
We have all seen the blogs where the logo/header is the only thing you see above the fold. I am not a fan of this, unless it adds some sort of value. Some people don’t like to scroll. If they don’t see value above the fold, they leave. This is something so easy to fix. I mean what are you gaining by having such a large header image?
How to Fix: Make your header image smaller, it’s that simple!
8. Content is difficult to scan.
Remember how people have a shorter attention span than a goldfish? Well if someone can’t scan your content quickly to see if it is of value to them, they probably won’t read it at all.
I know when I am in a hurry, I quickly scan a blog post for headers, bullets, blockquotes, etc. to see if anything sticks out to me and if I think reading it would be a good use of my time. I utilize this at Blog Me Lovely. It helps break up the post and make it scannable.
How to Fix: Break up your text! Don’t write long paragraphs without breaks. Add in bulleted and/or numbered lists, headings and block quotes. It makes it more visually interesting. And easier to read.
[bctt tweet=”Using lists on your blog helps your content stand out and makes it easy scannable. ” username=”blogmelovely”]
9. Links don’t stand out.
I get so frustrated when I accidentally click on something and I am all of a sudden directed away or when I don’t realize there are links in a post.
Luckily, you don’t have to distinguish links with the classic blue underline. Unless you want to of course. With CSS you can customize links in many different ways. The key is to make it stand out from the rest of your text.
How to Fix: Make your links at the very least a different color from your body text. And make it a noticeable color change. You can then change the hover, active or clicked link phases, or even have them underlined, bold, uppercase, etc.
10. Too many pop ups.
This is a no brainer. I find this very annoying. I especially don’t like when there are multiple pop ups. It makes me think of a spam site.
How to Fix: Have a single pop up if necessary (I know they are great for converting readers into email subscribers)! Better yet, have it pop up after a user scrolls a certain percent of your page or spends so many seconds on your page. That way the user is already engaged and more likely to pay attention to what is in the pop up.
11. Bad quality images.
This is a major no-no, especially with sites being such image focused lately. I mean Pinterest is completely about the look of your image, many people don’t even read the descriptions!
Blogging isn’t like it was five to six years ago, you can no longer succeed with poor images. Remember, an image doesn’t necessarily have to be a photo it can be a graphic too.
How to Fix: Luckily there are so many great options to choose from.
For photography, you can find stunning and free stock photos. Here is a list of 30+ amazing sites with breathtaking free stock photos. I have personally used Death to the Stock Photo and Pexels in the past.
For graphics, I use Photoshop. If you need an easier and free tool, Canva is amazing.
[bctt tweet=”It is 2016, there is no excuse for sub-par images! Plus 24 other blog design mistakes to avoid.” username=”blogmelovely”]
12. Image sizes don’t fit your blog.
You could have images that don’t fill up the full width of your content (leaving too much awkward white space), images with varying widths that look like a mess, or probably the worse offender – images that are LARGER than your content area.
How to Fix: First, figure out the size of your content area! Second, make sure every single image/photo/graphic is that width. No more, no less. It is okay to have varying lengths though.
13. Centered paragraph text.
I think this is a controversial topic. Personally, I don’t think your entire paragraph text should be centered. I think it fits for certain posts or even certain sections of your post but not the entire thing. I want you to think of books. Do books have centered text? No, I didn’t think so!
How to Fix: Left align your text. Use centered text sparingly.
14. Lack of white space.
This one is huge. White space allows your page to look clean and uncluttered. It gives your content room to breathe and is much easier on the eye. It separates content and allows a visitor to enjoy your content without distractions.
How to Fix: Make sure you have a clear separation between each element on your page. The content area should be clearly separated from your sidebar and navigation. Content should not bleed into each other.
15. A cluttered sidebar.
I have seen sidebars with pretty much every widget available plus ads and affiliate links and items you just aren’t sure why they are there. I’ve been there too. It is a very common mistake. But more isn’t better. You want your readers to focus on your content right? Well, the busier your sidebar is, the more distractions there are.
How to Fix: Make sure everything in your sidebar serves a purpose. Stop and think if you really need it and what value it is adding to your readers.
[bctt tweet=”Is your sidebar adding value to your blog? Plus 24 other blog design mistakes to avoid.” username=”blogmelovely”]
16. Too many ads.
I am not a fan of ads. I don’t think they add any value to your site design. Especially if you do not get to choose the ads that show.
Have you ever been to sites that have ads in the sidebar and beneath the posts and pretty much anywhere they will fit? They don’t look good, do they? They are actually pretty distracting! Below shows an ad immediately below the sidebar, then the title (blurred out for anonymity) and then another ad before you even get to the content!
What about the sites that have ads with the most disgusting pictures in them? Like so gross I don’t even want to describe them on here. Yeah, well those ads could potentially show on YOUR site too (depending which ad platform you use).
If you are thinking “so what, they make money” then I want you to read 11 Ways to Successfully Turn Your Blog into Your Job (Including Two to Avoid) by Melyssa Griffin. Can you guess which list they are on?
How to Fix: Don’t use ads!
If that is absolutely not an option, I would say reconsider. If still a no, then make them blend with the page. You do not need one above your logo, one under your post title, a few in your sidebar, and a creeping up ad on the bottom. Be tasteful.
17. Your blog isn’t mobile friendly.
With people spending more hours on their mobile devices than desktop/laptop computers, there is no reason your site should not be mobile friendly. If that isn’t enough, Google is boosting the ranking of mobile-friendly pages on mobile search results.
How to Fix: My first option would be to choose a blog design or theme that is responsive. If your current design or theme is not responsive and you are looking for a quicker fix, there are many WordPress plugins that will make a mobile version of your site and if you are a Blogger user, you can enable the default mobile template.
[bctt tweet=”It is 2016, having a blog that is not mobile friendly is so not okay.” username=”blogmelovely”]
18. No search bar.
The search bar is an essential part of your blog design. Especially if you are serving as a resource to others. It allows a reader to immediately search your site for whatever topic interests them.
How to Fix: Add a search bar to your site either in your navigation bar, sidebar or footer. I personally have one in my sidebar and in my footer.
For WordPress users, just add the search widget. For Blogger users, just add the search gadget.
19. No social share buttons or too many social share buttons.
We live in a world filled with social media. Social media helps your blog get found. It is a free form of marketing and can act as word-of-mouth marketing. So why would you not have social share buttons on your site?
That is one extreme, the other extreme is having too many social share buttons. It starts to look cluttered, like the example below which has them on the side and then three separate sets beneath the post. Way too much.
20. No social media follow buttons.
When I find a blog I like, I love to find them on social media and connect. I can’t be the only one. You are missing out on potential followers if there are no follow buttons.
How to Fix: Add social media follow buttons somewhere visible and where someone would expect to see them. Your header, navigation bar and sidebar are popular places.
21. No contact info.
When your contact information is hard to find or non-existent, you make it hard if not impossible for people to find you. I really don’t like when I want (or worse need) to get in contact with someone and they have me searching for hours on end. You could potentially lose out on clients, advertisers, etc.
How to Fix: Make your contact information easy to find. It is okay if you have a separate contact page as long as the link to it is obvious.
I have an email icon with my social media icons that will make a new email pop up as well as a contact page linked to from my navigation bar.
[bctt tweet=”Make sure your contact information is easy to find! Plus 24 other design mistakes to avoid.” username=”blogmelovely”]
22. Untested for errors.
Site and design errors annoy visitors and create a bad user experience. Pages break, it happens (especially with updates). The thing is to not let the issues stay around for long.
How to Fix: Test, test and more tests! This is so important. I tested every page on my site before I went live. I test every link in my posts before and after I hit publish. I am constantly checking for errors.
Tip: If you see an error on someone else’s site, shoot them a nice FYI email to let them know. They may have no idea and you could be helping them out! I have done it a few times and I have always got an appreciative response back, even if they already knew about it.
23. Music and videos are on auto play.
This isn’t as common anymore luckily. But think about it, many people are reading your site while at work whether it is on their phone or on a computer. Could you imagine how embarrassing it would be if all of a sudden you land on a page and music starts blaring or video starts playing unexpectedly? I would immediately hit back and not return until I got headphones or something.
How to Fix: Out of respect for others, turn off auto play for all videos and music.
24. You are using flash.
Okay, so this is not a huge deal for bloggers. But you may be a business owner with a flash site. I have bad news, the search engines can’t read flash! So that means anything that is in your flash file is not being scanned by the search engines. From a design perspective, flash does not display on all devices.
How to Fix: Remove any flash and choose video or a Slideshare presentation instead.
25. Your blog design does not resonate with your target audience.
This one is HUGE. You don’t design your blog for you or because you like the colors. You design it with your target audience in mind. Say you are a trendy fashion blogger, but your blog design looks like a bland corporate blog. That doesn’t work.
How to Fix: Define your target audience. Think about what they like and what resonates with them. Design your blog theme around that.
Don’t freak out if you are making some of these blog design mistakes. They are quite common. I would think about what changes you want and can easily make to your blog and start there.
[bctt tweet=”Are you making one of these 25 blog design mistakes?” username=”blogmelovely”]
What changes are you going to make?