Ever landed on a website that made you scratch your head in confusion?
Bad websites are everywhere: they make it difficult to find the information you need or navigate to the place you want to go.
Bad website design can end up costing you money in lost sales and conversions, so it’s important to not overlook the importance of a well-functioning website.
Thankfully, there are a few things you can do to fight poor website design. You need to pay attention to:
- User experience. Things like speed, poor navigation, broken internal links, overall usability, mobile responsiveness, and website security all affect the user experience.
- Visual design. Image quality, overall design and color contrast, choice of typography, website layout, and use of animations all contribute to a visually appealing (or unappealing) interface.
- Copywriting. Good copy helps you make sure your website has a clear message and is optimized for search engines.
20 examples of website design you should avoid
Still not sure what to look out for?
Here are 20 bad website examples that help you recognize and stay away from web design choices that could end up costing you in the long run.
Suzanne Collins Books website leaves a lot to be desired.
You would assume that the author of the Hunger Games series would have a website exempt from design mistakes? Think again.
When it comes to examples of bad websites, Collins’ website is too often listed as one. But there’s a good reason for it. While the site somewhat works on a mobile device, a lot of the content shifts and moves in ways that leave room for improvement.
The site structure is very plain, with no clear call-to-action sections. In fact, all the links to other websites are almost hidden in a sidebar with no clear function. There are no contact details available, not even a contact form or a comment section for feedback.
At a glance, you might think you’ve time-traveled to the 90s when you land on the official website of Pacific Northwest X-Ray. We don’t want to be harsh, but it’s, unfortunately, the worst example of a bad website with an overall bad design.
It doesn’t take much advancing technology to upgrade this low-quality website into a better, more modern new website.
By creating a dedicated landing page, using solid colors instead of outdated gradients, and having a clear navigation menu, the website would already improve its user experience by a ton.
The thing is, Pacific Northwest X-Ray Inc gives the visitor no reason to browse the website or familiarize themselves with the services offered.
The landing page has no copy about the company, what they do or what they offer. The only thing the user can do is choose between searching for products or clicking on a set of links that lead to some of the product pages.
The moment you land on Tag Team Signs, you’ll notice that bigger is not always better.
From the get-go, it’s not fully clear what the company is selling, as the bright red base color and huge heading font size attack the eye.
What’s worse, if you’re browsing the website on different devices, you’ll soon notice that the huge titles take up most of the space and leave mobile users frustrated, to say the least.
Like many bad websites, this one isn’t inherently awful: it has a navigation menu that’s relatively straightforward, contact forms, separate pages for different functions, and a coherent color scheme.
But it’s the details that bring Tag Team Signs’s one-page website down. The fonts are too big and the colors too bright, and there’s a mismatch between which website sections are deemed as important.
As bad websites go, we have a few bones to pick with this online store.
The store isn’t the world’s worst website, by any means – it has a distinguished menu and a footer, and clear product photography in general.
While Blinkee gets points for trying, there are still plenty of things that the website designer of the store could do better.
The website lacks a clear color scheme or a proper effort to build a brand in general. The store’s logo looks outdated, and the header section of the landing page could do a better job in communicating to the visitors what the store is all about at a glance.
The menu bar could also be more logically organized, and a lot of the information is repeated in both the top navigation as well as the footer itself.
While we appreciate that this Norwegian website is trying to mimic the look and feel of the old-school phone book and Yellow Pages, from a website design standpoint, the Arngren website is one of the worst websites out there.
Where do we start?
The chosen font is so small a lot of the copy on the website is hard to read, not to mention skim through. The layout of the site is also too jam-packed with content, without any negative spaces to let the design breathe.
The poorly-situated and overflowing navigation menu doesn’t include just the most relevant information for the visitor. Instead, every single category listed on the website can be found in the menu, making it overly complex to use and defeating its purpose in the first place.
As ugly websites go, this one is a perfect website to include on this list.
Claiming to be the world’s worst website, this site clearly aims to break all the design rules for the sake of it.
When browsing this website, it quickly becomes clear that the website owners are proudly trying to make sure this website is as bad as they come. There’s broken code in the headings, the background images repeat and create a comically wide website that doesn’t fit in the browser window.
The website has chosen one of the internet’s most hated fonts, Comic Sans, as their font of choice, and don’t even get us started on the comically huge font size in the menu. The clashing colors and various blinking animations do a great job of distracting the user and making sure they leave the website feeling utterly confused.
The thing is, on the surface, Goodreads is a decent website and has good website design. But at the same time, the site leaves a lot to be desired after you’ve used it for a while.
If you’re a big Goodreads fan, feel free to skip to the next item on our list – because, let’s face it, some bad design examples can boil down to artistic approach and preference.
A few examples of these include the categorization of the ‘Groups’ section under the Community tab (there are too many filters and categories to choose from) and the outdated and cluttered layout of the user dashboard in general.
Goodreads isn’t necessarily the worst website of all time, given its popularity and active user base. All we’re saying is that it’s one of those websites that could be designed better.
If you’re looking for one of the worst websites out there, The Big Ugly Website is a strong contender for the award.
While it must be said that it’s very likely that the entire purpose of this website is to showcase bad design and bad usability, this website is still not the one to base yours off.
This one-page website acts more like a landing page with external links on it, rather than a website promoting any other services or products. There’s no user-friendly navigation, no coherent color scheme, and the links to the pictures (hosted on another website) are all broken, too.
While we can’t say there’s incorrect color usage at play at The Big Ugly Website, the chosen colors certainly clash, and the entire design of the website lacks any thought for the visitor.
Bad websites often share a set of characteristics with each other, just like this business website demonstrates.
Berkshire Hathaway’s website has no images on its landing page. In fact, most of the pages consist of white background and text with hyperlinks in it, with next to no second thoughts given to layout, call to action sections, or even a proper menu, header, or footer.
Needless to say, the site has overall poor usability, even if the design scales for mobile devices. You need to know exactly what you’re looking for and where you can find what you need.
The content overall is riddled with jargon and uses overall complicated language, alienating potential visitors.
10. Brandon Joyce
There are quite a few things about this website that simply don’t work.
Aiming to be a virtual magazine, Brandon’s website delivers when it comes to the content itself, but miserably fails when it comes to visual design and overall user experience.
For starters, the website hasn’t got a secure connection, leaving it vulnerable for potential phishing attacks – not a great way to greet people landing on your website.
The website design itself is not from the 21st century: elements are placed chaotically on top of each other, and there’s even some visible code in the background. The navigation menu makes little sense to a new visitor, and various flashy iFrames and animations make it difficult to focus on everything that’s going on.
11. Drudge Report
This website has a cult-like following and some praise it to be one of the best examples of internet brutalism at work.
And while they are not wrong – the Drudge Report consists of some well-written copy – from a visual and UX perspective, it could do better.
Like Brandon Joyce’s website, the Drudge Report lacks an SSL certificate, leaving the connection vulnerable to malicious activity.
With no clear menu, the website can only be navigated by scrolling and clicking, making it easy to lose your way and get lost. The lack of colors, visual elements, and images for the most part leave this web design resembling a wall of text rather than a modern-day website.
12. Ryder Ripps
When it comes to site design, don’t take any pages out of Ryder Ripps’ book.
As an excellent bad website design example, this website hasn’t really got a distinctive design to speak of. Since most of this site is just basic plain text on a white page with some hyperlinks, you don’t get a sense of the person who’s trying to showcase their work.
With no SSL certificate and many broken links and images, the visitors are left with a poor user experience and no incentive to stay on and browse the content for long.
Don’t get us wrong – for the most part, Ravelry champions all things good web design. But we have an issue with the platform when it comes to navigation and user experience.
A well-designed website should be intuitive and effortless to navigate – the user journey should be logical and mapped out in bite-sized chunks.
In Ravelry’s case, the moment you’re logged in and try to look for anything, you’re on your own.
Want to search for patterns? Be ready to get bombarded with advertisement content and too many different ways to search. The moment you find something, making sense of the clunky individual project and pattern pages becomes the next hurdle.
As the worst websites go, Ravelry isn’t as bad as some other websites on our list. But it won’t get any brownie points for usability or intuitive design, that’s for sure.
14. Hacker News
Missing the old-school forums and message boards of the late 90s?
Then you’ll love Hacker News. But if you’re anything like the vast majority and have moved on from vintage website design, you’re going to have a tough time understanding what Hacker News is and why you should be interested in finding out more about the website.
With no clear menu or hero section, there’s no telling what the user should be doing when they land on the home page. The font choice and lack of proper formatting, too, don’t support the user experience, making it hard to glance over the content at once.
Since most of the links redirect the user to another website in a new tab altogether, the chances of a visitor not returning to the landing page aren’t high – meaning that the bounce rate increases, which in turn can negatively affect a website’s SEO.
When it comes to bad website design, you wouldn’t expect to find examples of poor web design on the websites of acclaimed educational institutions.
But the website of MIT Center for Advanced Visual Studies Special Collection doesn’t dress to impress.
The lack of a menu or other form of navigation leaves the user with scrolling – something that quickly makes the website even harder to view and explore. With experimental effects morphing the text and images as you scroll, it’s hard to not feel seasick by the time you reach the bottom of the page.
The images presented are too small, making the text even harder to read, and big file sizes result in long loading times, which all negatively affect the user experience.
Bella De Soto’s ugly website does something that no website should do – it wants to auto-download files to your computer when a user lands on it.
Whether this is on purpose or not, it’s a foolproof way to scare off visitors for sure. When it comes to the website itself, it’s hard to make sense of what you’re being greeted with, if you decide to stay on the page.
Text is placed on top of other text, images clutter the background, and various old-school effects clutter the view and distract the reader. There’s no navigational menu, no coherent color palette, and don’t even get us started on the lack of mobile responsiveness.
As worst websites go, De Soto makes a convincing case for being a top contender for the worst website of 2021.
17. Penny Juice
When we think of bad website examples, Penny Juice, unfortunately, springs to mind. And when you open the official website of the company, you too notice why.
As far as business goes, Penny Juice is a food producer selling juice for childcare centers.
But that’s not immediately clear when you land on their website. The lack of a unifying color scheme, the use of bad stock photos, and no mobile optimization result in a bad website that looks unappealing on both mobile devices and desktops.
The main page lacks clear call to action sections, and the copy leaves room for improvement, too.
18. Toronto Cupcake
There’s no doubt about the fact that the cupcakes sold at Toronto Cupcakes taste delicious. But their website leaves room for improvement.
First of all, the product photography on the website feels like it’s been shot in poor light and not from very flattering angles. This results in a gap between the real product and the images on the website, and can negatively affect the overall sales from the website.
From a navigational point of view, the space in the menu bar could be more efficiently used. By hiding the main menu behind the hamburger icon, the visitor needs to click around more to get from A to B – something that could result in a confusing customer experience, and in the worst case, an increased bounce rate.
The lack of overall structure on the individual web pages, or a coherent color scheme overall also demonstrates the poor design choices made on this website.
As one of the most prestigious art schools in the world, you would expect the Yale University School of Art to comply with all the latest web design trends, right?
It’s no surprise that upon landing on the school’s website, prospects and visitors alike are taken aback by the outdated design of the landing page.
The background seems a bit too simple and dull, as opposed to opting for a more dynamic picture of the school or artwork created by the students. The color choices, too, are somewhat clashing, requiring a lot of the text elements to have a fixed-colored background that adds to the clunky-ness of the website of the Yale School of Art overall.
The menu, too, is very small and difficult to navigate, making it difficult to spot in the first place, not to mention the small font that doesn’t add to the readability of the site.
20. 007 Museum
Here’s a prime example of a poorly designed website that could have been so good.
Due to the many huge files left uncompressed on the site, the page takes a long time to load, negatively affecting the site’s SEO overall.
There’s also no clear menu or overall structure to the landing page – many design elements are static and can’t be clicked or interacted with in any way. The different sections on the landing page differ in size and structure, making it hard to take in all the content.
As the website has just one long landing page, a lot of the information gets lost as the user can only scroll up and down on the page. Not the best way to leave a great first impression on a passing visitor.
So, how do you design a good website?
- Simple, easy-to-follow navigation. The more complex your navigation is, the easier it is to lose your visitors – and the moment they are lost, the chances of them closing the tab and leaving your site increases.
- Using ready-made templates. Nowadays it’s possible to rely on professionally-made website templates, meaning that you won’t have to learn to code just to have your own website.
- Clean and clutter-free page layout. Less is more, especially in web design. You shouldn’t be afraid to use white space to let your content stand out and, more importantly, breathe. White space also helps visitors to take your site in at a glance.
- Using high-quality images. With so many image upscaling tools and multi-camera smartphones available, there’s no reason to not take the time to make sure the images on your website actually reflect your products and services. Plus, good product photography can increase your bottom line, too.
- Secure web hosting. In this day and age, there are no excuses for choosing a web hosting provider who cannot provide your site with an SSL certificate. Or, you can step up your website game and use website builders that come with both hosting and the necessary security.
- Mobile-responsive design. By not having a mobile-friendly website, you’re not just doing a disservice to half of the people on the internet – but you’re also angering search engines, too. The longer your site takes to load on a mobile device, the worse your SEO will be.
Nowadays you have more options to create and design a good website than learning a coding language or two.
Using a website builder is a wonderful way to create a website that looks and works like a modern site should.
Top builders like Zyro allow you to sign up for an account and try the website builder for free, making it easy to test the different AI-powered tools out without feeling like the good stuff sits behind a paywall.
Become a pro web designer with Zyro
While there are bad websites out there, yours doesn’t have to end up on a list like this one.
With Zyro, you can create a website that follows all the modern web design principles without having to train to become a web designer.
Ready to flex your design muscles and create good-looking websites?