7 Web Design Mistakes to Avoid

Look for These 7 Web Design Mistakes that DIY's Often Miss

If you are like many other small business owners, you will have tackled the daunting task of designing your own website. Kudos to you!! With so many platforms and drop and drag templates, tackling your own website design has become an easier task. 
Start up businesses often do not have the budget to pay thousands of dollars to have someone else build their custom website, so a DIY is definitely the way to go!

Whether you are still on the fence about hiring someone or making your own website; there are some common mistakes that I have seen non-web designers make when tackling their own website.

I have compiled a list of the biggest web design mistakes that you should pay attention to when building your website.

1. Not Optimized for Mobile

With the majority of the world using mobile no a days to search for everything under the sun; this is SO important in your web design. I personally find it so frustrating to come across a website that zooms into tiny little words.

Over 70% of people use their phones and if your website is not optimized for mobile then 70% of people will not have a good user experience. This means that your business is losing customers!

Almost every platform out there has a built in mobile optimization feature, so make sure you double check and have mobile enabled.

related post wordpress trends for a faster website

2. Pixelated or Blurred Images

This is also a common mistake I see when clients are at the point of a website refresh. Why? Because unless you have studied design, then you would not know about optimizing images.

Most stock images are great for websites. You can find some great images on unsplash, Pexels, StockCake, and Pixabay.

If you have professional photos done these are also high resolution photos.
But let’s talk sizing…..it is ideal to NOT have your photo 6000×6000 because that just slows down your web speed. Ideally anything that is 1080×1080 works really well. So check the size of your images!

3. Too Many Weird Color Combinations

Finding the perfect color combination is actually harder than it sounds. Ideally you want your primary color, secondary color and accent color.
Using the same colors that are in your brand logo are also ideal.
But if your logo color combination does not work for a website then you need to find an alternate solution.
Colors like yellow, lime green, or even bright may work for your logo, but you put those colors side by side in a website and can be overwhelming to your viewers.
Your Header should be 1 color, SubHeading another color then a pop accent color for your call to action buttons/links
Remember: just because your brand logo has more than 3 colors, doesn’t mean that your website needs to have all those colors.

related post Are You Ready to Fall in Love with Your Brand

4. Not Allowing for White Space

This one is also important. Whitespace is absolutely necessary when building a website. You do not want to lose contrast, or overwhelm your visitors. There is a place for your photos, background images, patterns etc. and they need to be placed strategically.

Remember:  You do not need to fill all the gaps!

5. Fonts

Fonts come and go, just like fashion trends. So do your research and find out what are some trending fonts. It isn’t necessary to stick with older outdated fonts.
You want something that is readable for your viewers.

Keep your font limitations to just 2 or 3 MAX. A main heading font, secondary font and your body font.

If you would like to use script font, do not use this as your body font. Keep the body font clean and readable.
Keep all your headers the same font on every page. 

Consistency is key!

6. Alignment

Proper alignment will make your website look professional.
Keep the margins even, body text is always aligned to the left.
Headers can be centered, but do not have to be.

By creating cohesive alignment throughout your website, will keep it clean and professional.

7. Hierarchy

This is probably something I have seen way too much of is proper use of hierarchy.

Use your headings and colors to create hierarchy. This will draw attention to the important things on your website and catch the viewers eye as they scan through to find what they are looking for.

Below is an example of proper hierarchy. You can see by proper use of H1, H2 and text you are attracted to the top line first. Your headings should be larger than the body of text below it.

Hi There

Welcome to My Website

this is where you put the body of text

Conclusion

If you follow these common 7 web design mistakes that are made often in DIY web design, you will be well on your way to having a professional, and clean website.

Using this strategy when preparing to build your website and remember; where you want your visitors to go and what you want them to read is built off of hierarchy.

Less is more!