User experience

10 Design Mistakes You’re Probably Making on Your Website

By Raeleen

| 19 January 2022

One of the most important factors to the success of a website is its design. The look and feel of your website creates a lasting first impression on a visitor and helps build trust for your brand.

Website design encompasses both visual and technical aspects. The visual component includes the layout of text and images, the colour palette, the images themselves, fonts, icons, and other design elements. The technical aspects pertain to website speed and how the website functions overall.

A well-designed website must not only look good but also provide the best experience for its users. It takes a certain level of skill to be able to create a website that looks good and functions well as both aesthetics and technical knowledge come into play. Novice web designers might commit web design mistakes that could derail the success of your website.

Here are some of the top website design mistakes to avoid.

Not Designing For Your Audience

Don’t ignore the platforms your customers are on right now. Have a look at your stats on where your audience is, and what platforms and devices they’re using.

You can’t get away with not having a responsive website now so designing for mobile is a given. But your stats might tell you that 80 percent of your audience are on their mobiles, so you will need to put 80 percent of your love into mobile design.

Not Setting up a Colour Palette from the Beginning

Don’t underestimate the power of the colour palette! When you’re looking at your user experience, there is a lot you can do to make your site come together, and using colour consistently across your site is one factor that your user may not overtly notice, but the beautiful unity of colour will give a feeling of coherence and strong branding.

And don’t fall into the trap of only establishing the colour palette of your brand. You will also need a secondary colour palette including any colours you might use across the site, otherwise, you could end up with 50 shades of grey when four would have sufficed. It also pays to check all of those colours across your devices because some colours will show up differently.

Using Poor Quality Photos and Images

Images on your website can enhance its visual appeal. But the quality of the images you put on your website matters.

Anything pixelated and blurry shouldn’t be on your website. If using big images, make sure that they really stand out to make an impact. Or else you’ll have an average looking image covering the width of your webpage which would only emphasize how boring and ordinary the image is. Also, be sure to use one to one scaling so that the images won’t look skewed. Get up to speed on how to optimise your images online, which means ensuring the image looks good but isn’t a huge file. Having lots of big image files on your website can dramatically slow it down.

Having Too Much Going On

In web design, less is more.

Inexperienced designers might make a mistake of trying to pack all sorts of information above the fold because this is what the users first see. Others might use too many fonts and all the colours of a rainbow in an attempt to make the web page creative. Adding animations just for the sake of it without considering how they help usability is another BIG mistake.

Packing too much content or too many design elements on one page does not add visual appeal. It will make your page look cluttered and confusing. On the technical side of web design, too many elements can slow down the website and affect its performance.

When your website is unappealing and slow because it is littered with too many design elements, it will be bad for the user experience and can drive your target audience away.

Lack of Consistency Throughout the Website

The web pages of your site should have a coherent look and feel throughout. Choose a style and continue throughout the website. Nothing worse than a homepage that looks formal, then another page that looks fun and lighthearted. Consistency of style is very important and will encourage your website visitors to keep clicking around, rather than wanting to leave because the experience is jarring.

Stick to your colour palette and use consistent typography in all of your pages. Ensure that all pages appeal to your defined target audience.

Call to Action Not Clear and Prominent

The visual design and content of your website are what will hook the visitors’ interest. You must nudge them in the next level of interaction –whether it’s making a purchase on your site, downloading an ebook, subscribing to your newsletter or filling in a form.

Including a clear call to action on your website is one of the ways you can increase your website’s conversion rate. Use a strong command verb that directly specifies your desired action to start your CTA. For example, a CTA that says “Download Now!” is clearer and more effective than “Available Now!”

The placement of your CTAs also matters. They should be prominently displayed on the page.

Still Not Embracing Responsive Design

Responsive web design is an approach to web design that allows web pages to look and function well regardless of what device they are being viewed from.

One compelling reason why you need to embrace responsive design is that Google prioritises responsive websites in their rankings.

Also, you don’t have to build a mobile version of your website to make your website mobile-friendly when you use responsive design. Thus you can save money and effort because you only have to build and maintain one version of your website.

Not Optimising your Website for Speed

Fast websites will have a lower bounce rate, higher conversion rate, higher ranking in organic search and will greatly improve user experience.

There are several things that web designers and developers can do to make your website faster such as the following:

Compressing images to an acceptable quality

Images are one of the largest contributors to the overall page size which can affect page loading time.

Using high-quality images on your website is important to make your website look professional. But it is also important to optimise your images so that they will not slow down your website. This means reducing the file size of your images using an image compression tool without sacrificing quality.

Using content delivery networks

Generally, when serving static files from your own servers, the load time increases when users are physically far from the server.

CDNs use geographically distributed servers to speed up the delivery of static files such as CSS, images, fonts, and JavaScript to your visitors. What this means is that the server closest to your visitor will be serving the files.

Reducing the number of plugins

Plugins are a great way to add functionality to your website. However, be sure to use only the plugins that your website can’t really do without because they can affect your website’s loading speed.

Minify HTML, CSS and JavaScript

Before we discuss what minification is, a short note on the terms used here.

HTML or hypertext markup language is used to create a web page that may contain text, images, links, etc. HTML is used to mark and describe each of these kinds of content so the web browser can display them correctly.

CSS or cascading style sheets is a language used for defining the styles and design of your website (for example font size and colour, columns, background colour, etc).

JavaScript is a language that is commonly used to create interactive effects in web browsers.

Minification is the process of removing unnecessary spaces, formatting, and comments from HTML, CSS, and JavaScript files to reduce the file size. Smaller file sizes load faster and the output is functionally equivalent.

Poor Kerning, Tracking and Leading

Kerning refers to the spacing in between individual characters. Tracking on the other hand is the spacing between groups of letters or blocks of text. Leading is the spacing between lines of words. The closer together the characters are, the harder they are to read.

Proper kerning, tracking and leading can improve the readability and enhance the user experience of your visitors.

Inadequate White Space

White space improves readability and draws attention to more important parts of the page. Think of white space like a breath of fresh air for your website visitors!

Web Design Agency Brisbane

Do you need a new website or to have your existing website redesigned? Don’t rely on inexperienced web designers who might commit the above-mentioned web design mistakes.

Mettro, a leading web design and development company in Brisbane, provides top-notch web design services for any type of business.

We are a proudly Queensland, independently owned and operated digital agency that has been delivering award-winning website design & development and digital marketing for over 20 years. We are dedicated to solving our client’s business problems with smart, simple digital solutions and have the testimonials to prove it.

We’ve built thousands of digital solutions including apps, eCommerce websites, custom software, eLearning applications, WordPress websites and Shopify Websites.

Written by Raeleen | 19 January 2022