Worst Websites of 2010 - User Interface / Navigation
In the past this group was called "Worst Navigation." While navigation isn't always the user interface, in most of these examples it is and it's done poorly.
For years I've tried to understand why people purposely muck up their navigation and user interface. Every single site on my list must have said to themselves, "You know, it has been to easy to find products/information on our web site. I think it's time we made it difficult for our visitors. They won't mind.
Many of the sites use Mystery Meat Navigation, which Wikipedia describes as
…a disparaging term coined in 1998 by author and web designer Vincent Flanders to describe a visually attractive but concurrently inefficient, confusing, or abstruse user interface, usually one that is Internet-based. Such interfaces lack a user-centered design, emphasizing aesthetic appearance, white space, and the concealment of relevant information over basic practicality and functionality… The typical form of MMN is represented by menus composed of unrevealing icons that are replaced with explicative text only when the mouse cursor hovers over them.
Worst Websites of 2010
As usual, I have a separate list of horribly designed websites whose mistakes are not primarily navigational. You can find them at:
The Original Contenders
If you want to check out the sites that I used to compile the final list, you'll find them at:
This may be the best example of head-up-your-ass web design I've ever seen. WTF?
Update: The company gave themselves a proper website (kudos). They explained their reasoning behind the first version of their website and they gave a link to the original site. Make sure you check out their current site. It's a site that you can actually use and you can read the freaking text.
Other comments #1: This must be what it's like to attend a private showing of the works of a never-before-seen artist. Just say "Brilliant, cutting edge, overwhelming," tap your fingers in the palm of your other hand lightly, sip your wine, and mouth "outstanding" on your way out as you pass the moron who's responsible for wasting your evening.
Other comments #2: I looked at this page in the Lynx browser and saw:
but there are no links.
Other comments #3: This tilting-image thing appears "prepackaged" because I've seen the same thing on other sites. (Compare http://www.needleprintsociety.com/dxownmultiscree...) The navigation is thoroughly exasperating and the tendency of the images to tilt at the slightest movement of the mouse definitely does not help.
Other comments #4: Yup, it's prepackaged: http://simpleviewer.net/tiltviewer/app/
2. Maison Martin Margiela
WTF? WTF? WTF?
In the last 15 years, I've seen plenty of examples of stupid navigation. This may be the worst. This site's navigation scheme is to web navigation what pedophilia is to the Catholic Church.
Other comments #1: When I began to nod out I realized I just wasn't sophisticated enough to appreciate what a fine website it must be. I can't stop yawning. Must take a nap.
Other comments #2: Important safety tip—if you have to explain every aspect of your website to your audience, you have failed.
Other comments #3: This site would cause an uber-geek to wet his pants, but it will cause a clothing shopper to choose another website. In sticking with the Magritte theme ("This is not a popup,"—"Ceci n'est pas une pomme"), I'll say that "This is not a website."
3. omniFEEDBACK: Start The Change
I was reading this article about “inspirational Flash sites” (an oxymoron) when I noticed that potential Worst Website of 2010, Got Milk?, was featured. To its credit, there were actually some Flash sites that weren't bad—mostly because they refrained from using Mystery Meat Navigation.
Then I ran across omniFEEDBACK. I realize video is the future of the web, but I don't think a 5Mb infomercial does anyone any good. The 29.89 seconds the site takes to load the page doesn't make me love it.
Yes, it's beautiful, but so what?
Other comments #1: Maybe I should have dropped acid before staring at the rotating orange disks. I only made it about 15 seconds into the actual advert. Maybe there is a site there, but I have even less patience for "Coming attractions" in my chair at work than at the theater. If there's a place on that site where they could transfer money from my pocket to theirs -- the only reason to have a business site -- then they would have just lost me to a competitor. Really. Someone is *already* at your site -- no need to sell them on how wonderful you are!
Other comments #2: Anyone who has played Fallout 3 (a huge hit in the gaming world) will recognize waaaaay too many similarities in look and feel. The folks at omniFEEDBACK get a great big FAIL for this one, and Bethesda Softworks might have a little something to say about it sooner or later.
Other comments #2: Be forewarned, I cranked up the online stopwatch for my slow machine but went into a stupor and began drooling before I realized the 17.401 MB presentation had finished loading, at 3:43. The second time, the loading time was accurately timed to 3:22. I did read the information board, but it took a few seconds to click the X. That damned robin never did fly off. After I read the board, I clicked the X and then clicked the 'seller' button. That spiel ended when the old house appeared 4.09 minutes later.
No doubt the video was constructed for company management to watch. The problem is the program creators assume that all the potential buyers are running a quadcore processor and 4 gigs of RAM plus whizbang video cards. The real world ain't like that. Viewers don't upgrade machines so they can watch Flash presentations.
4. Got Milk?
Submitter's comments: Here you go:
Long Loading Page? Check.
Stupid Music? Check.
World's Most Annoying Navigation? Check.
Flash Overdose? Triple Check.
This website sucks!
Vincent Flanders' comments: Check. Another problem: the text is difficult to read. Checkmate.
Other comments #1: Encouraging folks who can drink milk to do so is a good idea. Milk is tasty and good for you; however, I thought I remembered another Flash-based, idiotic brainchild about milk like this one. This one is certainly no better.
Other comments #2: Couldn't get it to load at all. The Flash page ran OK (though annoyingly), and after that… nothing.
Other comments #3: Click the chicken and "help mother hen relax. Mother hen is tense and irritable. Solve the puzzle to unruffle her feathers and help reduce her symptoms of PMS." This site definitely has a peculiar smell.
Submitter's comments: These people are designing the office layout (not that you can tell what they do from their home page) for a company where a couple of my good friends work.
If they design offices like they design websites, we wouldn't know where anything was – we would have to wander aimlessly around until we found what we were looking for. Can you have Mystery Meat Navigation in the real world?
The problem with the navigation concerns the subpages—like Landscape Design. You have to mouse over the little plus symbols to find the navigation. Yikes.
Maybe all the plus symbols on the lower level pages are really crosses – to mark the death of the spirit of web designers everywhere?
Vincent Flanders' comments: It's the Christmas season so I'd like to say, "If Jesus' website looked like this, Christianity would be a fart in the wind of history.”
Obviously, the site belongs in my article Architecture — An Industry With Sucky Websites. My lead-off paragraph states:
I don't know what the deal is with architects. For an industry that depends on accuracy and stability, they seem wildly inaccurate and unstable. They love, love, love, love Mystery Meat Navigation, which doesn't make sense because they wouldn't use this technique on their buildings. When it comes to their web sites, architects seem to be one floor short of a complete building.
The Mystery Mean Navigation on subpages like Landscape Design are just morally wrong. Move your mouse around the top of the page to see what I mean.
As my friend Dizzy would say, "Man, they smokin' crazy sh*t.”
Speaking of crazy things, it's pretty crazy that somebody in charge doesn't understand DNS. If you leave off the "www.” and just type http://hboemtb.com/, you can't get to the site—which may not be a bad thing.
On the plus side—and it's a very big plus—I can read the text.
6. Zinc Bistro
Submitter's comments: It's been a while since I've seen Mystery Meat Navigation used on a website, so I thought I'd send you this site. Honestly, I don't see this much any more—see if you can find the navigation on this page. (Hint: it is next to the little graphic that says "Navigate,” and has an arrow pointing to it. Even then, it takes a moment to realize what the heck is going on.)
I was floored that I couldn't just click what appeared to be the "Lunch” or "Dinner” graphics at the top. The music, which plays when the home page loads, is also one of my biggest pet peeves.
Vincent Flanders' comments: Whenever someone says to you, ”There's nothing wrong with using Mystery Meat Navigation,” send them to this site. I hereby revoke my Mystery Meat exemption to band, art, personal, music, et al. sites until such a time as site owners and designers become responsible citizens. If people see something stupid, they want it. This must stop.
Other comments #1: The weird thing is, once you get beyond the front page it reverts to perfectly sensible navigation.
Other comments #2: Exactly. Why not use that navigation on the home page as well?
I'm also getting an error on the recipes page. In IE I get a generic error message, but in Firefox I get:
The page you are trying to view cannot be shown because it uses an invalid or unsupported form of compression.
Other comments #3: This brings up one of my pet peeves: Forget the MMN, stupid use of Flash and the unattractive (in my opinion) color palette. How about performing a little QA testing on your site first, before you publish it?
Other comments #4: The splash page is done entirely in Flash, but the rest of the site is in plain HTML. This means you can't navigate to the menu on a smartphone, but you can read it if someone else sends you the link.
This is one of my pet peeves. When I'm out looking for a restaurant I don't want to find a computer that has the Flash plugin installed just to learn what the restaurant serves and how much the food costs. Provide an HTML alternative and I can read the menu from my phone.
Other comments #5: Music. I hate music on websites. Especially when it takes me 30 seconds to find the OFF button. I clicked "Recipes" and got the message "Content Encoding Error." Nice.
The site is gone. I made a video so you can see what it originally looked like.
Submitter's comments: I thought you might like this site. It might be Latin or it's just a template with lorem-ipsum generated text. I'm not sure, because the font is too small and I can't read it. My personal favorite: the menu runs away when you try moving your mouse over it.
Vincent Flanders' comments: WTF! This is Mystery Meat Navigation at its worst. Well, it may not be the worst, because the worst example of MMN is something I made up—Random Mystery Meat (see below).
Yes, I know there is regular text navigation at the bottom of Nomec, but that doesn't excuse the use of MMN. Besides, when you go to the pages the text is so small you can't read it.
nomec — The site is parked. The original URL was nomek.net
Here's a video showing what it originally looked like.
8. Ben the Bodyguard
I click this Twitter link that sounds interesting. It's about protecting your iPhone's information and since
I'm thinking of getting and I purchased an iPhone, I go to the site. The site's well done and it doesn't bother me that I have to scroll down the page for what seems like forever because it's telling a clever story.
The problem is quite simple. When I get to the bottom of the page I find out THE FREAKING PRODUCT ISN'T OUT YET!!! YOU'RE WASTING MY TIME!
This isn't high school. Don't product-tease me. I really don't like it. I'm willing to bet that this site gets a lot of positive press because of its cleverness. I love clever—but only when there's a punch line. There's no reward here.
Added this before posting: There's a button on the site that says it's been "Liked” 6K times and bit.ly says it's shortened the URL 22,538 times. Well, we know there are at least 6,000 usability idiots out there.
I hated what this site did so much, I made a YouTube video expressing my feelings.
The site will be "fixed" in January 2011.
Other comments #1: Clever, indeed! Still, I honestly cannot add anything to your comments, Vincent; they sum up the situation well.
Other comments #2: Very clever. I've never seen anything like it.
As for Vincent's comments, I suspect what's happened here is that the Marketing Department has decided to try to create some buzz before the launch. I agree that this is completely annoying from an end-user point of view. A perfect example of launching a website to meet their own goals, rather than their users' goals.
Submitter's comments: I think it's pronounced ‘suck.'
Vincent Flanders' comments: You've got Mystery Meat Navigation where the meat changes—fortunately, the links stay the same—and a needless use of Flash plus, for some reason, they're using the https protocol. I don't understand.
What really sucks is that you have itty-bitty little thumbnails of the products. The problem is that you're not sure what they represent until you click them. On the "Kids and Pets” page I clicked a picture of a dog. Turns out it's a pillow. How is it possible for me to know that? You just wasted my time. Actually, the whole site is a giant waste of time.
Other comments #1: Not to mention that it takes around 10-15 seconds to load every time you clicked one of their links. I can imagine why the owner of this site is not getting as much sales as he/she hoped. It is because they used web design techniques that get in the way of the sale. Simple.
Other comments #2: This site could have easily been done in XHTML/CSS and drastically improved loading time. Here's a hint: if it takes longer than 5 seconds to load your products page(s), you just lost a sale.
Other comments #3: Honest to God, the very first thing I thought when I saw this site was "WTF??????" There are many things wrong with this site, as noted above, so I will pick on the first thing that comes to mind: What is this site about? One cannot tell what the site is about without clicking a link somewhere. I know that sounds like so little, but a little thoughtfulness in design, rather than an intense desire to be quirky-cute, would have been effort well spent.
Mutilating a famous saying: "I don't think, and I use Flash; therefore, I can be a successful web designer"
The disturbing degree to which the above statement appears to be commonly believed is enough to make one weep.
10. Pearl Brite
They've fixed the site. Strangely, I don't have a video. I just have a larger screen capture of the home page. The comments that follow are about the original site.
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. Although that's nice, does it matter? I asked myself the question, What's the difference between Adobe Flash and my mother? Flash is dead, but it just doesn't know it. I'm proud to have been among the first to shoot Flash—long before the Web Standardistas started piling on.
Other comments #1: That truly is a fine sucker. An excellent example of Mystery Meat that has a seriously irritating backing track. Although you can turn the sound off, you can't turn off the stupid fly-zapping sizzling sounds when the balls meet. It really is quite appalling and unusable. On the plus side, the moving balls can put you into a Zen trance if you watch them for too long....
Other comments #2: It's got all my favorites. Faded text, random position page links, vertical scrolling columns in if ram es, Involuntary background music that never quits, it's slow to open and 59% of every page is wasted. What a hard-to-read, slow loading piece of crap.
Other comments #3: Surprisingly for a Flash site, it is too tall for my laptop screen. Is there something to be said about the egos that drive teeth-whitening would be the ones asking for a site like this? (Wow, this post made it to "What's Hot in Google Reader"!)