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

Vincent Flanders’ comments: The Huffington post recently ran the article 14 Websites We Don’t Even… Thanks to author Craig Malamut for referencing and linking to Web Pages That Suck. Eight of the 14 sites were originally featured on WPTS and Malamut knows how to pick the worst of my worst. In fact, he has a very good eye for very bad web design and his commentary has just the right amount of snarkiness. Kudos. The other six sites he selected are pretty freaking awful. I’m going to skip one site that seems like a personal site and honor him with submitting the other five as excellent candidates for Worst Website of 2011.

6. I Kiss You

His English is better than my whatever-is-his-native-language (“I try to be good person” should be “I try to be a good person”). By far, it’s the least offensive of the sites. Just a little cheesy (you’ll understand my reference to “cheesy” a bit later).

I Kiss You

10. Historian of the Future

The Historian of the Future has a website of the past. As I’ve said many times, there’s no need for a mission statement (unless you’re a nonprofit) because every mission statement can be summarized as “All babies must eat.” Except for this site. It’s mission statement is seven paragraphs long and I’m not sure what it says.

The great news is s/he actually tried to categorize the material and created a navigation system instead of one long page. The bad news is the site is 1996.

Historian of the Future

11. Raft.org

Holy Mother of God. This site was a definite contender for the #1 Worst Website of 2011 (ironically, I have about four sure winners), but the site has “disappeared.” It’s probably gone because of all the traffic The Huffington Post sent. Fear not. I made a quickie video (no sound) that will give you a good idea of how horrible the site was/is.

12. Aiseikai

It looks like it’s for a hospital. The sheer horror of it makes me wonder, “If you check in, will you be able to check out?”

We have everything that’s bad in American websites, with the added problem of Japanese text. These folks also don’t understand DNS. If you leave off the “www” as in http://aiseikai.or.jp/, the website won’t work. Then again, that’s not a bad thing. At the very least, it qualifies, as do most of the others, to join the Over-the-top Websites.

Aiseikai

13. Mama Cheesie’s

It’s an Italian restaurant, right? Nope. They sell handmade clothing and accessories. Not the least of the site’s problems is the name “Cheesy.” As the Free Dictionary defines the word, “Informal banal or trite; in poor taste.” Not what I’d want. I’m always stunned when I look at sites like this. Doesn’t anybody see that you can’t easily read the text. AccessColor says it fails W3C standards on 43.38% of the total text. It’s a total disaster.

Mama Cheesie’s

My wife: You know that link you sent me? They want me to register.”

Vincent Flanders’ comments: That isn’t helpful. “That link you sent me” tells me nothing. Fortunately, I went and asked her, “What link?” Turns out the link was for a new food site called Gojee.

Basically, you have to register before you can use the website. Yes, I know there are links, but they’re not terribly informative. The “About Us” link tells you it’s a food site that has a lot of writers, pretty pictures and if you tell them what food and food-related items you have in your cupboard, they’ll come up with a recipe suggestion.

I thought the “register before you can get content” concept was dead. I even thought about removing it from Does Your Web Site Suck? Checklist #1. Good thing I didn’t.

BTW, they’ve got some talented back-end people who are performing all sorts of web-page loading magic to keep this site so snappy. Gojee is also using Kissmetrics to help “Identify, understand, and improve the metrics that drive your online business.” Good idea.

In case you they change the site (and with Kissmetrics they might do that if their tests tell them to change), so here’s a screenshot of the Gojee home page. It’s very tasty.

Gojee

Vincent Flanders’ comments: My article, Does Your Web Site Suck? Checklist #1 — 155 Mortal Sins That Will Send Your Site to Web Design Hell, used to feature only 149 Mortal Sins. Well, we’re now up to 155 and it’s a doozy.

After going through hoops to enter my name, address, credit card info, etc., your $@$&*(% shopping cart blows up when I click on the submit button. (This mistake will send you to the depths of design hell.)

This isn’t the first time it has happened to me. It happened when I tried to order an upgrade to Adobe InDesign. If you ever dealt with Adobe, you know how difficult it is. You have to log in—which means you have to dig up the email address and password you created—plus all the usual ID and credit card info hoops. Just as I clicked the last button, it blew up. I never did upgrade InDesign.

You should check out the article. Lots of revisions and more examples have been added. There are examples for roughly 75 out of the 155 sins. More are on the way.

Submitter’s comments: My husband works for a scientific institution and couldn’t believe it when he encountered this website. It’s very hard to believe that this website is for an “intellectual” organization!

Scroll down to see what they added to the bottom of their site—”We apologize for any inconvenience.”—I guess they want to apologize in advance for giving people seizures!

Vincent Flanders’ comments: One of the things that bothers me about programmers—and other really smart folks—is they believe that because they’re an expert in one area (programming, let’s say) they are experts in all areas. I might tone it down a bit and say they believe they’re expert in many other areas. I think that’s what happened with today’s Daily Sucker. They think they’re web designers.

Frankly, I’m stunned. If you told me that an organization like this would have a site that uses animated images, 1990′s background image, pictures with white backgrounds on top of the yellow background, scaled images on subpages, tables and a whole bunch of other web design mistakes, I wouldn’t have believed you. The biggest of these “other mistakes” is the site doesn’t look professional and people don’t want to deal with you.

In some browsers, the graphics don’t even show up (Firefox 5 , Safari and IE9), but do show up in Google Chrome.

This organization reminds me of another one that I saved as a YouTube video—The International Association of Glaucoma Societies. That site was a classic

DAAAM International Vienna

Vincent Flanders’ comments: I wanted to be a professional poker player long before it became respectable. Back in the early 1960′s you were looked upon as a criminal, which you were since gambling was illegal. Unfortunately—or fortunately—I didn’t have the necessary talent, math skills, and people-reading ability. Oh. I couldn’t keep a poker face, either. Heck, I don’t know the difference between the Big Blind and my Big Fat Ass.

Well, the World Series of Poker (WSOP) seems to have something in common with VF. It’s not good at math. I went to look up the background on Jody Howe. He had recently been eliminated from the tournament and I wanted to see how much he had earned. The page said he had earned a total of $13,349 in his career, but it listed his WSOP winnings as $160,036. In fact, it listed this number twice. In case the WSOP fixes their mistakes, here’s a screenshot of the erroneous page.

If you’re going to use numbers, make sure your back-end software works correctly.

Jody Howe background page at the World Series of Poker

Vincent Flanders’ comments: It’s an important website. It’s one you should be reading. It’s one that’s difficult to read unless you’re on a laptop, Mac (I assume) or an iPhone (although the text is a little small).

What’s the problem. Contrast, of course. The home page is readable on my laptop—but it’s about five inches closer to my face than my desk monitor. Yeah, yeah, I know. Everything is fine if you’re close enough. But it fails the W3C guidelines for contrast. AccessColor reports that:

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 18.11% of the total text.
2. Either color difference or color brightness does not meet the recommended standard for 67.32% of the total the text.

You can see the first part of the results in this screenshot.

TNW has some front/backend issues, too. Yslow gives the home page a score of 59 and Page Speed gives it an 89. Yslow seems to score web pages like it’s the Olympics. Page Speed seems to score like it’s the Special Olympics.

The Next Web

Vincent Flanders’ comments: Back on July 4, I discussed a stupid web design feature I found on musician Robbie Robertson’s website. Here’s what I said:

Go to Robbie’s images from the 1970′s page. Take a look at the first photo entitled, “The Last Waltz.” Click on the picture. What do you get? Well, not what you’re expecting. If you’re like me, you think you’ll get a bigger version of the picture; otherwise, why is there a link? No. You get the same picture at the same size. What?

Today’s sucker is a little bit worse. Web Performance Today ran a very interesting and important article: Fourth-party calls: What you don’t know can hurt your site… and your visitors (make sure you read the article). In the middle of the page you’ll see a 480- x 352-pixel graphic (here’s a screenshot). If you click the picture to see the larger version, you get a slightly larger 667- x 486-pixel graphic that you really can’t read.

If you go to the original image on SlideShare and then click the full screen icon, you’ll get an image that’s 1095- x 806-pixels and you can read it.

If you’re going to make an image bigger, make it big enough to read and understand.

Web Performance Today – Fourth-party calls: What you don’t know can hurt your site… and your visitors

An eyetracking study that is very, very interesting. Hint: men like faces and women like shoes. It’s presented as a slideshow. http://read.bi/pQBpMq

They also examine a web site for an automobile. Ironically, women look longer at the car than men do.

Think about this in terms of your website.

Submitter’s comments: I believe this is intended to be a commercial site for a breeder of livestock dogs and pygmy goats. However, the site is such a hot mess that I can’t figure out whether it is personal or business.

Either way, I don’t believe I’ll be purchasing my next puppy from these folks.

Vincent Flanders’ comments: I have never understood how someone could look at a home page like this and say, “Yes, this web page looks just fine.” No one has been able to explain this phenomenon to me. Then again, I just got an email from a site that’s a contender for Worst Website of 2011 and said he improved his website and wanted to know it still sucked. I swear to you that I can’t see a single change and even if it has changed it still sucks like Hurricane Katrina.

I can’t tell if this is a personal or business site—and that’s good enough to make it a Daily Sucker.

Livestock Guardian Angels

Submitter’s comments: Mystery Meat (Navigation) offender!

Vincent Flanders’ comments: Holy Mother of God. I’ve been on the web since early 1995 and if there’s one thing I’ve learned it’s that just when you think you’ve seen the stupidest website on the internet, something comes along that’s much worse.

Of course, today’s sucker is Flash-based, but I suspect that if Jonathan Gay saw what his creation hath wrought on this website, he’d poke his eyes out in embarrassment.

This website is one of the few that will give Xerox Real Business competition as the Worst Website of 2011. My favorite page is System for Success. Just go there, you’ll understand why.

SH Marketing

Submitter’s comments: This is George R. R. Martin’s official website. Sure this site looks like it comes from 1993, but call me crazy, I think it kind of works. I’d rather see something like this than say, J K Rowling’s mess of a website.

Vincent Flanders’ comments: Two of the scariest words in the English language are “kind of.” I wouldn’t want to drive something that was kind of a car (well, I did own a Chevrolet Vega). Still you get my point. A website works or it doesn’t work. This one doesn’t. That’s why it’s the Daily Sucker.

Except for some Beat Generation writers, my reading tastes end with Euripides. I had no clue about George R. R. Martin’s writings so I looked him up in Wikipedia. Turns out he’s had a successful career, but you’d never know it by his website. It looks amateurish. The color choices are wrong for many reasons, but lack of contrast with the text is the major reason. AccessColor says that almost 67% of the home page fails its tests.

There doesn’t seem to be any navigation on the subpages except to click on his picture. The subpages are ugly, except for the blog page, which only has 20% of its text fail the contrast test. It’s not ugly because it’s on Livejournal and I suspect he used one of their pre-designed templates. I don’t understand what the animations are all about. Perhaps they mean something to his audience. To me, it means he has bad taste.

Maybe this site appeals to his audience. After all, he’s getting around 8,170 visitors a day.

George R. R. Martin

I may have discovered an interesting social phenomenon: If a website is an Over-the-top Website, it probably belongs to someone who would be classified as a right-winger. I can’t believe right-wingers own the market for whimsical websites. Prove me wrong. Send me some left-wing nutjob websites.

Submitter’s comments: Whaaaattt???? Hopefully anyone checking this out is not looking for anything specific. Good luck finding it in this lifetime.

Vincent Flanders’ comments: When I went to this site I said, “Gee. I think I’ve used this before. The giveaway was the photo of Jeff Rense and his amazing hair. I checked and, of course, I had used it as the Daily Sucker on August 14, 2008. Since the site is so spectacularly bad, I thought it made the list of the Worst Websites of 2008. Nope. Well, I think I should give it another chance. Maybe it will make the Worst Websites of 2011.

For comparison purposes, here’s what his site looked like on August 12, 2008. This is what his site looks like today. Interestingly, AccessColor says today’s site has worse contrast than the one back three years ago. Back in 2008, here’s what I said about the site:

This site belongs to a category I call “Over the Top.” An “Over the Top” web site is just like pornography — you know it when you see it. Accept Jesus, Forever Forgiven (Warning: could cause seizures) is the perfect example.

“Over the Top” web sites generally deal with philosophy, religion, and politics, but they’re not mainstream. Rush Limbaugh’s site would fall into the “Over the Top” category, except he’s mainstream.

While the Jeff Rense Program site is world’s away from the “Accept Jesus” site, it makes use of the stereotypical lime green text intermingled with yellow text. Some text is centered, while other text is flush left and, of course, the page goes on forever. The background for the subpages looks straight out of 1996.

I also don’t know whether to be frightened by or jealous of Mr. Rense’s hair.

It took a long time to find any subpages—most links that I found were to other sites—but the subpage I found looked just fine. Otherwise, what I said in 2008 is valid—with the addition that a lot of the text is harder to read. That might not be a bad thing.

Jeff Rense Program

Submitter’s comments: I was looking around for some pet supply stores in my area and stumbled on this beauty.

Vincent Flanders’ comments: It starts off poorly and gets worse. You have the logo on a repeating background. Then you have a strange orange bar going down the left side, which is supposed to be the background. It would have been better to have a similar bar on the right, which would have centered the middle content section.

As you move down you have white text on a black background. It’s not horrible. Then you get to the gold background and all sorts of text problems–text in all caps, multicolored text on the same line, etc. The links are graphics, but not every graphic is a link. A couple of the links go to betteranimals.com–I’m not sure why–but I couldn’t get the site to load because their server timed out. As far as I can tell, it’s a one-page site.

P & A Feed and Pet

Vincent Flanders’ comments: Robbie Robertson has had an amazing musical career. Simply amazing. His website is your average musician website—not as brilliant as his career nor as badly designed as it could be. However, he’s committing a very annoying web design sin: clicking on an image doesn’t give you a bigger image.

Go to Robbie’s images from the 1970′s page. Take a look at the first photo entitled, “The Last Waltz.” Click on the picture. What do you get? Well, not what you’re expecting. If you’re like me, you think you’ll get a bigger version of the picture; otherwise, why is there a link? No. You get the same picture at the same size. What?

About.com’s Record Comic Book Auction Prices page has the same problem, but presents it in a more obnoxious manner. When you mouse over the comic book graphic, the message “View Full Size,” pops up (screenshot 250 x 400 pixels). Guess what you get when you click? The same-size picture (screenshot 250 x 400 pixels).

A site that knows how to handle images is PostSecret.