“In a saturated market, having a website that simply serves as a brochure is no longer competitive.”
A company website should represent the brand’s philosophy, promote its products and bring new leads at the same time. Those who aren’t familiar with basic web design principles tend to fail the task.
In this article, we’ll take a look at some of the most popular web design mistakes and show how to avoid bad website design.
Why is it important to understand the difference between good and bad websites?
Business owners usually contact web design companies to create websites and rely on their professionalism.
Being able to see the difference between good and bad websites and evaluate the work of an agency is a big advantage because:
- Not every agency is going to be honest and create the best possible website for you. It can result in a mediocre product which doesn’t bring expected conversions.
- To engage with customers, it’s best to look at a website from a consumer perspective, and no one knows your core target audience better than you.
Here’s why bad sites don’t work:
- 1 Visual design
- 2 Distractions
- 3 Animations
- 4 Typography and text
- 5 Images and illustrations
- 6 Consistency
- 7 Website usability
- 8 Visual appeal
- 9 Consistency
- 10 Ability to help you achieve business goals
- 11 How and where to create a good website?
In 94% of cases, users’ first impressions are connected with website design. – Northumbria and Sheffield Universities
Return of users
- After a single bad experience, a user is 88% less likely to return to that website. – Gomez
Credible of the company
- 50% of users agree and 40% strongly agree that “the harmony between the colors of logo, text, links, and background” makes them think that this company is credible. – University of Surrey
Website design may seem like a subjective matter, but there are some objective design principles influencing users opinions and, therefore, conversions.
Bad vs. Good Website Designs
- Visual design;
- Website usability.
It takes about 50 milliseconds for a user to make a judgment about a website, and visual design affects these first impressions.
To figure out, if it’s a good design, ask yourself:
- Is the website visually appealing?
- Does it go hand-in-hand with a company style?
- Isn’t it distracting?
Let’s move on to our list of Bad Websites 2018 and go through some basic rules to avoid web design mistakes.
Do you remember the times when every website had flashy images, animations and was filled with all kinds of colors? Now, we consider them a “forgotten past”, but, sometimes, we still come along bad websites which are distracting and even annoying.
These elements make users run away from a website immediately:
- Background music;
- Overused Flash;
- Too bright colors;
- Distracting gifs;
- Annoying animations.
That said, the Patimex website is a true design mistake.
EveFit studio website made by Weblium is bright, has videos and hover animations but isn’t distracting.
- The colors and photos broadcast the company’s style and are targeted at women;
- There’s enough white space, the text is easy to read and is distributed logically;
- The sections are well-divided by design elements and pictures.
Learn from good and bad design examples. You can apply animations to explain who you are in a detailed manner. For the 3Dev website, Weblium has chosen faded images and bright animated text, which tell you everything you need to know about the company right away.
Typography and text
Bad typography kills great content. These typography design mistakes create an impression of a sloppy website:
- Too big or too small font sizes;
- Never-ending paragraphs;
- Non-matching typefaces;
- Silly fonts like Comic Sans.
Jerry Pippin Show website can boast almost every typography mistake there is.
Here’s how to master typography.
This photographer website also consists of a big amount of pictures and text. But here’s how it’s different from the bad example:
- White space allows you to read without stressing out your eyes;
- Big chunks of text are divided into small paragraphs which makes them easy to understand;
- In the “About me” section, a large photo guides readers through a long text;
- The description of the studio is in bolder font and on a different background to stand out from the text block above;
- The drop-down tools simplify navigation in the FAQ section.
Images and illustrations
Images matter, as they can create a long-lasting impression, demonstrate products from a better angle and motivate consumers to build relationships with a brand.
- Fake stock images;
- Low-resolution photos;
- Pictures not fitting the website parameters;
- Images not related to the text.
How to handle images?
A Perfect Tan website has lots of bright images that beautifully illustrate services, products, and blog posts. Even if you don’t read the text, you still understand what the company offers, and that’s a result of a good design.
Inconsistency is what makes a bad website.
Go through this short checklist to avoid this design mistake:
- All colors match each other and are taken from your brand book;
- All elements deliver a consistent message;
- You can form an opinion about the company by looking at the main page only.
Surprisingly, the “Hunger Games” book author has a very inconsistent website with elements scattered all over the place.
Sending a consistent message is key.
Jikiro is a business consulting company, therefore, they don’t have photos representing their work. To avoid fake stock photos, they decided to create illustrations in a corporate style and use them to visualize what they do. Here’s what they got on their website as a result:
- Every sentence leads to the main idea and explains what services they offer;
- Several calls-to-actions look differently but lead to the same action: request a free consultation.
Your website conversion rate could increase by 200% to 400% with a well-designed interface created with a user in mind. To achieve that, it should include:
- Information hierarchy;
- Clear conversion paths;
- Responsivity appreciated by search engines;
- Clear navigation and structure;
- Easy-to-read copywriting.
Where2Eat is one more example of bad website design: it’s difficult to understand where to click and what to expect.
This is a great website from Weblium portfolio which combines vital UX design principles:
- Elements and photos match;
- Texts are easy to understand;
- Important information is illustrated;
- It’s responsive;
- Call-to-action buttons are distinctive;
- The navigation is clear.
There are a lot of things to consider for a one-page website if you want to know more.
What is the difference between good and bad websites in a nutshell?
Let’s sum it up. The core difference between good and bad websites lays in visual appeal, consistency and an ability to help companies achieve business goals.
A good website can boast a clear structure, easy-to-use navigation, and non-distracting design, while a bad website makes you feel confused or even annoyed.
A good website matches a company’s philosophy and tone of voice and sends only one message with each element. On the contrary, bad websites give a mixed impression and look like they’ve been put together out of a few different sources.
Ability to help you achieve business goals
A good website brings leads, builds company image, raises search engines ratings and helps companies achieve other targets. Conversely, bad websites just exist out there and don’t bring any good to business.
How and where to create a good website?
Reaching out to the Weblium “do-it-for-me-builder”, you always get a high-quality website. Our professional team has already created more than 11,500 web designs, and our experience expands, as this number grows.
With Weblium you get:
- A quality website at the 1/10 of the average market price;
- Website development in a matter of days (compared to months in regular web studios)
- Ready-made website with an intuitive control panel which lets you make any changes fast and easily;
- Personal manager ready to answer your questions and guide you through Weblium interface and services.
We start with creating a free prototype of your new website: no hidden costs or obligations.