Top ten web design mistakes, 2005 edition

Jakob Nielsen’s annual list of web design mistakes is out. Top Ten Web Design Mistakes of 2005 contains some of the web design stupidities that annoy me the most. Here’s the list, with my comments added to some of the mistakes:

  1. Legibility Problems: Tiny, low contrast text is hard to read, even for people with perfect eyesight. But some think it looks good and use it anyway.
  2. Non-Standard Links: Why make your visitors guess where the links are? You don’t have to stick with the default link colours, so there is room for creativity. But don’t rely on colour alone.
  3. Flash: More people use Flash well now than a couple of years ago, but there are still way too many examples of Flash used badly.
  4. Content That’s Not Written for the Web: I’m not sure I agree that content always has to be written specifically for the web. I do know that what annoys me more is badly written content. Fix the spelling mistakes and bad grammar before publishing. Please.
  5. Bad Search
  6. Browser Incompatibility: Good point, but it would have been better if he mentioned web standards instead of specific browsers.
  7. Cumbersome Forms
  8. No Contact Information or Other Company Info
  9. Frozen Layouts with Fixed Page Widths: If you’ve been reading this site for a while, you know that I am an advocate of liquid or elastic widths. I especially dislike layouts that are overly wide and fixed.
  10. Inadequate Photo Enlargement: After spending countless hours looking at real estate sites I’ll tell you that I find it extremely annoying to click on a “view larger photo” link and get a popup window that displays the same photo. What is the point of that?

Agree? Disagree? Let’s talk about it.

Posted on October 5, 2005 in Usability

Comments

  1. I’m not sure I agree with #9. There are merits for both sides of the argument, and I’ve not set my tent in either camp.

    There are times when a fixed layout does the job better than an elastic or variable width site, and there are times wheen elastic/variable is the right choice.

  2. I posted my thoughts on my site, but in general, i agree with most of the concepts listed here. As per usual, Jakob is a bit sensationalist and sweeping in his comments, but the ideas are generally good.

    I’m also not sure about #9. While I do generally agree that liquid or elastic designs are the best possible option, I’m not sure it’s a mistake to go fixed. It may not be the absolute ideal, but it generally works just fine.

    Also, I really hate the wording of #3. Jakob would have been better served to call “excessive animation” or “annoying sounds” a mistake, than to name “Flash,” a technology, as a mistake. Flash can be well-used. I suspect Jakob knows this, but by making it the title of #3, he doesn’t really display that he knows it.

  3. October 5, 2005 by Arnaud

    The #10 is right on the spot. I have sometimes hesitated to buy things online from stores that didn’t provide any photo larger than 300px. For some products, it’s way too small to see any detail.

  4. Re: #10: This is certainly an annoyance, but I am surprised it made the Top Ten Web Design Mistakes list. I can think of several thing I’d have put ahead of it.

    But yeah, it’s still annoying.

  5. October 5, 2005 by zcorpan

    Set the keyboard focus to the first field when the form is displayed. This saves a click.

    I disagree with this one. I would rather put the relevant form control first in the source code, so that it can recieve focus first when I want to tab to it. When focus is forced by scripts you take away my control and break normal UI behaivour. If one thinks that the first form control should recieve focus automatically, then there’s a bug with the browser, not the web site.

  6. October 5, 2005 by Gabriel Porras

    About the rule # 9 i must say that I used a screen resolution of 1600x1200 with a 19” monitor and i hate the 100% width. Really is “unreadable”. I prefer the Frozen layouts. No matter 800 or 1024.

  7. Gabriel,

    body { max-width: 1000px !important; } in your user stylesheet should fix the problem.

  8. overly wide and fixed

    I think this all depends on the site’s content. For example Yahoo’s front page is fixed and works great, while Amazon is liquid and fills up nicely as well. All that said, your site should not horizontally scroll at 800, liquid or fixed.

  9. Thank you! I’ve waded through countless diatribes about this, but while Mr. Nielson may not be an “authority”, he’s entitled to his opinion and I agree there are some good points as well. So nice to see a real authority do anything but lambast it.

    Miniscule text sizes happen to be a pet peeve of miy own and I’m happy to see it number one on the (subjective) list. Born of legacy code, I’m beginning to get the resizable text thing flowing in recent updates. Although IE is a bugger there, a simple !important/alternate makes it easy to get around and there’s absolutely no reason not to do it.

    As for “writing for the Web”, I agree that writing is writing, no matter the medium and every time I see “then” used in place of “than” in a newsletter sent out by a local SEO company, I want to drive to their offices and throttle somebody. Would I hire the same SEO company myself? No.

    As for the rest, let’s keep it in perspective and understand that simply because this or that may not jibe with our own preferred way of doing things, doesn’t mean it has no merit whatever.

  10. Re. #4 I would argue that there is a definite difference in the way that content should be written if it is to go on the web.

    For example, paragraphs should be much shorter and lists used more often than they would be in the print world.

    I have this exact challenge in my daily work life, where I get content that is written for print but has not been edited specifically for the web.

    This is perhaps Nielsen’s most important point - after all, what is the point of having a web site if the content within it is unreadable?

  11. 3) Generally, i agree with Jeff, but this i couldn’t agree more, Flash is a great technology albeit some accessibililty issues but even then they are trying to rectify it somehow. True there are abundance of annoying usage of Flash around but that doesn’t mean the technology is bad, it means the people who use them have little to no fundamentals on the technology itself.

    4) It depends, if it’s a company site, isn’t that the job of the copywriter? Not all of us are well versed in the English Language and not all of us are grade A students. I can live with typo/spelling/grammar errors in websites.

    Cheers.

  12. I would like to add “self destructing” content management software. The site validates until the day the webmaster decides to paste a MS-Word document in the fancy WYSIWYG Editor.

  13. October 6, 2005 by Roger Johansson (Author comment)

    Re: #9: Fixed width is acceptable unless it is so wide it will give a large portion of visitors a horizontal scrollbar (like the current A List Apart design). Completely fluid width is not a good idea unless you combine it with concertina padding.

    zcorpan: Good point.

    Christian: Yes, on-screen readability of most content that is originally written for print can be improved. But I find that spelling errors and bad grammar generally hinder me more than text that hasn’t been specifically adapted to the web.

  14. Mostly valid points with good criticism above. What annoyes me, though, is #6: Browser Incompatibility.

    I mean, what is this? 1999? There’s no browser wars, start talking about standards and recommendations instead. I would regard talking about adatping to specific browsers as the Top Usability Expert/Manager mistake of 2005.

  15. And just to show my strong feelings about this, I litter my comment with typos. I’m sorry and I should be ashamed…

  16. October 6, 2005 by Roger Johansson (Author comment)

    Robert: Agreed. Jakob is no web developer and doesn’t seem to know or care much about web standards. Talking about specific browsers is a huge mistake.

  17. Hey guys, don’t forget he asked his readers to contribute so that he can derive the top mistakes. From my experience, all points are valid. We have a lot to do, and our main problem is not AJAX, as it is hyped these days.

  18. Date!! It’s not really a design thing, but since designers often get involved in the various bits of content (not the spelling of the words) they have a tendency to oversee the importance of clearly displaying the date. I hate it when I can’t find the date or if I search and search and later find a tiny grey text saying “13 Jan 2002” which means that I’ve been reading old stuff.

  19. Seeing as I find Jakob Nielsen’s site to be nearly unreadable, I created a user script to improve readablity.

    The script works both in Opera and Greasemonkey and limits the width of his site to 48em, and centers the content.

  20. I totally agree with #10. As far as flash is concerned, I use it on my site to showcase my photography while keeping it semi-safe from theft and search engines like google/images. I hate using watermarks on my images and these days it’s just too easy for people to right click and save images.

  21. “and these days it’s just too easy for people to right click and save images.”

    I got a chuckle out of this one.

  22. October 8, 2005 by night

    Scrollwheel that get stuck in a ad frame, (like the google at the end of the article) and I have to click once more in the page, innoying!

  23. October 8, 2005 by Roger Johansson (Author comment)

    The “scrollwheel getting stuck in an ad iframe” problem seems to be a Firefox/Windows bug. It doesn’t happen in any browser on the Mac.

  24. Nothing too suprising this time around. Glad to see old man Nielsen wading in on the whole Fixed/Liquid layout :) Not sure I would have put photo enlargement in my top ten but hey each to their own. We actually cover this article in this weeks podcast (http://www.boagworld.com/archives/2005/10/webdesignpodc_6.html) so check it out if you want 30 minutes of pointless rambling about it :) I know! I could have sold that better.

  25. Other point is that when we want to follow all the rules, forget the user, the utility it`s more important

  26. October 11, 2005 by Mordechai Peller

    (1) As I’m not an IE user, small text is in and of itself only a minor annoyance. However, too often I find that even a slight adjustment to font size causes text to be either hidden or over lapping.

    Low contrast text, on the other hand, is a major problem. While it’s not hard to fix, it’s usually too big a pain to be worth doing.

    (2) Another method of making links obvious is context. If someone sees a list of what appears to be sections of a site down the side of the page with a different background than the main text, even if it isn’t underlined or in standard link colors, it should be obvious that they might be links. That said, I’ll usually set the hover state with underlining and color/background change to confirm that it’s a link.

    As far as making visited and unvisited different, it depends on the link and its context.

    What is a big problem is JavaScript only links. Those I hate with a passion.

    (3) Flashblock extension.

    (4) The deeper you go into a site the less of an issue this generally is.

    (6) It’s amazing how many clueless Web designers are out there. I heard a podcast recently where the caster was says how he likes using padding except that it doesn’t work properly in Firefox. In case you’re wondering, I don’t think he’s ever heard of a DOCTYPE.

    (7) Setting the focus is good if that’s the main purpose of the page by a wide margin (e.g. Google).

    US only and US centric forms are a big annoyance.

    (8) Not giving contact information makes perfect sense. After all, making it easy for law enforcement officials to contact you can be major hindrance to your phishing site.

    (9) While this isn’t a problem if done correctly, but since when do most designers do things correctly.

  27. 10 - I have seen this many times before and found myself asking the question, “What’s the point?”

    Regardless, good list of mistakes. Now, if only supervisors were to understand some of these mistakes and account for them.

  28. I am writing a comment to the Top 10 Web Design Mistakes: I have been an Interactive developer / web developer for quite some time now and I will say to all those “savy to the Web” that with Flash the possibilities are endless in all areas of “web theory”.

    I mean come on folks; we’ve all seen some pretty crummy CSS and DHTML menus going haywire… So to say that Flash is the Poster child for all things wrong with online experiences is just “Out dated”

  29. October 14, 2005 by Landman

    It seems everyone is in agreement with #10 - and I do agree that it doesn’t make much sense to link to an image that is no larger than the original. However, what I wonder is how often this is symptom of a poor CMS.

    You get Joe Product Guy in a department that has been told to upload a product (or a house photo as Roger mentions) and they have no concept of imaging (resolution, etc). The CMS allows them to upload an image, so dammit, they upload an image with their product description. I could easily see this being the case for real estate sites where a system has been sold to a client with the promise that they can update it themselves.

  30. October 22, 2005 by Susan

    I have seen people use horizontal scrolling in interesting and engaging ways:

    http://blueskymarcom.com/pages/Grid…rtfolio02a.html (click the “more work” link to see the scroll page)

    or http://www.nanadc.com/

    I think it is a great way to showcase portfolios. Would you not recommend doing this?

  31. October 22, 2005 by Roger Johansson (Author comment)

    Damon: Sure, creating a bad user experience does not require Flash.

    Landman: That is probably often the case. But even Joe Product Guy could check the page he just created and realise that the “enlarged photo” is the same size as the thumbnail.

    Susan: I personally think forcing horizontal scrolling is a really bad way to showcase a portfolio. What’s the point really? How does making your portfolio more difficult and confusing to use increase your chances of landing a job? Others may disagree, but I think most people looking to hire someone don’t want to waste their time trying to figure out how to navigate your site.

  32. Regarding Flash - that’s right. Needless to say it greatly depends on the clients’ requirements - I have noticed that it’s quite difficult to make a client describe his needs when it comes to Flash. However, I absolutely agree that it’s a design mistake as a professional web designer or project manager should be capable of collecting requirements from any client.

  33. Hello everybody. I am new here so please try to bear with me. I was wondering if I can get some “constructive criticism” towards my mini website that I have with my College.

    I appreciate every feedback in advance.

    Sincerely,

    Patricia Alzate(The writer)

  34. What about search engines? Does anyone consider that in design? I mean, if a tree falls in a forest and nobody sees it or hears it, did it fall? Does anyone care?

    My point is, that all this discussion is on user comfort and taste, but what about talking about search engine design mistakes?

    Wayne

  35. How about content from content provider…Any comments about putting someone elses content legally on your site? Good or Bad?

Comments are disabled for this post (read why), but if you have spotted an error or have additional info that you think should be in this post, feel free to contact me.