Top Ten Web-Design Mistakes of 2002

December 24, 2002 3:30 AM

Just in time for Christmas, Jakob Nielsen unleashes his list of Top Ten Web-Design Mistakes of 2002. [via the k10k]
posted by riffola (38 comments total)

The only thing I disagree with is the javascript in links. I was at a site that was setup so that links of a certain color opened a little pop up that gave a breif description or a definition of a word without taking you away from the page.
posted by Photar at 3:44 AM on December 24, 2002

The only thing I disagree with is the javascript in links.

Beet me to it, Photar. My beef is with treating web pages as static readable elements that are simply fodder for your web browser of choice. Today's major web sites are applications, and deserve to host their own particular functionality. You have a certain commonality on which to base your browsing experience, but there are custom elements to set the site apart from others and give it an extension to its functionality.

Jacob also says: "About 95% of the time, this fixed size is tiny, reducing readability significantly for most people over the age of 40. ". My first reaction to this was "Oh, get off of it, you fogey" but I realize that this reaction may be a bit hasty. In reality, the cohesiveness of design for web pages that rely on spatial relationships with troublesome text relies on a consistent font size.

In my experience, the only real way to combat this is to use the "pt" size indicator rather than the "px" size indicator in style sheets, and then preview your site on various platforms and browsers to ensure that it maintains its look and feel. I've found that Jacob's situation typically arises when a developer has measured his font size in pixels, and the person viewing the page is at a resolution or on a platform where a font that size becomes unreadable. The difference is that point size ("pt") scales to reference that size at whatever resolution you're on (the only variability being the installed font on the system, and how it renders variable-width spacing).

In general, I find Jacob's remarks on target, but oddly general when looked at a timeline. These are good tips for anyone, and apply to 1996 (his first entry in the series) as much as 2002. In fact, some of 1996's entries reappear here, in a subtly different form.
posted by thanotopsis at 3:54 AM on December 24, 2002

Beet me to it

Yes, after careful consideration, I meant "Beet".
posted by thanotopsis at 3:55 AM on December 24, 2002

<a href="whatever.html" onclick="yourFunction('whatever');return false;">

if more people wised up and wrote their javascript links like that (it degrades nicely for user-agents sans javascript) it wouldn't be such a problem...

em is more appropriate for use on screen than pt - the root of the problem is that ie for windows can't resize text with px sizes :/
posted by sawks at 4:07 AM on December 24, 2002

URL > 75 Characters
I don't agree with that because I've seen some good examples where the URL have been easy to read and understand, albeit a little longer than usual. To illustrate, look at the two examples below.

Bad long URL: Amazon's help page.
http://www.amazon.com/exec/obidos/tg/browse/-/508510/103-2267265-3475009

Good long URL: Evolt.org article about CSS-D mailing list finding a new home.
http://www.evolt.org/article/CSS_D_Finds_New_Home_at_evolt_org/1/50434/index.html

The evolt url is more human readable, so therefore in my opinion it's length is justified.
posted by riffola at 4:09 AM on December 24, 2002

I'm sure if we thought about it long enough we'd all come up with exceptions to everything he said, but yeah in general I'd have to agree. Another iritating thing that I read on another MeFi post just a minute ago but it escapes me at the moment is navigation bars in seperate frames.

I'd also have to especially agree with the root of the problem with the px sizes being the problem of the browser. Just look at Opera, its scaling features are badass. You can zoom the page to 50% and the text and images and everything scales by 50%, I love that. I also love scaling things up too.


The worst example of a bad url I can think of right now is the Apple Store.

http://store.apple.com/1-800-MY-APPLE/WebObjects/AppleStore/

I mean sure putting your phone number in your url is cute and all and maybe something I'd expect from a company lacking style like Gateway, but not from Apple.
posted by Photar at 4:21 AM on December 24, 2002

I think the point about the URLs is that they spill over lines in an e-mail (where 75 is the standard line length). Lots of users will have problems reconstructing the URL from what they receive in the e-mail.
posted by saintsguy at 4:22 AM on December 24, 2002

I can't say I've run into that problem with my email. But I guess it your email client doesn't automatically turn them into links it would be a problem. Alot of the time I get urls sent to me in on ICQ or AIM or MSNM and they wrap around 3 or 4 times. But its a link so I just click it.
posted by Photar at 4:27 AM on December 24, 2002

The only thing I disagree with is the javascript in links.

I was very pleased to see this listed. I always expect a link to act like an HTML link; if I don't want it to take me away from the page, I ctrl-click it to open it in a new tab. But ctrl-clicking a window.open() link will cause any of the following to occur (depending on the javascript used):

A. Opens link in new window (designer: yay! me: boo!)
B. Opens link in new tab (me: yay!)
C. Opens a blank tab
D. Both A and C
E. Both A and B

I was at a site that was setup so that links of a certain color opened a little pop up that gave a breif description or a definition of a word without taking you away from the page.

That sounds much better than when window.open links look exactly the same as HTML links. But I still hate the "the designer knows better than you" attitude. I'll open my own windows, thank you very much.

(Tabs vs. Windows is really a Mozilla-specific issue, but I'm sure similar problems must occur in IE, right?)
posted by skryche at 5:18 AM on December 24, 2002

Javascript links and unscalable font size are bad because people who can't see properly or have cognitive disabilities are denied access to the web.

Javascript doesn't appear in text browsers, certain disabilities means the back button is a vital navigation tool, which is broken by javascript, etc. Mark Pilgrim's Dive Into Accessibility (specifically this) describes it all rather well.

And if concern for our fellow (wo)man doesn't sway you, it busts Google as well.
posted by RichLyon at 5:40 AM on December 24, 2002

I agree on the javascript links too. I use ie with java and active x off by default, except for known sites, which stops the cookies, popups, and I don't worry about the occasional ie exploit. I can't tell you the number of times I find that the link's text is something like (excuse the syntax):
javascript:linkto("http://foo.com")

If you need the scripting because your page is an application, then fine. However, there are countless sites that have rewritten the basic follow-a-link functionality in javascript.

And you know, the web designers don't win either. I am not going to turn on scripting just so I can follow your links, especially when the link url is in plaintext right there. Copy shortcut, alt-d, ctrl-v, and the http address in ie's url textbox.

In sum, most the time isn't not enhancing functionality and it forces the user to jump through hoops to perform a fundamental www request. Sure seems like bad design to me.
posted by adzuki at 5:45 AM on December 24, 2002

One more thing: a neat little (undocumented?) ui function in ie that most people don't know about:

Holding control and scrolling the mousewheel changes the font size. It doesn't work on those pages with the size stylesheeted/hardcoded in, as the article says.
posted by adzuki at 5:48 AM on December 24, 2002

Whats worse are those sites where whatever pleeb designed the site decided you shouldn't be able to open a link in a new window... This is alot more annoying then the java link problem.

Luckily I found a simple workaround. (right click... keep holding the right click... hit enter to OK the popup box, and let go of the right click. bingo, you get the right click menu)
posted by LoopSouth at 5:52 AM on December 24, 2002

I think the cartoons are excellent, especially number 4. They make the recycled bits of wisdom a little easier to swallow. And how about adding another common mistake — markup that doesn't validate.
posted by dayvin at 6:07 AM on December 24, 2002

adzuki, add to that list holding the Shift key and using the mousewheel to move Back and Forward between pages (works in IE6/Win, at least).
posted by dayvin at 6:11 AM on December 24, 2002

dayvin, if you like the cartoons, you might want to check out the long-defunct but still-excellent webcomic Waiting For Bob, by the same writer and artist team that did the cartoons in the article.
posted by toothgnip at 6:21 AM on December 24, 2002

Javascript in links is an excellent way to link to your web pages that are so crappy, they don't deserve to be indexed by search engines.
posted by chipr at 6:23 AM on December 24, 2002

Javascript doesn't appear in text browsers, certain disabilities means the back button is a vital navigation tool, which is broken by javascript, etc.

All the problems mentioned so far with javascript are problems with the person writing the script, and not inherent javascript faults. javascript imay be the tool used to break the back button, but it's entirely the fault of the programmer who wrote it, and it's unfair to blame the language for that.

well-written javascript can extend the user experience for those who have it, while leaving all functionality open to those who don't.

the same goes for flash - i see way too much ranting about flash and javascript, and not nearly enough ranting about people who don't know how to write them properly.
posted by chrisege at 6:31 AM on December 24, 2002

Inability to zoom text because a page's designer has used absolute font dimensions is a defect with IE, not the page. Mozilla/Netscape/Gecko browsers and Opera all zoom such text quite satisfactorily.
posted by normy at 7:00 AM on December 24, 2002

The one I had a problem with is #2:

Overly literal search engines reduce usability in that they're unable to handle typos, plurals, hyphens, and other variants of the query terms.

A) Heaven forbid you should be able to spell what you're looking for! Maybe search engines should have little pictures you can click on, like the registers at McDonald's. Yes, I'm bigoted against stupid people. Sue me.

B) Google already does this, sort of. (And Google has it set up so that if one of your search terms is misspelled, and your search doesn't get any hits, it automatically forwards you to the spell-corrected version instead of just giving you a "did you mean 'x'?" link. Grrr.)
posted by RylandDotNet at 7:21 AM on December 24, 2002

Bad long URL: Amazon's help page.
http://www.amazon.com/exec/obidos/tg/browse/-/508510/103-2267265-3475009

A little investigation showed that http://www.amazon.com/help leads to the same page.
posted by mfli at 7:24 AM on December 24, 2002

To add to the font-size question, I'd like to add this: a wide difference between type sizes on the same page. Frequently I see this where ad copy or navigation copy is set much larger than the main text copy, and the result of this is that when I scale up the text to read the body of the item in question, the whole page goes to hell in a handbasket. Or, vice versa, scaling up to read navigation knocks the article type up to something absurdly large.

Generally speaking, I don't create web pages with more than one pt. or so difference in HTML text sizes. If my design is dependent on the type size staying the same, I'll use images (if absolutely necessary, anyway, and, yes, alt-tagged), not text. Very few web designers seem to actually check their pages out with the type jacked up.
posted by babylon at 7:27 AM on December 24, 2002

Good luck changing # 1. It seems a marketing strategy now to have you ask for the price.

Like testing the water to see what you are willing to spend, a used car tactic.

Also something I see while out in the work force. Here's our product that we offer. Call us and we will talk about pricing. Which may be because of the lack of sales too though, the economy. But I see less price sheets with distributors. They seem to be separating the two, product & price especially on first view.

Good post as it answered some FAQ questions for me specifically that topic.
posted by thomcatspike at 7:49 AM on December 24, 2002

Good luck changing # 1. It seems a marketing strategy now to have you ask for the price.

Brilliant marketing that. If I can't look up the price on my own, I take that product off my list of possibilities. I make tech purchasing decisions for my department, too. We do just fine not dealing with sleazy companies.
posted by ursus_comiter at 8:27 AM on December 24, 2002

Speaking of user-controlled font size, it's my biggest complaint against Mozilla so far. The stupid program makes you customize the font size separately for EVERY page you visit, unlike IE which lets you simply choose "larger" which is applied to all pages you visit. I can imagine a few situations where this ability to treat pages individually might be handy, but in far more cases it is a major pain.
posted by rushmc at 8:48 AM on December 24, 2002

if you set the font size via preferences in mozilla, i think it applies to all pages. at least, i just (after reading this discussion) rewrote my stylesheet to use "em"s and the size changes depending on the font size selected in the preferences (i may have misunderstood what you're saying, and i'm using moz 1.0).
posted by andrew cooke at 9:04 AM on December 24, 2002

ursus_comiter: I believe that the lack of price quotes aren't because of marketing, but rather because it's software. Maybe the vast majority of B2B sites are selling software. What's the fair price for a copy of software? There's no market in it, so prices could go as high as businesses are willing to pay. The production costs are already spent in development, so the prices could go as low as needed for the vendor to get the deal. In one case a list price caps the profit, and in the other it's not going to be used.

Of course, the used car salesmen thing happens. I knew a saleman who was selling some software with a list price of 40K. You'd think that he might try to squeeze a little extra out and quote 45 or 50K, but no ... he quotes 160K and knocks it down to 80, and everyone is happy.
posted by adzuki at 10:20 AM on December 24, 2002

Actually, with enterprise-class B2B software companies, the answer is usually sort of in the middle between marketing and "because it's software".

Firstly, the salespeople desperately want to set up meetings for demos, or at the very least chat on the phone, due to the scale and complexity of the products. With ERP, for example, there is no good or short answer to the question "What does it do?"

Second, most EC software has a licensing model that is extremely flexible (to say the least). There are per-seat licenses, per-seat tiered, flat-rate, enterprise pricing, etc. etc. etc.

Third, the average price tends to be very high (to the average joe), and range VERY widely (from $30k to $55M, including implementation costs), so sticker shock is a huge problem. The salespeople try their hardest to ease you into the price by showing you all the bells and whistles before divulging dollar amounts.

Personally, I wish all of them would just spit out at least an average price (I find it incredibly frustrating to get information out of enterprise-class software salespersons) and get it over with. In fact, I have resorted to telling them that unless they give me an average price they are blacklisted.

For anyone who's wondering, though - enterprise-class software licenses average around $150k in my experience, with a 1 to 2x implementation cost on top of the software purchase price.
posted by babylon at 10:33 AM on December 24, 2002

Javascript links are awful. How can I navigate a site with Lynx if there are only javascript links?
My biggest complaint against javascript links is that it interrupts how I view webpages. I basically can't use a browser without tabs anymore and I navigate sites with tabs. Javascript stops me from doing this (currently) therefore I get very irritated when my browser experience is interrupted by some foolish webdesigner.

B2B, I totally agree here. If I'm looking for middleware solution or a service to integrate into my software or use for a company I'm working for I want prices. I want to go to the competitors site and get prices. I want to compare features and prices as well different licenses. How am I supposed to compile a report and recommend your product to my boss when I have no clue what it costs?
posted by abez at 10:33 AM on December 24, 2002

on the other side of the fence, imagine what it's like when people are asking for costs before they've produced detailed requirements describing what they want: "but i just want to..." followed later by "but why doesn't it....".
posted by andrew cooke at 12:15 PM on December 24, 2002

i'm with you chrisege. also apple.com/store/ works too.
posted by folktrash at 1:34 PM on December 24, 2002

While these lists seem to be not much more than attention-mongering, there's one thing he's completely right about and more people need to be attention-mongering about: email links in unexpected places. I hate it when I think maybe I'll be taken to a page and suddenly my email client opens. Aargh. Especially annoying for 1.) people with slow comps or 2.) people who generally use webmail and find Outlook popping up for no reason.

Ryland, you're allowed to be "bigoted against stupid people," but if you are, at least get it right. Since when are McDonald's registers picture-based? Every one I've seen is text. I also resent the implication that food service workers are dumb, because there are a lot of reasons to work at a job like that. None of them involve it being easy, because it's not.
posted by dagnyscott at 1:37 PM on December 24, 2002

Heaven forbid you should be able to spell what you're looking for!

Last year I found out my band was playing with a Czech band whose name I had only heard, never seen in print. It sounded like "Ooshmay Doma." My guess at how to spell that was "Usme Doma," but Google came to my rescue: Did I mean "Uz Jsme Doma?" Apparently I did.

BTW, they are a fantastic band.
posted by alex_reno at 3:15 PM on December 24, 2002

I also resent the implication that food service workers are dumb, because there are a lot of reasons to work at a job like that. None of them involve it being easy, because it's not.

I've worked in food service before, and I agree, it's not easy, it can be physically and emotionally exhausting, but it is not mentally taxing - in fact, the times I've done it, I found that it was easier once I learned to turn my brain off. If it took skill, it would pay more.

I agree with you about the e-mail link thing, though.
posted by RylandDotNet at 4:22 PM on December 24, 2002

if you set the font size via preferences in mozilla, i think it applies to all pages.

I hadn't seen that, only the "text zoom." But that's not what I want to do either. Rather than choose a size for all pages, I simply want to increase the size on all pages in a relative manner--which is what IE allows me to do.
posted by rushmc at 4:37 PM on December 24, 2002

In my experience, the only real way to combat this is to use the "pt" size indicator rather than the "px" size indicator in style sheets, and then preview your site on various platforms and browsers to ensure that it maintains its look and feel.

Follow the DiveIntoAccessiblity link above, and learn why pts are only appropriate for print style sheets, and why font size keywords are the best choice for the screen.
posted by anildash at 7:57 PM on December 26, 2002

Is Jakob still alive? It's hard to know - he is predictable enough and obvious enough to have been replaced long ago by a lean set of rules-based algorithms. Yet still, somehow, he makes large money...

RylandDotNet: Odd, but in my experience, food service workers seldom seem to be functioning at the upper limit of their potential, which seems to challenge a provable correlation between working at McDonalds and being stupid. IT workers, on the other hand, are often over-employed, and many of them are, measured by my criteria, astonishingly stupid. So, the phrase "as stupid as an IT professional" may describe the more provable stereotype.
posted by Opus Dark at 10:39 PM on December 26, 2002

Speaking of user-controlled font size, it's my biggest complaint against Mozilla so far. The stupid program makes you customize the font size separately for EVERY page you visit, unlike IE which lets you simply choose "larger" which is applied to all pages you visit. I can imagine a few situations where this ability to treat pages individually might be handy, but in far more cases it is a major pain.
posted by rushmc at 8:48 AM PST on December 24
I find this to be a feature. The only time I mess with font size is when some brain dead designer has added mouse type to a page. Therefor I hate it that IE changes all the other pages I may open when all I want to do is make the mouse type readable on that one page.
posted by Mitheral at 1:28 PM on January 2, 2003