We’ve all come across a website at some point that was so horrible that we left after less than a minute. Perhaps it was so ugly that it hurt your eyes, or maybe there were so many ads or the website took forever to load that you just got frustrated and clicked the exit button.
No one thing makes a website bad. Bad graphic design comes in many forms, such as:
- An ugly color scheme
- Too much clutter
- Too many ads
- Slow loading
- Confusing fonts
- Flashing colors
- Outdated designs
- And more
Bad Graphic Design Examples
In this article, I will go over more than 20 bad graphic design examples that will help you learn what NOT to do when creating a banner or website. I’m sure some websites are even worse than the ones I will write about, but some of these are pretty horrid.
1. Clickbank
Clickbank is one of the oldest affiliate marketing companies out there. It was founded back in 1998.
Although it used to be one of the most popular directories for finding affiliate products to promote, it has since lost its popularity with most affiliate marketers, who have moved over to newer sites like JVZoo.
Although Clickbank recently revised its homepage, its marketplace/directory still looks like it did a decade ago. As you can see in the screenshot above, the layout is not terrible – and it works – but it does look outdated, unattractive, and old.
The lime color is also pretty repelling.
2. Government Websites
For some reason, government websites seem almost always to look outdated, like they have not been updated since 1997. Take a look at the EFTPS (Electronic Federal Tax Payment System) website.
The website not only looks outdated, but the page does not even fill the screen – half of the screen remains a blank, white space.
The reality is that government websites often run on old software systems that have not been updated for decades. Overhauling all of these systems, with all the data in them, and transferring them to a modern software system that is entirely different, would not be a simple task.
State government sites are a bit better – at least recently. Still, sites like NorthDakota.gov are pretty ugly.
3. The Daily Mail
The Daily Mail is a prime example of the type of news website cluttered with ads, automatically playing videos, and clickbait articles trying to grab your attention.
The homepage is a mess of articles, self-playing videos, a popup asking to allow notifications, links to social media profiles, more clickbait headlines, clickbait images with attractive women, and more. It’s just a confusing mess that is hard to navigate.
Not only that, but the site takes forever to load – regardless of how fast the internet is or what device I am using. It ALWAYS takes a long time to load.
The individual news articles are no different. There are always clickbait links to other articles in between paragraphs and the images take many minutes to load.
News sites are often like this – the Daily Mail is not the exception to the rule. To make money and compete with subscription-based services like the New York Times and the Washington Post, free news sites often clutter their articles with sponsored articles and videos – all in an effort to boost their revenue.
The result is a site that is hard to navigate and use.
4. Pennington Folk Music Festival Hamfest
Ok, so this one is a banner, not a website. However, it’s important to point out that bad graphic design examples exist everywhere – not only on websites but also in magazines, newspapers, billboards, and flyers.
This is a lousy poster because it is hard to figure out precisely what is going on at first glance. There are so many colors that stand out at you that your eyes just hurt and your brain gets confused.
The fonts don’t make reading this poster any easier.
The “Pennington Folk Music Festival” text is not even enlarged or highlighted – it does not stand out in the least. When you advertise something on a flyer, you want people to understand what you are promoting at first glance – at least the word “Hamfest” is highlighted.
This is just a poorly designed flyer. The choice of colors is horrible – the bright red and yellow are hard on the eyes, and they do not go well with the blue and green.
5. Peter Watts’ Website
Many author websites can do better. Take Peter Watts’ website, for example.
Peter Watts is a Canadian science fiction author who has written books like Starfish and Maelstrom. His website for his novel Echopraxia, however, is terrible.
At first glance, it is pretty hard to figure out what the website is even about. It does not introduce you to the novel; you will need prior knowledge of what the book is about to understand this website.
Not only is the headline confusing, but the paragraphs beneath that and the links on the right side are also.
A link to the author page can only be seen if you scroll down a bit, and even then, it is not very visible. The author page itself is boring and has long blocks of text that are hard to read.
6. Suzanne Collins Author Website
Suzanne Collins is a well-known author and TV writer who has written several New York Times bestselling books. However, her author’s website is underwhelming.
Keep in mind that this is her author’s website, not a website for a particular novel.
It is not terrible, but it lacks imagination. It looks outdated, there are few images, and the text is plain and boring. After a long list of awards for each book, all in uppercase letters, there are long paragraphs of book descriptions that are uninteresting and hard to read.
There are only four options in the main menu: The homepage, a list of her books, a page with an interview transcript, and a biography. The interview transcript has questions that are not even bolded or in a heading format, making it hard to scroll through, and there is only one image at the top of the page.
7. Dokimos
I’m not entirely sure if this site is serious or not, but it is a contender for the most horrid website on this list so far. Religious convictions aside, this site will terrorize you from the moment you look at it.
There is a bright rainbow of colors that moves quickly across the screen, which is likely to give you an instant migraine if you don’t look away quickly. The main message of the site is clear, at least: Accept Jesus, Forever Forgiven.
It’s just that the font, the flashing verse from the scriptures, the moving heading, and the flashing, bright colors are overwhelming.
Besides, there are a lot of things happening on this page that seem to be random, with no connection to the message of the site:
- There is a black cat continuously running across the bottom of the screen.
- There is a ladder with a bucket of paint falling off it.
- There is a military-style airplane rotating from side to side.
- There is a dove that flies across the screen, sometimes backward, defying the laws of nature.
- There is a random balloon that does not move much in the upper left corner.
- A rotating sign reads “SLOW” and has a picture of someone doing construction on the other side.
- A door opens to the words “Click Now” when you hover your mouse over it.
The website’s homepage is just as bad: There is a big, bright star in the center of the page that screams “Click Here!” and bright colors rotate out of the star in all directions. The verses are tough to read against this backdrop of flashing colors.
The homepage reads “Since 1996” – perhaps the site has not been updated much since then. In either case, this is a prime example of the worst thing you can do when trying to make a site navigational and easy to read.
8. Arngren
If you thought Craigslist was terrible with its outdated interface, take a look at Arngren. I can barely make out what the site is about – it would probably take a while even if I understood the language.
Arngren seems to be a site selling different ATVs, drones, scooters, and other sports equipment and technological devices. However, the site is challenging to navigate, and each page is poorly organized.
You can take a look at the English version here – but it is just as bad as the original, with pictures and product information spread across the page as if the creator threw spaghetti on the wall until some of it stuck.
The homepage is a total mess. If you think you’ve seen cluttered websites, think again – Arngren is a prime example of why using a weird color scheme and not including white space will prevent people from navigating your site.
9. Drudge Report
The Drudge Report rose to prominence after it broke the Bill Clinton and Monica Lewinsky scandal. It was started in 1995 as an email aggregation subscription by Matt Drudge.
The Drudge Report was one of the most visited websites globally, with sites like Forbes, CNN, and Fox fighting to get links from Drudge, knowing it would lead to a rush of traffic. Although its viewership has gone down in the past year or two, it remains very influential.
It received more than 10 billion visits in the past year and more than 24 million visits in the past 24 hours.
The Drudge Report website’s design is not terrible, but it has not changed much since the days of the Bill Clinton and Monica Lewinsky scandal. It is a simple page, with just a few images in between links and links to news articles, often with clickbait headlines.
However, on mobile devices, it can be a bit tough to use.
Drudge is not a terrible site. However, by today’s standards, it isn’t good – and it could be updated to make it more readable and easy to use.
10. Yale University Of Art
You would think that a University of Art – at Yale, no less – would have a great webpage. However, the Yale University of Art’s website is pretty bad!
The letters are small and hard to read – some are small white letters on a black background. There seems to be a picture of the university’s entrance in the website’s background – but that picture is doubled (the same image appears twice across the top and bottom of the page), and a blank purple space breaks up the picture.
The menu is confusing, as is the moving text in a box at the bottom of the screen.
The website is bad enough, but the fact that it belongs to the Yale University of Art makes it even worse.
11. MIT Center for Advanced Visual Studies
Again, here is an example of a well-renowned university with a terrible website. This website features a black background with white, red, and blue text.
When scrolling down, the text becomes slanted, making it hard to read. There are also links and calls to action in weird places – it is just not a website that is easy to read or scroll through.
Again, the fact that this is a center for visual studies makes this all worse. Perhaps they tried to be different and cool, but at the end of the day, this is a hard website to follow.
12. Gates N Fences
This website is hideous! The green at the top is very unattractive and there is a lot of small text in tiny fonts that is incredibly difficult to read without straining your eyes.
The red menu on the left side is not easy to navigate at all, and the site is not very scrollable overall. Links are interspersed randomly throughout large blocks of text.
If you create a website for a business, don’t make it look like this. Focus on highlighting the benefits your potential customers will gain from using your services and make them stand out.
Include plenty of white space and images to make the site easy to scroll through. Also, include pictures in the right places to catch people’s attention – and above all, reduce clutter and unnecessary links and information.
13. Old TeacherXpress Website
Okay, so this website is no longer online. However, you can see how this site looked by going to Wayback Machine, and it is an excellent example of why you need white space and images to make a site more readable.
The site was essentially just a whole bunch of links, one after the other. For example, there was a section with links to search engines and another section with links to newspapers.
It was not a bad resource, but the way it was set up made it hard to navigate. You would have to strain your eyes to find what you were looking for.
14. Aint Wet NYC
I debated whether to put this website on the list because it was made the way it was on purpose. The creators focused on a minimalist design, so they eliminated everything unnecessary – that means everything.
If you have ever taken the subway in New York City, you would recognize the layout of this website, as it is an exact copy of the Metro Card machines you use to buy tickets for the NYC subway.
Like the subway machines, the website is easy to use. It is ugly, but it is hard to say that it is BAD, which is why I was debating whether to include it on this list.
It is pretty good from a UX perspective, but from a graphic design perspective, it is debatable.
15. Haiti News Network
Haiti News Network, or HNN, is another news service with an ugly website. The site is basically a bunch of links, in an ugly green font, to articles.
What makes it worse than the Drudge Report is the green color and all the flashing icons, ads, and images on the page. It is hard to concentrate with all that going on – it is another example of how too much clutter and ads distract from what is going on.
If you make a news website, at least include images to catch people’s attention instead of only including links. Even the Drudge Report, which is mostly links, includes a few images on his page.
16. Blinkee
Blinkee sells, well, blinking stuff. However, the website is pretty ugly, and all the blinking graphics are very distracting.
Blinkee is definitely not the worst site on this list. However, it can be cleaned up a bit and made to look a bit more modern.
17. Ling’s Cars
This website made me chuckle. Ling claims to own the UK’s favorite car leasing website – a Leader of the Pack!
However, the website is so confusing that it is hard to make out what is going on. Between random graphics of Ling doing random stuff and making random faces, there are various cars and prices, but there are too many distractions to focus on them.
There are many animations that seem to make no sense or have no place, and there are just too many things flashing at once.
The website may very well be a joke, but if it isn’t, it certainly makes it hard for the user to find a good car to lease.
18. Jerry Pournelle
Here is another author’s website that is atrocious: The first link is not even fully hyperlinked, with the last letter being left out. Everything from the color scheme to the layout is outdated and not very appealing to the eye.
19. Jami Lin
I’m not sure what exactly Jami Lin does, but I do know that her website certainly convinces me NOT to do whatever it is.
Apparently, she does things as varied as affiliate marketing, making money online, Earth Dances, skincare, house astrology (?), and something called Turkey NeckLESS. She does promise consistent results with whatever she will teach you to do, so there’s that.
The creepy image under the headline “lots of FREE stuff” and above the headline “You will find what you seek” certainly does not inspire me, and the ad for “Clear Clutter” on the left side is somewhat ironic given the clutter on this website.
20. The World’s Worst Website Ever
So, this website was made as a joke, but the creators made it with the intention of highlighting the worst mistakes of graphic design from around the web. You have seen some of these graphic design “mistakes” on actual, live websites featured earlier in this list.
The website is absolutely atrocious. For a full list of (intentional) errors made on the website, see here – you can learn what to avoid.
Lessons Learned: What To Avoid
So, what you can learn from these terrible graphic design mistakes?
Here is what you should avoid doing:
- Using ugly colors
- Using bright colors that hurt the eyes
- Using a small font that is hard to read
- Cluttering your website with text, images, ads, and links
- Including a lot of ads
- Making flashing graphics
- Information overload
Here is what you should be doing:
- Include plenty of white space
- Use an easy to read font
- Use black text on a white background (occasionally red or yellow is okay, but use them sparingly)
- Break up long paragraphs of text
- Insert images to catch the reader’s eye
- Highlight what needs to be highlighted and make headlines bigger
Use a good graphic designing tool if you find these difficult to carry out. There are several good ones available.
Wrapping It Up
There are a lot of bad graphic design examples that are more subtle and not as “in your face” as the ones listed in this article.
Nevertheless, if there is one thing that this article should do, it should be to inspire you to make your website as presentable and appealing as possible.
If you can’t find yourself trusting a website that looks like Jami Lin’s, realize that others won’t either, so make your website look professional and modern.
