7 website design mistakes to avoid

alli-blog

Hi, I'm Alli.

I help passionate entrepreneurs, like you, create a strategic brand and website that stands out to your dream clients so you can run a successful business online.

My ultimate goal is to empower you with the tools you need to live your best life by doing the work your love.

Just because you design your own website doesn't mean it has to look unprofessional! Learn 7 common mistakes you can fix to make your site appear more pro.

When you’re just starting out, it may not make sense to shell out the big bucks for a custom, high-end website, but you do need a website.

This leaves you tasked to do it yourself. But just because you do it yourself that doesn’t mean that it has to look unprofessional.

So, what’s the difference between a pro-looking website and one that’s obviously from a newbie? What it all comes down to is paying attention to the details.

Let’s go over the most common mistakes DIYers make that you can fix on your site.

1. A static, boring layout

Have you noticed that some websites seem more fluid while others appear static and that the websites that flow are so much more engaging?

Well, there are a few things you can do to break out of the boring boxed look that you often see on the web.

Use fewer sections by combining the “like” ones together.
So if you have an introduction to your services section for example, rather than breaking these apart into individual sections, put them together to create fewer boxes on the page.

Vary the heights of the sections.
Using the same height for your sections down the page makes for a really boring look. You can easily make your page more interesting by changing up the section heights to add an element of surprise for your viewer. A good way to do this is to break up long sections of text into smaller sections, bullet points, or callouts and use them to create short sections in between longer ones.

Create less harsh transitions
When you use hard lines there are harsh breaks in between your page elements. You can make your page flow more easily with the use of background gradients or graphics and by adding in overlapping elements.

2. Lack of hierarchy

If everything on your page is the same size, nothing stands out. By making more important elements larger though, you’ll point your viewer’s eyes to specific areas to land on rather than just having them glaze over the whole site.

You can create a hierarchy with the images you use, with your headings, and call out text.

Another important thing to remember is to create a hierarchy with your calls to action.

You should have one main thing you want your dream client to do on each page, so make that call to action stand out the most. You can use a secondary style for your other calls to action so that they stand out, but not as much as your primary call to action does.

3. Random Styles

DIYers often get excited to use a lot of different features and styles on a single page, but this can be really distracting. It’s really true what they say that less equals more.

When you create a style, a background style, a section divider, or an animation for example, you wouldn’t want to use totally different styles all down the page. Instead, you want to repeat that same style once or twice to create a more unified and cohesive look on your page.

Just be careful not to overdo any specific effect. You want to create an element of surprise, but not so much that you overwhelm your viewer.

4. Poor use of color

If everything stands out on your page, then nothing stands out. So you can use your colors to create hierarchy on the page as well.

If all of your colors are bold, your eyes have nowhere to rest. This is why I teach my students how to create a 5 color palette for their brands that includes a really light neutral. By using a very light background color like this, you’re able to define an area, but in a more subtle way.

5. Overuse of image styles

Your images can help to create a unique atmosphere on your website. But if you aren’t consistent with the style of your photos, that atmosphere will appear mismatched. So make it your goal to find or to create a set of images that work together stylistically.

To do this, think about how you want your audience to feel?

Images that have less contrast and more muted colors create a more peaceful and serene atmosphere, while images with more contrast and brighter tones will evoke more energy and excitement.

6. Poor alignment and spacing

As humans, we are drawn to things that are balanced and when something isn’t aligned correctly, it jumps off the page in a bad way…it just looks wrong.

Paying attention to the details makes all the difference when it comes to website design. You want to be sure there’s equal spacing around elements and even margins above and below the sections.

You should also use an optimal line length for easier readability and to create white space and a less cluttered look.

Break up any long blocks of copy into short paragraphs (even ones that are just one sentence) or turn text into bullet points that are easier to read and digest at a glance.

In general, you should keep your text left-aligned for best readability, but when you have a small blurb, you can center-align it to create more symmetry on the page.

7. Too many fonts

The overuse of typefaces on a DIY website is a common issue. Using too many fonts will complicate your design and be distracting for your viewer.

You want your website to be easy to look at and easy to read. So choose 2-3 fonts (at the most) to use for your main headings, secondary headings, and your body copy.

If one of your brand fonts is a display-style or script font, only use it in short headings, never in your body copy.

Now if you’re working on improving the look of your website because you’re ready to level up your online business, then I have a great tool that I want to share with you.

It’s my free 30 Days to Launch Playbook that will let you know exactly what steps you need to take and in what order when launching or relaunching your business online.

Are you more of a visual learner?

Here’s a video version of this post.

Free Conversion-Driven website planner

Turn website visitors into paying clients with this FREE guide!

Tired of your website just sitting there? It could be your BEST salesperson, converting visitors into leads and clients. Our free website planner will help you create a strategic website that magnetizes your dream clients and gets results.

DWDS website graphics
DWDS website graphics