12 Website Design Mistakes to Avoid

12 Website Design & Dev Mistakes to Avoid

Your website is your virtual property.

It’s the conduit through which so much of your brand’s image, value, and meaning are transferred to the marketplace.

It speaks volumes of your business – good or bad – and can pull people into your corner, or turn them away.

A website is made up of a number of elements – many of which quietly operate beneath the surface and are invisible to the naked eye.

This includes coding, technical structure, SEO, and other crucial behind-the-scenes factors that make a website tick.

But do you know what brings a website to life?

It’s the design.

If the aforementioned elements are considered the foundation and framing of the “house,” website development and design is the finish work. It’s the trim, paint, countertops, hardware, flooring, and light fixtures.

And just like interior design touches have the ability to persuade a homebuyer to put in an offer on a physical property, compelling web design elements possess the power to move a visitor to action on a virtual property.

Why Does Good Web Design Matter?

Why Does Good Web Design Matter?

Website design, which refers to the visual display of a website and the experience and emotions it evokes in visitors, is arguably one of the most significant parts of building a successful online brand.

The combination and layout of colors, fonts, images, graphics, and content can make or break a company’s image, brand, and ultimately its success.

Here are some thoughts to keep in mind:

  • First impressions. Did you know that 75 percent of individual users make judgments on a brand’s credibility based on visual design alone? In other words, three out of every four prospective customers are making definitive, surface-level decisions about your company 100 percent based on the image you portray. And considering that your website is one of your most visible digital properties, you could say website design makes or breaks that first impression.
  • Quick decisions. If the previous statistic isn’t enough to motivate you, consider the fact that it takes just 50 milliseconds for the human brain to form a first impression of a website’s design. In other words, before a visitor has clicked, scrolled, or done anything else, a positive or negative first impression has already been conceived. And pretty soon that first impression will give birth to positive or negative actions that directly impact your bottom line.
  • Engagement.After that initial first impression, people have a decision to make. Do they want to engage with your website? Or would they prefer to go elsewhere? Research shows that 38 percent of people will stop engaging with a website if the layout and content is unattractive.
  • Search engine optimization. Did you know that your website’s design has a direct impact on your search engine optimization (SEO)? Not only does it influence user experience and engagement – which send certain signals to the search algorithms – but it also has a technical impact on elements like code, website speed, and navigation.
  • Customer service. Because your website’s design impacts first impressions, it also sets the table for future interactions you’ll have with customers. This has a direct impact on your customer service. Good design will improve your chances of having positive interactions, while bad design can set you up for failure from the very start.
  • Trust. At the end of the day, it comes down to trust. If you’ve nailed the web design component of your website and tailored it to your target audience, you have a much better chance of cultivating trust. And when it’s all said and done, it’s trust that helps companies grow.

This list could go on and on – but you get the idea. Website design is more than just lipstick. It has a direct impact on the core elements of your brand and business. And you can’t afford to mess it up!

Avoid These 12 Website Design Mistakes

Avoid These 12 Website Design Mistakes

So much of website design is subjective. However, as the industry matures and we’re able to gather more data, analytics, and user feedback from billions of collective interactions on millions of web properties, it’s becoming increasingly obvious what good design is.

If you want your website to convert at the rate that it should, you must be intentional in your approach to web design. And that means avoiding so many of the mistakes that create friction and lead to high bounce rates.

Let’s explore a few of the biggest mistakes, which should empower you to generate more value from your company’s website in the years to come.

1. Lack of Responsivity

Lack of Responsivity

Let’s begin with what is one of the most common yet easy-to-fix web design mistakes: lack of responsiveness.

Responsive website design, also known as RWD, is basically a feature that allows your website to scale up and down in browser size (based on the device accessing the site) without losing its visual integrity or consistency.

Responsiveness is what happens when you go from a desktop computer to a tablet to a smartphone and the website still looks good. It might change slightly, but no elements are cut off, overlapping, or squished together. They “respond” to the change by adapting to their new environment.

The problem is that many websites don’t account for responsiveness. And if they do, they rarely give as much intentional thought to their RWD calibration as they should. This creates issues.

A lack of responsivity is unprofessional and frustrating. It creates a bad first impression and may even prevent a user from taking the action they want to take.

The good news is that RWD is pretty standard these days and can be handled relatively effortlessly. Whether you’re using a drag-and-drop website builder or have your own custom WordPress developer, it shouldn’t take a ton of time or resources to optimize your website for responsiveness.

2. Aesthetic Inconsistency

Think about a friend of yours who is really kind, caring, and polite. You can call them up at any time of the day and they’ll be warm, receptive, and ready to help in any way they can.

Now consider how you would feel if you called that friend up one afternoon to check in and they rudely asked, “What do you want? I really don’t want to talk to you right now. I have better things to do.”

You would be floored right? Aside from wondering whether you did something to provoke their rude response, you would feel a massive amount of tension trying to reconcile the friend you know and the friend that just answered the phone. The inconsistency would confuse and frustrate you to the point that your trust in that person would be significantly affected moving forward.

Now think about your website. In many regards, your website is like a person with a unique personality. Visitors come to your website and they expect a certain kind of experience. If your website deviates and is underscored by visual inconsistencies, it’ll throw people for a loop.

Consider how consistent your website is and fix any issues you find. The most common problems include differences in brand colors (using generic colors rather than the specific hex code for your brand’s color), too many different fonts, inconsistent tone of voice in website copy, etc.

3. Text That’s Difficult to Read

Texts difficult to read

Typography is often an afterthought for web designers, but it plays a significant role in the legibility and aesthetic appeal of a website. In particular, you need to avoid mistakes with:

  • Poor kerning. The term “kerning” is used to describe the space between two individual characters within the same word. In other words, it’s the space between the he-l-l-o in “hello.” The word “h e l l o” reads differently than “hello.” If the kerning isn’t properly optimized it becomes difficult to read the copy.
  • Improper tracking. The term “tracking” is used to describe the space between different words. Too much spacing makes words feel isolated and leaves sentences feeling fragmented. Inadequate spacing creates a crowded look that overwhelms and intimidates the reader.
  • Inadequate leading. The term “leading” describes the space between lines of text. The more common vernacular would be “line spacing.” While tightening up the line spacing can save space, it also creates a congested aesthetic. Likewise, too much spacing can make it difficult to read a paragraph of copy.

Your website should have no more than one to three different fonts. And they should be used fairly consistently throughout. (For example, one font for H1 tags, one font for copy, and another front for CTAs.)

4. Homepage Carousels

There’s a time and place for carousels, but they’re generally not recommended on highly-trafficked pages, homepages, or any other destination where you’re trying to grab a visitor’s focus and move them to action.

On its own, a carousel isn’t very problematic. It’s when they automatically scroll, play flashy graphics, or move too quickly that they become a distraction. They also have a tendency to look like ads, which often produces a phenomenon known as banner blindness in visitors.

Simply put, the cons of carousels far outweigh the pros. They’re much more likely to be conversion killers than engagement boosters. Use this real estate for something else.

5. Missing H1 tags

Missing H1 tags

It’s very important that you use header tags appropriately on your website. This is true for two specific reasons:

  • Header tags communicate to Google and other search engines what your website is about. If you don’t have an H1 tag, or it’s actually part of your banner image (rather than text overlaid on top of the image), you miss the opportunity to send the right signal.
  • Header tags tell a visitor what your website is about. It sets the stage for the rest of your copy and design. An inappropriate or missing header tag is a major mistake.

Unfortunately, a lot of website designers fail to properly implement H1 tags. This pulls SEO down a notch and also suppresses conversion rates. Here are a few helpful tips:

  • Always include your primary keyword in your H1 tag.
  • Your H1 tag should always, always, always be above the fold. (More on this later.)
  • Use the five-second test to evaluate your homepage. If a visitor can tell what your website is about in five seconds or less, your H1 tag is good. If they have trouble identifying your main purpose, it needs to be reworked.

H2 tags are important, too, but they don’t have nearly the same impact that H1 tags do. (And if you learn how to perfect the art of H1 tags, you’ll find it easy to do the same with your H2 tags.)

6. Slow Page Loading Speed

Page loading speed has a massive impact on conversion rates. According to one study:

  • A page should load within four seconds (and ideally within one to two seconds).
  • The first five seconds of page load time have the most significant impact on conversion rates.
  • Conversion rates can plummet by 4.42 percent for every additional second of load time between zero and five seconds. They drop by an additional 2.11 percent for each additional second beyond five seconds. In other words, a page that loads in seven seconds is going to convert 21.9 percent less than a page that loads in one second.

Okay…so what’s website design have to do with page loading speeds? Well, a lot. And, unfortunately, web design mistakes can bring a website to a screeching halt.

Websites that have too many pages, large image files, slow server response times and tons of on-page movement are much clunkier than those that use clean and agile design. Aim for simplicity and you’ll typically get a faster, higher-converting website.

7. Crowded Elements (No Whitespace)

A crowded website is a major mistake. We’ve already discussed the problem with crowded copy and improperly optimized typography, but it goes behind letter and line spacing.

Many web designers make the mistake of cramming too much information and visual elements onto a single page, which creates visual tension and prevents visitors from being able to focus on any specific part of the page.

You need to let your web design breathe. Proper use of whitespace – also known as negative space – can simplify your overall aesthetic and create an intentionally focused website experience that engages people on a visceral level.

8. Poor Menu/Navigation Design

Poor Menu/Navigation Design

Website visitors are often left asking questions like:

  • Where am I?
  • How do I get back to the homepage?
  • Where would I find _________?

And in most cases, this is the direct result of poor website design and layout.

A website visitor should always be able to find exactly what they’re looking for. It needs to be intuitive and obvious. Don’t get so cutesy with your designs that you unintentionally make it difficult on your audience. Keep it clean and obvious.

9. Uncentered Website Logo

This is a simple little mistake that can have a negative impact on conversion rates.

According to one study, website logos that are centered in the middle of a header, as opposed to being placed on the left-hand side, are much more difficult to find. When the logo is centered,  the research shows that 24 percent of visitors fail to navigate to the home page in one click. When the logo is left-aligned, just four percent of visitors have trouble finding their way home.

Don’t make things harder on your visitors than you have to. Preparing your logo design is a simple tweak to make, but it has a major impact on user experience and bounce rates.

10. Poor Use of the Fold

The fold – which is the imaginary line that demarcates the visible portion of a page from the portion that requires scrolling to reach – plays a key role in proper website design. Sadly, we see many websites use the fold improperly and ineffectively.

For best results, you should assume that your visitor will never go below the fold. By operating under the assumption that their entire experience will take place above the fold, you force yourself to execute.

The secret to successful above-the-fold design is to keep things simple and streamlined. You should include a very clear and concise USP or value statement (H1 tagger) and a simple CTA that encourages users to explore more of the page/site. (You can also use this real estate to grab some email opt-ins.)

11. Poorly Optimized 404 Page

The hope is that a visitor never ends up on a 404 error page; however, it’s bound to happen from time to time. And when it does, many websites suffer from poorly optimized 404 pages.

The goal of a 404 page is to get the visitor to stay on site and redirect – not leave the website because they can’t find what they’re looking for. If you’re using a generic/default page, you’re losing the majority of people. What you need is a targeted message that shows people you’re in-tune with what they want.

A good 404 page could include links to popular blog posts or an option to contact your team. You can even use humor, saying something like, “Well, that’s awkward…”

12. Lack of Analytics

Lack of Analytics

The final mistake is a lack of analytics. We see this all the time – and it’s frustrating. If you want to run a successful, high-converting website, you have to collect and analyze the right data. Otherwise, you’re simply throwing darts like a blindfolded bozo.

You don’t need to be a Google Analytics aficionado or data king. You do, however, need a basic understanding of how to track key performance indicators (KPIs) and study what people are doing on your website. This will empower you to make educated changes over time.

Partner With DEV.co

Looking to create an unrivaled digital experience that catalyzes your brand, maximizes your ROI and truly monetizes your website? A slick, user-friendly website that accurately articulates your brand’s values to the right target market can do wonders for your business.

At DEV, we take pride in our ability to meld strategic innovation with beautiful interfaces to deploy powerful virtual experiences that move people to action. Contact our team at Website.Design or DEV today to learn more about how our team can help you design the perfect website or redesign your existing site!

Ryan is the VP of Operations for DEV.co. He brings over a decade of experience in managing custom website and software development projects for clients small and large, managing internal and external teams on meeting and exceeding client expectations--delivering projects on-time and within budget requirements. Ryan is based in El Paso, Texas.
Connect with Ryan on Linkedin.
Ryan Nead