Web Pages That Suck - learn good web design by looking at bad web design

Submitter’s comments: It gets worse once you log in.

Vincent Flanders’ comments: Well, I’m glad I don’t have an account. The background is just horrible. This site would be improved 200% if they got rid of the background and just went with a solid color. Since this mistake is easily corrected, I’m providing a screenshot for posterity.

I’ve never used Tarot cards nor have I had a Tarot reading, so I can’t come up with some clever reference. This site is too gaudy.

The Tarot Guild

Submitter’s comments: WTF?

Vincent Flanders’ comments: There’s nothing worse than a website that actually has content—real content—but you can’t read it. When I ran the home page through AccessColor I got the following report:

The W3C recommends a standard of 500 or greater for the color difference and a standard of 125 or greater for color brightness.

Based on these considerations, the results for this page are:

1. Both color difference and color brightness do not meet the recommended standard for 47.1% of the total text.

2. Either color difference or color brightness does not meet the recommended standard for 32.82% of the total the text.

Nothing pisses me off more than folks telling everyone to support web standards when they fail to support the most elementary standard of all—being able to read the text.

CSS3, Please Let Me Read You!

CSS3, Please!

Submitter’s comments: Thought I’d suggest it in case you hadn’t seen it. I don’t know if poor design really applies since there doesn’t appear to be any design. It’s really just one long, segmented diatribe.

Vincent Flanders’ comments: I’ll give you a real truthism: If your website looks like this, it’s a sucky over-the-top website.

Truthism

Submitter’s comments: What were they thinking?

Vincent Flanders’ comments: I dunno. Maybe that we all have 60/20 vision?

From what I can see, the whole f***ing site’s this way. If this site’s head was any higher up its ass, it could kiss its tonsils.

Abercrombie & Fitch

Submitter’s comments: I can’t believe people are still doing this…will the bad designers never learn?!

Vincent Flanders’ comments: Actually, it might be bad clients. What’s interesting is there’s actually a lot of real text that could be indexed and Google has improved their ability to index Flash text.

Still, Mystery Meat Navigation should never be used.

Pearl Brite

Submitter’s comments: Most sites are bad because of strange aesthetics which diminish usability. For this one I have to ask, did anyone even look at the results?

Vincent Flanders’ comments: Maybe they never looked at the page because the topic is gruesome and sickening.

Since it’s an easy problem to fix, here’s a screen capture.

Child Murder Victims

Submitter’s comments: From the group that almost banned a team of 5th graders from the playoffs for being 6-0 and outscoring their opponents 171-0,  the West Central Youth Football League gives us a website that sacks usable web design for a loss reminiscent of the 57-0 loss shellacking the Missouri Tigers suffered at the hands of the Nebraska Cornhuskers.

From the hard to navigate, Windows 95-like menu tree to the left, to the black text on the dark red background that makes things oh-so-readable — I can truly say that this is one site so bad that it might actually be improved by a lost copy of Microsoft Office FrontPage 2003.

Vincent Flanders’ comments: The gradient on the background is what drives me bonkers. There’s nothing like red text on a red background.

West Central Youth Football League

Submitter’s comments: Unfortunately, I’ve had to look at this site. Flash – don’t you just hate it?

Their primary navigation – “click on a orb (sic) to select the product group” – requires you to hit a moving target! I can see no non-flash alternative and the only practical way to navigate seems to be to use the sitemap! The bizarre download ‘menu’ for product images and data requires you to pre-select the products of interest, but there’s no way to discover which ones might be of interest first.  Accessibility rating: zero.  The download is delivered as a .zip file causing the user extra work, but it’s a bit pointless as the image and PDF files are already fairly file-size-efficient.

Vincent Flanders’ comments: Actually, I don’t hate Flash. Steve Jobs of Apple Computer hates Flash. There are times it’s fine, just not very often.

The worst part about the moving navigation is that it takes a long time to load and I just sat around trying to figure out what was going to fill the black space on the left side of the screen. I also thought it might just stay black. Simply put, the design is not attractive.

There’s a new problem with Flash. Google Search has a new feature called ‘Google Instant Previews” that lets you look at a site’s home page before you click the result. Right now, if you have Flash on your home page, your preview isn’t any good. The image I’m showing is for Audi USA because I couldn’t figure out how to find Optima on Google UK.

Optima

Submitter’s comments: The navigation image blends and melts away, so either think fast or move slow and don’t view under the influence!

Vincent Flanders’ comments: When you go to the home page you’re going to say, “Vincent, you’re taking too many meds. There’s nothing wrong.”

Wrong. What’s the biggest problem with many of the websites that are listed in stupid articles like “42 Beautifully Awesome Websites To Inspire You”? I’ll give you a hint. It’s the “C-word.” Yes. Contrast. There are web standards that deal with contrast and this site violates them in a big way.

I ran the home page through AccessColor and the following report was generated:

Both color difference and color brightness do not meet the recommended standard for 29.78% of the total text.

Either color difference or color brightness does not meet the recommended standard for 28.26% of the total the text.

If you’re interested, here’s a 2Mb screenshot of the results.

Oh. Check out the menus on the subpages.

Why do I think God’s gonna send this site to hell? The home page is beautiful, but as it says in Exodus 24:7:

Then he took the Book of the Covenant and read it to the people.

Note: Moses (I believe) was able to read the book because there was enough contrast between the text and the background. God obviously wants people to read his words. This site is messing with God and if there’s one thing we learn from Exodus, it’s don’t mess with God. Just ask the Egyptians.

givemeananswer.org

Submitter’s comments: I think this may be a site about “free energy.” (I refuse to click on the mission statement.) Whatever it is, I suspect a little work could get it into the “over-the-top” group. It does share the near-mandatory long front/splash page. No wild colored fonts, multiple animated images, or horrible background, though.

Vincent Flanders’ comments: I don’t mind clicking on the Mission Statement link, but I do mind clicking on the link that wants me to install the Java plugin (Google Chrome) just so I can see the animated logo (IE9).

This page is really interesting because it’s as if he read my article Over-the-top Websites and eliminated many of the items I mentioned—wild colored fonts, multiple animated images, multiple-sized text, horrible background, etc. The result is 200% better than an Over-the-top Website, but it still sucks. The content needs to be organized into something logical. Either that or get some blog software and make each item a post.

The Tom Bearden Website