Schedule A Growth Strategy Session
Conklin Media Squiggle Favicon Logo

Design Is Killing Your Website (Here’s What to Do About It)

Share

The first five seconds a user spends on a site are all about design. First impressions matter, and a poor first impression leads to users quickly abandoning your site. Bad first impressions may cause your site to look not credible or trustworthy, keeping your visitors away from the idea of returning. Think about design as a power: it can be really helpful and make incredible things happen in good hands. In the wrong hands, it’s just destructive.

User Behavior: A Combination of First Impressions and a Short Attention Span

Chartbeat looked at deep user behavior across 2 billion visits across the web over a month and found that most people who click don’t read. A stunning 55% spent fewer than 15 seconds actively on a page. In 2000, Microsoft conducted a similar study. The results showed the average person’s attention span was 12 seconds, and 15 years later, it dropped to 8.

Here are some facts about users and website design:

  • 39% of visitors leave a website if images won’t load or take too long to load.
  • 44% will leave a company’s website if there isn’t any contact information or a phone number.
  • 38% will stop engaging with a website if they find it unattractive.
  • 70-80% research a small business online before visiting it or purchasing something from it.
  • 51.3% of worldwide users access the web via mobile devices.

(Sources: Adobe, Blue Corona, KoMarketing, StatCounter)

So how can we design in a way that is appealing, loads quickly, and doesn’t increase your bounce rates?

Best Practices for Website Design

Hubspot shared these guidelines for good web design:

  • Simplicity: Eliminate unnecessary design elements and make your site easy to understand.
  • Hierarchy: Arrange your site so visitors naturally gravitate to the most important elements.
  • Navigability: Make your site’s navigation simple and obvious.
  • Consistency: The look and feel of your site should be uniform throughout.
  • Accessibility: Your site should be compatible with all devices (mobile, tablet, etc.).
  • Conventionality: Don’t reinvent the wheel. Use elements and design with which people are familiar.
  • Credibility: Be upfront about your intent and your pricing.
  • User-centricity: Gather user responses to all site elements to get the best UX.

While most of the points listed above focus on how to create a good user experience, we went further and put together a list of design issues that might be affecting your site right now and how to fix them to get the best experience and increase retention from your users:

The Most Common Design Mistakes Hurting Your Website

  1. A Bad First Impression (and Not Keeping Your Site Up-to-Date) 
  2. Design Based on Trends Rather Than Users
  3. Too Many Different Font Styles
  4. Lack of Contrast
  5. Poor Image Quality
  6. Broken Links
  7. Website Not Optimized for Mobile
  8. Website Is Slow
  9. Complex, Confusing Copy or Too Much Text
  10. Pop-Ups and Ads: Too Many or Too Soon
  11. Autoplay Video Issues
  12. Outdated Plugins
  13. Poor Navigation

A Bad First Impression (and Not Keeping Your Site Up-to-Date)

First impressions are powerful, and the first thing users perceive when they land on your site is its overall design. A 2000s look will make them feel like you don’t care about your site anymore; maybe also that you are no longer active, all of which will hurt the trust in your brand and business. 

Keep your site updated on the latest best practices and technologies for design and development. Even if your business is not technology-related, your site is part of your technical systems and needs maintenance. 

Keep your blog updated, even focus on updating your icons when you notice a rebrand or change in the business: G+ is gone. The platform was shut down in 2019. Go and get rid of that social share icon. Instagram changed its branding in 2016. Remember to update the icon. Many little things like these could decrease the trust on your site because users may perceive that you don’t care about your online presence or that you’re behind the times.

Uber provides a clean, professional look on its website.

Have you ever found yourself thinking, “3D, cartoons, illustrations, animated videos in the background, lots of animation on the pages… wow, let’s copy that; it would amaze my users!” Think again. Design doesn’t work that way. Incorporating too many trends works against how the users feel about a product, giving them the sense that it is just like everything else on the market.

Believing that it is good to be like everyone else in the industry is a wrong assumption from the beginning. Think about your brand and what best suits it rather than getting lost in the crowd. 

Your content and target users will determine how your site or landing page should look, not a fancy trend out there. Your site should be focused on meeting web usability design standards first and use it as the foundation for design. This will positively impact on-site retention and conversions.

Trends are not suitable for all kinds of niches. Know your audience and decide what suits best for your business.

Too Many Different Font Styles

Using too many fonts on your website may make it feel messy or less professional. Consistency is key to having a clean and professional look. 

But, how many is too many? More than three fonts are problematic and make it challenging to keep your site consistent. Too many different fonts start to compete for the user’s attention and keep users away from what’s important: your content. Hard-to-read and low-quality fonts will have a detrimental impact on your site as well. 
Unable to decide what fonts to use? These font pairing websites can help you choose wisely: FontJoy, FontPair, Typespiration, Google Fonts.

Lack of Contrast

Your content should be easy to see: users should be able to spot the foreground and background easily and tell them apart; otherwise, you have a contrast problem. Contrast is the practice of making things noticeable or easily spotted between each other. 

A light-colored image background on your site with white text over it will make it hard to read, and a button with a dark background and grey text on it will have the same issue. Make sure to add enough contrast between your foreground and background elements to increase readability and easy recognition of the details. 

Many tools can help you address this point if you are in doubt if it has enough contrast or not: Adobe Color Contrast Analyzer, Colour Contrast to name a few.

Exelon is forgetting to give enough contrast on the menu, heading, paragraph and call to action button.

Poor Image Quality

Images always matter. They are an essential part of the first impression users take away from your site. High-quality and sharp professional images give your site a perfect look. Avoid using DIY images and especially photos with overly exaggerated positions or gestures. Don’t know where to find free and high-quality images? Try these great sites to find the right ones for your business: Pexels , Unsplash , Pixabay , StockSnap

Be aware crisp and professional photos could also lead to high loading times on your website. We wrote an article on how you can optimize images before uploading them to your site to prevent unnecessary issues with your site speed. 

Broken links can be extremely annoying. The internet is all about links. Users who intend to browse your site end up frustrated when links don’t take them where they want to go, making your site look sloppy and outdated. But most of all, it can harm your SEO. Search engines see links to your website and links from your website as a metric to rank your site. Cleaning up broken links will improve user experience and make content easy to discover for users and search engines.

What may cause a broken link:

  • A website is no longer available
  • A webpage was moved without a redirect being added
  • The URL structure of a website was changed

The more links your site has, the more often you should be checking for broken links. Many broken links may keep your users away from your site forever. Either remove or update them.

There are many tools to help you accomplish this task, to name a few: Ahrefs Broken link checker, Site Checker.

Website Not Optimized for Mobile

Techjury pulled together a list of insights from various researches, giving a big picture of how relevant it is to keep up to date with mobile optimization: 55% of the page views came from mobile phones over the last year.

2021 mobile vs. desktop usage insights

  • Over one year, mobile user share increased by over 10%.
  • Mobile vs. desktop usage stats in 2021 reveals 50% B2B inquiries were made on mobile last year.
  • In 2021, mobile phones generated 54.25% of the traffic, desktops – 42.9%.
  • 55% of page views in 2021 came from mobile phones.

Mobile users will continue to increase year by year, pushing websites to develop updated and pleasant mobile experiences. It’s a must for your website to be mobile-friendly, and why not create them from scratch with the mobile-first philosophy in mind? What is mobile-first? is a design philosophy that focuses on creating better experiences by starting the design process from the smallest of the devices (mobile) and then scaling up and adapting to the larger ones (desktop).

Optimization for mobile means having a design that adapts content to the screen size and making sure to reduce the load time, adjust and optimize images sizes and resolutions, focus on what’s important, and think what’s not needed. All will help to give users a much more pleasant experience.

Website Is Slow

Let’s begin with some high impact stats: 

  • 40% of people abandon a website that takes more than 3 seconds to load.
  • 47% of consumers expect a web page to load in 2 seconds or less.
  • A 1-second delay in page response can result in a 7% reduction in conversions.

Page loading time is a vital part of every user experience. With the user attention span decreasing every year, having a faster loading site is critical to retaining visitors. Not only that, but also it has a significant impact on search engine ranking.

A slow and poorly optimized site will lead to a higher bounce rate, and a higher bounce rate will end up killing your site. 

Let’s see some issues that might be affecting your website speed and what to do to address them quickly:

  • Large image sizes: we wrote a handy article on optimizing the images on your site. Compress and optimize your images before uploading them to your site.
  • Cheap web hostings: these can’t carry enough visitors. Upgrade your plan accordingly to your needs.
  • Your site doesn’t cache: cache reduces page loading times by saving copies of the pages your visitors have already seen.
  • Your HTML, Javascript, and CSS are not minified: removing extra comments, notes, markups, and white spaces makes your site easier to load.
  • Using too many plugins: Extra code always adds more time to load, so stick to the minimum to offer a pleasant experience. Also, reducing its usage will save you from headaches in the future if plugin authors stop giving support to its creations and the sections in site affected stop working.
  • You’re not asynchronously loading the content on your site: If your site has plenty of Javascript, one way to reduce time is loading HTML and CSS first and then Javascript by the end. By doing this, you’ll make sure your visitors will be able to see your site and not an empty or broken page at the moment they land on it.
  • CDN not enabled: A CDN is a network of servers that host your site in the nearest location to access it faster. Enable it on your site for the best results. 

These are some good sites to test your site speed: Google PageSpeed Insights , Pingdom.

Complex, Confusing Copy or Too Much Text

Here’s a fact: Most people don’t really like to read. Instead, they scan your website, looking for headers, images, lists, any easily scannable piece of information.

A study from Nielsen Norman Group found that 79 percent of the test users always scanned any new page they came across; only 16 percent read word-by-word.

As a result, web pages have to employ scannable text, using:

  • Highlighted keywords (hypertext links serve as one form of highlighting; typeface variations and color are others)
  • Meaningful subheadings (not “clever” ones)
  • Bulleted lists
  • One idea per paragraph (users will skip over any additional ideas if they are not hooked by the first few words in the paragraph)
  • The inverted pyramid style, starting with the conclusion
  • Half the word count (or less) than conventional writing

The key here is to minimize as much as possible the cognitive load.

What Is Cognitive Load? 

Cognitive load is the amount of mental processing power needed to perform a specific task, in this case, reading. This factor affects how users find content and accomplish tasks. With the attention span from users decreasing every year, we have to focus on the most effective way to communicate our site value to the users in the minimum time possible. These are some tips to help your content be more effective online:

  • Be concise: strike a balance between keeping helpful information and making it easy and fast to read. Cut overly detailed information.
  • Make it scannable: add tables of contents, summaries, bullets, numbered lists. Shorter paragraphs. Boldface, colored text, highlight keywords. Additional headings.
  • Be objective: remove unnecessary adjectives and buzzwords and claims not supported with evidence.
Focus your copy on key content, highlight benefits of your product or business.

It’s understandable to use ads or pop-ups when your site is ad-driven, but be sure to not overwhelm your users in a way they lose all the interest in your website. Intrusive and obtrusive ads or pop-ups tend to keep users away from your content, and what you think could be a way to engage ends up just being too annoying and making them unwilling to come back. 

Let the user take their time, don’t trigger it right after they land on your site, let them engage with your content. If you are willing to get contact information, just ask for the minimum, like name and email, don’t be too intrusive. Later on, you can ask for more information via an email funnel or thanks or welcome email. 

Try to avoid intrusive pop-ups that take up more than 25% of the screen, and locate them at the bottom of the screen when possible. Doing all of this will help users continue navigating your site and noticing something is trying to catch their attention, but with a higher level of acceptance on their part.

Autoplay Video Issues

Let’s face it, an autoplay video playing right after you land on a site and grabbing the attention of everyone around you is extremely annoying and even embarrassing. Many people tend to look for the video player on the website to stop or close it, losing the momentum they need to focus on your site’s actual information. Others close the website right after they hear it, causing you to lose a prospect or visitor right away.

MailOne site not only has an outdated design, it also has a lot of advertising and… wait for it… autoplay video ads too!

Outdated Plugins

Websites using WordPress receive updates very often, which may cause plugin conflicts if the plugin owners don’t keep up to date with their creations to make sure these have the compatibility needed to avoid any issues. The same happens with other platforms like Magento and Shopify, and we need to address these issues before they hit the users. 

Old embed plugins can also cause problems if the owners don’t keep them up to date. Their sites could be down because of the lack of payment one day, and your site will face the consequences. Rely on recognizable authors when choosing what to add to your site (i.e., Google Maps, Google Fonts) to ensure it will keep working for a long time.

Try to check your site often to see if everything works as it should. The fewer plugins and addons you have, the less you will have to worry about.

Users want to reach point A to point B as quickly and conveniently as possible. If your site is hard to navigate, users won’t find what they’re looking for. They’ll search for a while, but after not finding what they are looking for with a few clicks, they’ll give up and go somewhere else.

Keep your site navigation self-explanatory, simple to use, and with a hierarchical structure. Navigation helps people go through the website, make visible the information it offers, and make an informed decision on where to go next. Knowing your user’s behaviors is key: what they frequently search for, popular products or services, shipping details, contact information. Then make that content highly available.

Yale School of Art has an overcomplicated navigation. Users don’t know where to start.

Use Web Design Elements Wisely

We have plenty of points on the checklist to improve your website design and performance. 

Checking your website often for bounce rates, and continuously testing the elements on your page to ensure everything works as it should be is also part of the process of having a good design and user experience. Your website design is the foundation of how your business is presented to the online world. Let’s make it count.

Angeles Morano

Angeles Morano

UX/UI designer passionate about usability and technology. 15+ years of experience working in gaming, elearning, startups and marketing industries. Always looking for new trends and best practices. Fan of generative art and interactive installations.

Tags

Subscribe Now

Get the Latest
Industry Insights

Are you ready to grow?

SCHEDULE A STRATEGY SESSION

By providing an email address and phone number, you agree to receive email and text messages related to your request for information about our marketing services.