20 Worst Web Design Mistakes to Avoid in 2020
Do you know how long it takes for a viewer to form an opinion about your website when they visit it for the first time? Not even a second! To be precise, most people take about 50 milliseconds (0.05 seconds) to decide whether they like your website or not. That’s how fickle the average consumer is online simply because they have been spoilt for choice when it comes to online shopping. Any business with an online website must try and provide the best user experience to visitors on their website as that is generally the deal-breaker on whether that visitor sticks around or goes to another website.
Online consumers have the attention span of a goldfish, and mobile users have seen a massive 88% drop in their attention span on a yearly basis. That’s not good news for businesses looking to turn online visitors into buyers. Even if the visitor decides to stay on the website for some reason, around 40% of people won’t engage with the website if they find the layout unattractive, and the content is poor.
That puts serious pressure on businesses when it comes to designing their website as they need to strike the right balance between all the main elements of good web design. If your business is struggling to attract visitors on your website and the ones who are visiting are not converting, you should start thinking about revamping your web design because it might be damaging your chances of success.
That is what we will be covering in this in-depth guide on website designing, where we will highlight the 20 worst web designing mistakes that most businesses make on their website and how you can avoid them in 2020. This is Web Design 101 by SEO Resellers Canada, and these are the 20 worst web design mistakes to avoid in 2020.
Table of Contents
- 1.Getting Your Web Design Priorities Straight
- 1.1 How to Build a Trustworthy Website?
- 1.2 Differences Between Good and Bad Web Design
- 1.3 How Do You Identify Elements of a Good Web Design?
- 2.The 20 Worst Web Design Mistakes
- 2.1 Relying on Home Page Sliders
- 2.2 Confusing Navigation
- 2.3 Too Many Call-to-Actions Put Pressure on Visitors
- 2.4 Using Cheesy Stock Photography
- 2.5 Using Icons without Context
- 2.6 Chatbots and Pop-Up CTA’s Overwhelm Visitors
- 2.7 Hiding Content Behind ‘Bells & Whistles’
- 2.8 Forcing Everything Above the Fold
- 2.9 Too Much Animation
- 2.10 Painful and Jarring Color Combinations
- 2.11 Talking About Yourself Too Much in the Web Copy
- 2.12 Poor Use of Whitespace
- 2.13 Placing Ads in the Wrong Places
- 2.14 Scrolljacking
- 2.15 Disabling Zoom on Mobile Websites
- 2.16 Auto-playing Videos with Sound
- 2.17 Hard to Find Contact Info
- 2.18 Not Using Analytics to Measure Performance
- 2.19 Confusing Brand Messaging
- 2.20 Weak Search Engine Optimization (SEO)
Getting Your Web Design Priorities Straight
Before we dive into the worst web design mistakes that you should avoid making in 2020, we have an important question to ask:
- What is your priority when designing a website?
Some businesses go all out when designing their website, while others want a simple layout and design. Whatever web design you choose for your website should reflect your brand and your business as people are going to associate your website with your brand.
Whether it is cool effects or an attractive appearance, you must not forget about user experience and website functionality, as those are the two most important aspects of every great web design. The interface of the website is important, but what really carries weight is the functionality of the website.
There are hundreds of attractive websites on the internet, but not all of them manage to convert visitors into buyers, and that’s mainly down to the functionality of the website. Your goal should be to deliver your product or ideas to the visitors in a logical and clean way with minimal distractions.
It’s even more important to adhere to when you’re building your brand because you want your website to appear professional and trustworthy to visitors.
1.1. How to Build a Trustworthy Website?
The critical factor in web designing is the design layout you choose for your website. Even small startups without any meaningful budget can easily afford web designers who can help design professional and optimized web designs.
However, they still struggle to make a good impression on their customers, mainly because designing a good website that is functional and beautiful isn’t easy.
That’s the reason why you should analyze the behaviour of your target audience so that you can create and implement effective UI to take the user experience of visitors on your website to the next level. You should also try and learn about the common mistakes made in web design, as that can help you avoid the pitfalls of bad web design.
If you’re confused about what we mean by bad web designs, we’ll show you the major points of interest that distinguish a good web design from the worst web designs of all time.
1.2. Differences Between Good and Bad Web Design
The great thing about web designing is that trends are always evolving, but that makes design principles on the internet harder to define. However, the golden rules of good web design remain the same and will stand the test of time.
We scoured the internet and looked at hundreds of great websites to find the design principles that helped them stand out from their competition. These were:
- Choosing an appropriate theme or design
- Good color scheme
- Easy to understand navigation
- Mobile optimization
- Proper use of animation
- Visually appealing interface
- Clean layout
- Keeping content and design elements organized
The principles stated above are just some of the key elements of every good web design, and they clearly show you what a good website should have. Your only chance of attracting and converting online users is by providing them with exceptional user experience, and that is defined by the web design.
1.3. How Do You Identify Elements of a Good Web Design?
There’s no definitive way to know exactly what design elements you should incorporate in your website without reviewing your user data and unique analytics. However, there are plenty of best practices that are universal when it comes to making better choices for web design.
For example, keeping social icons on the footer or having testimonials on the homepage are elements that every good web design has. Other elements that are outside the scope of these best practices are experimental, meaning they work for some but not all websites.
The tricky part is that most of these good web design elements are present on websites because of outdated best practices or preferences.
Every website is different, and the audience for these websites is different as well. However, the best practices of good web design are known to work for all websites.
2. The 20 Worst Web Design Mistakes
At SEO Resellers Canada, we have worked on countless website re-design projects and have noticed the same mistakes being repeated by businesses. The most critical aspects of your business website are usability and quality, and without these basics, your conversion rates are going to be low as visitors don’t want to stay on your website after being directed to it.
Websites with high bounce rates have a serious problem because people didn’t find what they were looking for, and the website didn’t interest them enough to explore. That can be traced back to the usability and quality problems we touched on above.
So, let’s cut right to the chase and highlight the 20 worst web design mistakes you should avoid making on your business website in 2020.
2.1. Relying on Home Page Sliders
For some reason, it seems every other website has homepage sliders that convey multiple and often competing messages to users. It is a web design element that was popular when it came out. However, in 2020, it has become outdated, and people are no longer interested in them. It is also the website element that designers hate the most. From the perspective of a business, there is nothing wrong with sliders on the home page, but the reality is that they just don’t work.
The reason home page sliders aren’t effective is that they don’t convert users, and people don’t sit around looking at these sliders before starting their journey. Sliders serve a different purpose because if people aren’t looking at them, what else could they be for? Well, most businesses use it to solve internal problems by keeping all stakeholders happy and important. They don’t solve any problems for users and shouldn’t be considered any more amongst good web design practices.
What do you do if you can’t add a slider on your home page? You simplify the home page! If you’re hosting your website on HubSpot, you can take advantage of the Smart Content Features that allow you to craft and display a unique message that is going to change depending on the variables you’ve chosen as your trigger points. For instance, you could have a different message for users in the US versus someone in Canada.
It won’t hurt to stick to one single message and highlight its importance by making it prominent in the ‘Hero Section.’ However, if you want the ‘flashiness’ of a slider, you should check out some options with animations or videos.
You must have come across websites where you didn’t know how to get around or where you should go from the home page. These are the websites where there is too much happening at once, and that has a jarring effect on users visiting the website for the first time. It’s something that plenty of websites have gotten wrong, and most websites with high bounce rates tend to have confusing navigation.
If the user doesn’t know where to go on the website with no clear menu visible to them, you shouldn’t expect to convert much traffic. There have been plenty of cases where designers tried to too clever, different, or creative with the navigation only for it to backfire spectacularly on them.
Being unique and creative isn’t a bad thing or a negative aspect when it comes to web designs, but it’s easy to take things too far. In trying to stand out from your competitors, you could compromise the user experience to the point where visitors don’t know where to go on the website or what they should do.
You don’t want users guessing on how to use your website as that should be intuitive. The menu on your website should be prominent and clear on the home page and must be easy to spot, actionable, and simple. Don’t get caught up in trying to impress users as it can easily have the opposite effect by confusing users with overstuffed navigation menus, which is also bad for your website’s SEO.
Therefore, you should limit the main menu options to about 5 or 7 and ensure that the dropdown menus are organized and easy to understand. Your website analytics will tell you a lot about what paths visitors on your website are taking to get to where they want to go, and where users are dropping off on your website when they should be staying and converting into sales.
Keep this in mind when setting up the structure of your menu as you want it to be easy to understand and quickly give users the information they need.
Everyone has come across a website that is clogged with Call-to-Actions after every few lines all the way down the page. Call-to-Actions do serve a purpose on your website and should be on the home page, but they only work when you place them strategically. Too many Call-to-Actions on one page is overkill and doesn’t present a professional image to visitors who may feel as if you are trying too hard.
An overabundance of Call-to-Actions will only deter users from clicking on them, which is the opposite of what you want them to do. It feels pushy and gimmicky, and no one likes a salesperson that is pushy. It’s not all about placement as well. Instead, you should focus on the hierarchy you are creating with the style of your buttons.
An effective CTA doesn’t need to be flashing or be red with bold lettering. You shouldn’t have all your CTA’s looking the same as well. The best way to incorporate Call-to-Actions on your web page should be for bottom-of-the-funnel offers,and you should have a ghost button for links that direct users to internal pages on the website.
Don’t be afraid to add in-text links in your Call-to-Actions because sometimes a link doesn’t need to be a button, and something related to the text with a simple arrow showing the user to dive deeper.
2.4. Using Cheesy Stock Photography
Yes, even we can’t believe that in 2020 we still need to highlight this, but somethings can’t be helped. Stock photography is noticeable, but it also comes across as fake, and that’s not what you want visitors thinking about your business. To be fair, it is understandable why businesses tend to get sucked into this trap of using stock photography on their website.
Not everyone has the budget to stage a professional photoshoot, and there are several businesses out there who aren’t comfortable doing it on their phones, which is why stock photography is the only option left for them. We’re not saying that stock photography on your website is unacceptable, we’re advising to be more purposeful if you’re adding stock photos on your website.
Don’t think about picking one photo out of a collection of stock photos. Instead, you should try to curate a set of images that represents your brand. Keep the small things consistent, such as lighting, the dressing of the subjects, and the technology they are using. These points help in presenting a polished brand image, which you wouldn’t get if you insert random images throughout your website.
Having random stock photography on your website doesn’t project trust, and how are visitors going to know what is real about your company and what isn’t? If visitors think of you as untrustworthy, you can wave goodbye to improving your conversion rates on the website.
2.5. Using Icons without Context
Let’s get one thing straight: icons are cool. Here, at SEO Resellers Canada, we use them all the time, but we have one basic rule — icons aren’t allowed to stand alone.
A few years back, icons were trendy, and every website needed its own custom icon, or they didn’t have any merit. These icons were expected to translate every detail of a concept.
Just like images, icons offer necessary, easily skimmed content to any copy on a website. However, you shouldn’t be using icons for every single headline, menu item, and info box on your website. All that does is create clutter that isn’t visually appealing and doesn’t enhance user experience in any way.
2.6. Chatbots and Pop-Up CTA’s Overwhelm Visitors
We are massive advocates of helping visitors on your website, and we have based our entire website methodology on this. However, there is a thinline between being helpful and annoying, pop-up CTAs and chatbots can easily devolve into annoying territory easily and quickly.
Live chatbots and pop-up call-to-actions that are in your face, always asking if you need help, are like the annoying sales guys that hound you the minute you enter their store, asking if you need assistance.
Letting your users know that you are there, ready to support them if they need it is part of offering great customer service. However, once you have let them know, you don’t need to keep reminding them, just let them do their thing and get on with their sales journey. Hitting them with a new pop-up and exit-intents every 20 seconds as they are scrolling down the page creates a negative impression on them.
If your website marketing strategy is effective, it is going to get visitors where they want to go without hounding them. For businesses without a good website strategy, they should revamp their page structure and revisit their navigation.
2.7. Hiding Content Behind ‘Bells & Whistles’
We have seen the use of unnecessary hover effects repeatedly on numerous websites, and it used to be the ultimate solution to the request ‘Can you make it pop? The only problem with this is that they are extremely frustrating for visitors, and they never work on mobile. They are completely hidden to screen readers as well, which is why we are scratching our heads as to why businesses still hide content.
We’ve already discussed why your website design should be user-focused, and now we are going to talk about how your web design impacts your content. If you’re already taking time to generate high-quality content that focuses on the biggest pain points of your target audience, why in the world would you ever want to hide that in a hover effect tab? It all comes down to what we discussed before, never ever make your visitors think about what they are doing on your website.
You don’t want visitors on your website digging around for your content and if they are going to understand how to access it when they find it. That only frustrates users and creates a negative experience on your website that will drive them away. You can experiment with best practices to come up with ways to display your content in a manner that is easy to read for visitors.
Hidden content alienates your audience, and screen readers can’t read that text, meaning that if a visually-impaired visitor navigates your website, there are going to be entire sections of the website they won’t see, and they won’t read your content.
2.8. Forcing Everything Above the Fold
You must have noticed that the internet doesn’t fold like an actual newspaper, and that’s why it is so infuriating when we find websites that are still designed based on the concept of ‘above the fold.’ It is a concept that has persisted for decades in web designing, but we are going ahead and outlawing it in 2020. It’s an outdated best practice and is practically worthless when you consider the sheer volume of screen sizes and devices out there.
Whenever visitors land on a website, they start scrolling immediately, and this has become second nature to everyone, thanks mainly to mobile culture. Designers make the mistake of perceiving the fold, which creates an unrealistic boundary for the problems they claim to be solving.
Your message should be coming through loud and clear in the ‘Hero Space’ on your website and should be free of distractions and singular. You want this area to address the main thing visitors on your website should accomplish during their time here. Avoid using too much verbiage and focus on being concise and direct. Limit the number of buttons as you want to create a defined path for visitors.
You should also embrace white space in these sections because the extra room that white space offers will force visitors to be sucked towards the key message you are sharing. You should also anticipate the scroll and adding slight animation will keep visitors engaged.
2.9. Too Much Animation
Animation and video are trending in web designs right now, and designers have started experimenting with moving elements. Video animations are proving to be immensely successful. However, when it comes to animations, you should always use the Jurassic Park Rule – Just because you can do something, doesn’t mean that you should do it.
When every element on your web page is moving, it is distracting for visitors as they can’t focus on one thing. It’s true that attention spans are shorter now, and you must try everything to impress visitors, but you can easily go overboard with animations. You want to attract your visitor’s attention but towards one thing, not everything on the page, which isn’t going to offer you any results.
Intentionally placing animation strategically on your web page will draw your visitor’s attention towards crucial elements such as the bottom-of-the-funnel offers, contact forms, or live chat. You shouldn’t be intimidated by animation and video because the smallest movements can be the most effective.
All you need is around five to six colors for great looking website design, and most well-designed websites tend to have only 2 or 3 colors with their shade variations, making up 90% of the page. When it comes to colors, you should use them sparingly on your web pages as too many or bright colors not only confuses the brain but is uncomfortable to the eyes.
The text on your website should be readable, and low-contrast text like yellow text on a white background is not only hard to read but makes for painful viewing. On the other hand, too much contrast isn’t the solution as well, like adding white text on a black background.
You want to avoid dark backgrounds on your websites as people prefer light backgrounds, and that’s why most websites today use them. Switching between light and dark backgrounds also causes eye discomfort, and you don’t want your visitors suffering when they visit your website.
2.11. Talking About Yourself Too Much in the Web Copy
One of the biggest pet peeves of web designers today is coming across web copies where the business talks about nothing else but themselves. It’s not only vain and boring, but unhelpful to visitors.
Look at your current website and count the number of instances where you use the phrases ‘we’ and ’us’ and compare it with how many times you used the phrase ‘you’ in the web copy. Your website is supposed to be about your visitors and not as an advertisement for you.
When you’re creating web copy, your focus should be on solving problems for your visitors or target audience. Think about why they are coming to your website and what benefits your products or services are offering to them. Your website navigation, your resources, and your web copy should be centred around helping your visitors solve their problems.
It shouldn’t be an endless list of your accomplishments and how great you are as a business. If you’ve got a section labelled as ‘Solutions’ in your main menu, your navigation isn’t helping visitors on your website solve their problems. You can simply switch that to ‘How We Can Help?’, which puts that attention back onto the visitor.
2.12. Poor Use of Whitespace
A critical part of your business’s marketing campaign and website is the content that informs readers about your business and your offerings. However, most businesses ruin their content through poor use of whitespace, which not only distracts users but ensures they won’t be coming back to your website.
It doesn’t matter if your content is great. If no one wants to read it because the homepage looks unappealing, then it will fail to convert into sales. Elements of communication design, like the fonts used for your content, must be selected carefully because they convey your brand image.
You must ensure that you use whitespace on your website smartly so that users are drawn towards your content instead of being intimidated by large blocks of text. Most businesses focus on adding too much content on their website, and that’s a big mistake because users don’t bother reading if all they see is a block of text in front of them.
You must break up text smartly and add visual elements that represent concepts wherever possible. Don’t forget about your customer’s experience on your website, and poorly structured content is ignored most of the time if it isn’t broken up effectively.
2.13. Placing Ads in the Wrong Places
Advertising is a necessary evil that all businesses must get their hands dirty with; otherwise, how will you promote your business to its target audience? Advertisers get to place their ads on blogs, and these blogs get to earn from the ad. However, these ad placements don’t always have the effect that advertisers want. Flashy, noisy, or too many ads on a website don’t look good, causing visitors to get frustrated and leave, which, in turn, results in losses for your business.
Your goal is to attract new customers, and advertisements serve that purpose. However, you must be smart about the placement of these ads. You should analyze the ads and put yourself in the shoes of the customer. If they are annoying to you, they will annoy your customers as well.
You must always keep your brand image and target audience in mind throughout the web designing process. Make sure that your ads are placed in such a way that they don’t disrupt the website’s user experience. It’s no secret that fewer ads on your website, placed in a sensible way, are not going to ruin the audience’s experience. If you can get the ad placement right on your website, you’ll not only have a beautiful web design but one that converts users as well.
One word that you wouldn’t hear that often from web designers is scroll jacking. It is something of a dirty word, and the practice has long gone out of use. However, web designers still use it whenever they deem fit. It’s a process that essentially ‘hijacks’ the scroll bar on a website and converts a full page of content into a series of slides.
You must have come across numerous websites like this, where there is an endless array of slides. The visitor on the website becomes frustrated because they can’t skim read the article; instead, they are left waiting for the ‘slide’ to load before going through the process again.
If you want to have scrolljacking on your website, don’t punish those viewers who prefer reading an entire article. They will appreciate it if you have given the option to ‘view as a list,’ which allows them to read it as a complete article.
2.15. Disabling Zoom on Mobile Websites
This is one of the worst web design mistakes you could make for your business website as it is not only headache-inducing but cringy as well. Most online users browse the internet on their mobile phones, and if you haven’t optimized your website for mobile phones, you’ve shot yourself in the foot.
You don’t want visitors finding your website on their mobile phone and realizing that they can’t read the text or navigate through the website because it hasn’t been optimized. They won’t stick around once they realize you haven’t optimized the site, and you’re going to lose customers.
It’s not that difficult to optimize your website for mobile, and it can be done easily. It’s not an option but has become an obligation for all business websites to optimize for mobiles because there are now more mobile users than desktop users browsing the internet.
2.16. Auto-Playing Videos with Sound
If you’ve got videos embedded on your website, do yourself and everyone a favour by turning the autoplay feature off. Alternatively, you can have it run on mute if you can’t stop it. Most businesses assume that surprising online user with an engaging video as soon as the page loads is a good way to grab their attention.
However, it may backfire as they may want to leave your website as soon as your video starts playing with noise in the background.
No one wants their peace disturbed, and irrespective of how great your video is, it is going to tick people off when they find that a video has started without their permission. Most people are browsing while listening to music, and when your video starts, it will irritate them, causing them to hit mute on the sound or close the video.
There are better ways to attract the attention of users on your website, so you shouldn’t come off as pushy or as ‘in-your-face’ by having your videos autoplay with sound.
2.17. Hard to Find Contact Info
You should make it a point to create a separate page with the contact details of your business. That is going to be the ‘Contact Us’ page for your brand, which will allow your customers and clients to get in touch with you easily. Most times, website owners don’t show their phone numbers prominently in the headers and footers or on the dedicated contact page.
It’s an easy web design mistake to make, one that is more common than you would think. Don’t be shy about sharing your contact details on your website, so place a clear call-to-action in the header with your direct phone number, which would look something like this:
Call for a Free Estimate today! 800-555-5555
If you don’t want to appear too sales-y in the header, you could simply highlight your phone number so that your customers know exactly how to get in touch with you from your website.
2.18. Not Using Analytics to Measure Performance
One of the worst web design mistakes you should avoid in 2020 is not looking at and studying crucial data generated by users on your website. Statistics show that a staggering 75% of small businesses don’t use analytics tools to track and measure their performance. That’s something you should avoid doing, as your website is an investment, and the only way to protect it is to measure success and analyze progress.
It’s a massive oversight if you don’t use analytics to measure performance because the key to success in online marketing lies in the ability to test, track, measure, and adjust.
Google Analytics offers one of the best ways to track user behaviors on your website and allows you to set up goals so you can track conversion. Numerous free plugins can help you measure your website’s success, and you can combine the analytics with your advertising campaign to specifically target your marketing to an audience that brings success to the business.
2.19. Confusing Brand Messaging
Another underrated ‘worst’ web designing mistake to avoid is not being clear in your brand message. All major big-name brands rely on clear and concise messaging, which clearly shows their target audience what the brand is about and what they have to offer. It’s something you want to get right because you don’t want your audience scratching their heads, wondering what your business stands for or what it offers to them.
The most important aspect that you should aim to get right in your brand messaging is storytelling. You need to create content that is both compelling and connects with your audience on an emotional level. If you sound like every other brand in your industry with generic messaging, how will you attract audiences?
To stand out from your competitors, your brand messaging must be on-point and must come from the values and beliefs of your brand. The content on your website must address the motivations and needs of the target audience instead of focusing on the accomplishments of your brand.
2.20. Weak Search Engine Optimization (SEO)
Most businesses assume that badly designed websites are those where the front-facing user experience is substandard. However, it’s content that will make or break your lead generation or traffic. Quality content offers exceptional value and is also found organically by search engine crawlers. However, there’s no magic formula when it comes to high search engine rankings.
That’s mainly because high search engine rankings don’t happen overnight but are the product of months and even years of hard work. Search engine algorithms have become smarter than ever before and value a website based on numerous metrics.
There’s no point in having a great web design for your website if you have poor SEO, as that means less exposure for you online, and fewer people finding your website. To improve the SEO of your website, you should focus on long-tail keywords as they are not only easier to rank for but also brings relevant leads.
Don’t be too hard on yourself if you notice that you’ve made a few of the web design mistakes we highlighted or god forbid, all of them! Everything is going to be ok because all the worst web design mistakes we have highlighted are fixable, and most can be resolved without much work. There are always going to be people who are sceptical about web design elements, but you can easily test out the solutions we have shared on your website to prove or disprove their efficacy.
You can conduct experiments around the elements we have shared and see if your visitors are engaging more or if you are managing to convert more visitors. You must not underestimate the web design of your business website as it can make or break your entire business model.
We’ve highlighted the worst web design mistakes you should avoid in 2020. As we usher in the new decade, it’s important that you maintain your distance from these bad web design mistakes and create an engaging online experience for your customers.
If you’re looking for the best web design specialists or are concerned about your web design, get in touch with SEO Resellers Canada today for high-quality web design services.