5 Examples of Bad Website Design and How to Do It Better

5 Examples of Bad Website Design and How to Do It Better

The design of a website is a critical part of your users' experience. When you have a poorly designed site, interaction drops, from getting visitors to complete an action, such as buying a product or joining a mailing list to encouraging users to spend time browsing your website.

If you are not getting the results that you want from a webpage, such as increased conversions and decreased bounce rates, evaluate the design.

We’ve gathered 5 examples of mistakes we've caught on other websites and added how we would solve these mistakes with great website design techniques.

1. Websites Without a Clear Message

One of the worst design mistakes that you can make is not providing a clear message related to the purpose of your website. Users should instantly know the name of the business and what they sell.

The site CyberDsignClan is another example of a website without a clear message. You simply see a large graphic that reads, “skip intro” After clicking on the page, the real homepage loads which can be confusing for visitors and we still don’t understand the purpose of the site at the homepage.

Everything that appears on the page before users need to scroll further is considered above the fold. We call this the "hero section." This is the area where the name of the business and some indication as to what they sell should be included. The top of the page should also offer some type of navigation.

Website visitors form opinions about the business within a split second. If users need to scroll through the page to find out what the company does, they will likely leave the page or in web terms, bounce.

2. Too Many Elements Cluttering the Page

Besides a clear message, the site should have a clear layout. If a page is cluttered, it becomes hard to navigate, causing visitors to once again exit the site.

Arngren.net is a good example of bad design. This classified website contains listings thrown together with no structure. The listings are not divided into categories and they fit together like a jigsaw puzzle.

For another example, visit Lings Cars . The website is for used cars but has so many different elements, you may overlook the purpose of the site. The designer included at least half a dozen animated elements above the fold, making it incredibly hard to navigate the page.

It is possible to display a lot of content without cluttering the page. For a good web design example that features multiple products, look at Amazon or AliExpress . While both sites contain a never-ending scroll of products, they are organized in grids instead of being thrown together like a mosaic.

3. Pages with No Mobile Optimization

Most internet traffic in the US now comes from mobile devices, yet many websites are still built for desktop computers first. Websites not optimized for mobile devices lack a positive user experience for many visitors.

Many sites now include responsive design, which allows the web page to adjust elements based on the screen width of the user’s device. The site may also hide elements, change fonts, or remove backgrounds when a smaller screen is detected.

Almost all the examples already discussed do not have a responsive design. Deque University has an example of non-responsive web design.

If you are reading this in your web browser, try visiting the site and adjusting the width of the browser. As the browser window gets smaller, the page does not change its layout. The text becomes impossible to read without scrolling to the right.

If you want to see an example of responsive web design, visit almost any website owned by a major company, such as Nike or Microsoft .?

4. Lack of Simple Navigation and Links

When users reach a site, they should have no problem browsing the menu and finding the information that they need. On the official website of the University of Advancing Technology , the top of the page is covered with a large animated display containing floating graphics.

The floating graphics are clickable links that are difficult to click and slow down the page load speed. Although this is extremely innovative, there are other creative ways to design a website without making it difficult to navigate. Instead of using those floating elements as links, the University of Advancing Technology should have focused on creating a menu that is easy to open and browse.?

Lastly, many sites include parallax scrolling and embedded video elements that do not overpower the page and limit its navigability.?

5. Unreadable Text or Un-clickable Buttons

Due to the demands on the web browser, the menu on the previous site is almost un-clickable. This is also a problem when sites are not optimized for mobile devices. When the elements do not adjust for the smaller screen, they may overlap or become too small to read.

Avoiding this problem is easy if you complete detailed testing before launching your website. Use emulators or software to emulate how your site appears on various mobile devices, including the latest smartphones and tablets.

How to Avoid Bad Design for Your Website

The examples discussed are relatively easy to avoid, now that you know what to look for. However, implementing the necessary changes may require technical expertise. At WANDR, you get the help of experienced UX designers that understand what it takes to create a better user experience.

If you want to ensure that your site does not contain any of the bad design examples discussed, consider working with professionals.

If you want to read more in detail about 5 Examples of Bad Website Design and How to Do It Better, check out our full blog here .

Need experts to help with your website? Schedule a call today!