Homepage Usability 315
Homepage Usability | |
author | Jakob Nielsen, Marie Tahir |
pages | 315 |
publisher | New Riders |
rating | 9 |
reviewer | Danny Yee |
ISBN | 0-7357-1102-X |
summary | high-profile homepages deconstructed in colorful detail. |
You might want to read Homepage Usability just for the entertainment of watching web usability guru Jakob Nielsen deconstruct the homepages of fifty major sites. Or you could read it for some invaluable advice on web design -- I learned a lot from it, as I think even seasoned web designers will.
Homepage Usability begins with 113 tips on homepage design, some of them obvious and some not so obvious, and most of them applicable more broadly than homepages. Here are two of the shorter ones:
Nielsen and Tahir then look at some statistics on the fifty sites considered. These statistics are used to make recommendations, following Jakob's Law of the Internet User Experience, that "most users spend more of their time on other sites." Here's a sample:Use graphics to show real content, not just to decorate your homepage. For example, use photos of identifiable people who have a connection to the content as opposed to models or generic stock photos. People are naturally drawn to photos, so gratuitous graphics can distract users from critical content.Don't use clever phrases and marketing lingo that make people work too hard to figure out what you're saying. For example, the "Dream, Plan, & Go" category on Travelcity might sound catchy to a marketing person, but it's not as straightforward as "Vacation Planning." Every time you make users ponder the meaning behind vague and cutesy phrases, your risk alienating or losing them altogether. Users quickly lose patience when they must click on a link just to figure out what it means. That isn't to say that homepage text should be bland, but it must be informative and should be unambiguous.
All this packs a remarkable amount of useful information into the first 50 pages, but the vast bulk of Homepage Usability, some 250 pages more, consists of analyses of the fifty chosen homepages. These follow a standard format. A full-page screen-shot faces a brief commentary, discussion of the page TITLE and tagline (if any), and a pictorial (overlay plus pie chart) breakdown of screen "real estate" into operating system and browser controls, welcome and site identity, navigation, content of interest, advertising and sponsorship, self promotion, and unused/filler. Then follow either two or four pages with detailed commentary: the screen-shots are repeated on the left-hand pages with elements numbered, and the right-hand pages have comments on them. Many of these are trivial and site-specificLink FormattingNext to the use of colored text, the underline is the second-most important cue to users that text is clickable, and 80% of the homepages underlined the links. We continue to recommend that links be underlined, except possibly in navigation bars that use a design that makes it more than commonly obvious where users can click.
Of the homepages in our sample, 60% used the traditional standard for link colors: blue. This is a fairly small majority, but still large enough that we continue to recommend blue as the color for unvisited links. If links are blue, users know what to do. End of story.
some of them amusingly so"ThisGo button's color isn't noticeable enough - there should be much more contrast with the background color."
Others are more general"In general, oil companies would best avoid photos that show large dark shadows in the water next to their rigs."
The sites covered are mostly those of corporates or media organisations - Ebay, ExxonMobil, ESPN, IBM, Victoria's Secret, and CNNfn, to name a few -- but some government departments are included and there's a good sprinkling of English-language sites outside the United States, such as those of the BBC and Australian supermarket chain Coles. The vast bulk of the analysis is, however, just as relevant for other kinds of organisations -- certainly for the university at which I work and the charity for which I do volunteer work, but also for my personal sites."Don't have a specialShop link when there is a product section. The natural thing for users is to find the product first and then decide to buy it."
Finally, a comment on the physical book. A large square volume, 25cm a side, with colour everywhere, Homepage Usability is really nicely laid out. I'm not generally a fan of books with a lot of graphics and screen-shots, but here they are used to good effect, demonstrating how some things can still be done much more effectively in print than online.
You can order this book from Fatbrain. Check out Danny's other Internet and publishing reviews. Want to see your review in this space? Check out our book review guidelines first :)
And what ... (Score:3, Funny)
Re:And what ... (Score:3, Interesting)
Actually -- I may not be Jacob...But it is easy to see (for me) that MOST ads (banners popup, etc) do nothing but rape the look and feel of a site. From a look and feel perspective -- there is a nothing like seeing a well designed site littered with flashing ads....All that work in color coordination goes down the drain....
** Note: text based hyperlink ads are AOK with me...and should be the choice for all sites that want to have a tasteful way to try to lead me to a site that I never intended on visiting in the first place...
Of Course... (Score:2)
Life can be hard sometimes.
Might I recommend webcriteria.com? (Score:3, Informative)
For a good service that provides what isn't, strictly speaking, usability data, try http://www.webcriteria.com. They do computerized testing of your web site that checks for "clutter" and fluff. It tells you how long an average user takes to read your page, how long it takes an average user to surf through your site to find a specific piece of information, or for commerce sites, it will even tell you how hard it is to place an order.
Yes, it's a blatant ad, and I don't even work there anymore, I just think it's a great service. (Plus, they have the coolest programmers on the planet, programming AI that does everything.)
Re:Might I recommend webcriteria.com? (Score:3)
Bobby and W3C standards (Score:2, Interesting)
Not necessarily. Both services have different objectives.
Bobby [http://www.cast.org/bobby/] is a web-based tool that analyzes web pages for their accessibility to people with disabilities. From their test homepage [http://bobby.cast.org/], a Bobby-approved website must:
* provide text equivalents for all non-text elements (i.e., images, animations, audio, video)
* provide summaries of graphs and charts
* ensure that all information conveyed with color is also available without color
* clearly identify changes in the natural language of a document's text and any text equivalents (e.g., captions) of non-text content
* organize content logically and clearly
* provide alternative content for features (e.g., applets or plug-ins) that may not be supported
The W3C validator [http://validator.w3.org/], on the other hand, ensures your webpages are syntactically correct and conform to their prescribed standards, such as XHTML 1.0 Strict. It does not place so much emphasis on accessibility, though it isn't ignored.
I would advise you to develop your webpages with the disadvantaged in mind. Make the web a better place for them and they will be grateful.
Cheers
CD
Usability of slashdot.. (Score:4, Insightful)
This not meant to be flamebait, but this site is over 4 years old, and the interface and usability has not gotten any better (it wasn't that good to begin with).
Re:Usability of slashdot.. (Score:4, Insightful)
There are a lot of people on slashdot who are very resistant to change and like it how it was "in the good ol' days".
So, as much as I would like slashdot to change, I feel the "look" of slashdot is as much a part of slashdot as the posts, the chronic mispellings and grammar problems, the errors made, the trolls, etc. It's not the best, but we have come to like it.
I like your idea though, and it would be cool to have an "optional" interface where you would get the same content, but you would choose your interface. Hell, people could even make their own slashdot "skins" that would plugin to slashcode and view slashdot however they want.
Here's to old school.
Re:Usability of slashdot.. (Score:2)
The Homepage Usability book has a guideline specifically about this very topic.
Quoting from the book, page 32:
Now they do have a section where they say that most sites "should" break about 5% of the guidelines due to special needs of that site, so perhaps this is of those 5% for slashdot?
A little humorous irony? (Score:2)
I noticed that when the changes first went up. Don't you think that's kind of ironic, when you think about the software development ideas many /. readers support and believe in, and the fact that one of their biggest benefits is rapid evolution of the product?
Re:Usability of slashdot.. (Score:2)
Maybe it's just because I'm used to it, but I think the interface is quite good. There's a lot of information (the links on the side, all the articles on the front page, the slashboxes), but it's presented in a managable way.
Also, things have changed over the years, but in small ways. Check the preferences section some time to see just how customizable things are nowadays - it didn't used to be that way.
What, specifically, is the problem? (Score:5, Insightful)
Okay...lets try to use some of Jacob's principles on Slashdot. Look at the homepage. First of all, you got the Slashdot logo and text in the upperleft-hand corner. Its obvious where you are. This is a news site so the news should be the most obvious part of the page. It is. In fact the news takes what looks like 75% of the width of the page, probably more.
Next, Slashdot makes great use of what Jakob calls scanning. Jakob has noted that visitors don't often read all the text on the page but that they rather they scan for the information they want. So the important information should be underlined, italicized, bolded, or put in a different color. This happens on the Slashdot homepage. The headings are the most obvious in that they are white with a green background which contrasts with the text which is black on white. Then at the bottom of the news entries you have "Read More" (which is an active verb, BTW). And its highlighted.
Another principle that Jakob explains is that visiters like to have an idea of where they are going before they get there. At this, Slashdot seems to excel at. For instance, before the main body of the homepage loads, you already get an idea of what topics today's news covers by the icons in the upper right hand corner. Today I get an icon for The Internet, Linux, Microsoft, News, and Privacy. While it would be a little better for these icons to have titles the tooltips serve well for if you don't know what the icon is for. Also, these icons correspond directly to the icons next to the news items. In addition, each link in the news stories have relevant text underlined so you have an idea on where that link will take you.
Slashdot is also fast and for me takes under a second to load. It has little use of graphics and these graphics are cached to improve load time for other visits.
People who feel comfortable coming to this website have good reason, from Jakob's principles. To an online friend of mine I showed a post I made. Next thing I know, he replied to it. He told me he never used this website before.
So if there's a usability problem with this website, I would be interested in knowing what it is. Because I'm not finding anything.
(before posting this I notice a bold heading below the comment window that says "Important Stuff:" that says what comments should be like. These kinds of things make slashdot such a usable site)
Re:What, specifically, is the problem? (Score:2)
What browser? (Score:2)
What browser are you using? I just ask because I'm stuck with Netscape 4.7 on my Sun at work, and it loads lots of pages very slowly because its HTML rendering engine is super slow (and sucks especially with tables). But I know that if I move to a Windows machine elsewhere in our T1-connected lab, it won't have a problem at all.
-Grant/JimTheta
Check out your homepage preferences (Score:2)
The default is 30. The main column displays 1/3rd of these at minimum, and all of today's stories at maximum.
Try making yours lower and see if it improves.
Not using Nested will speed you up as well.
Turn off your Slashboxes (Score:2)
I count seven distinct fields on the top of the /. homepage and several more as you scroll down. I have been using /. for several years and have never used any of sidebars except "Freshmeat."
Actually, your beef with the right side of the is not that there are so many Slashboxes but that there's no way close by to turn them on or off. You have to go into your preferences [slashdot.org] to do that. In fact, you can even disable Slashboxes entirely.
Re:Usability of slashdot.. (Score:4, Insightful)
Hmm.. the only usability peeves I can think of, off the top of my head are:
This is one of the most-usable discussion sites I've seen on the whole 'Net. I give Slashdot a thumbs-up when it comes to UI.
Slashdot specifics (Score:5, Informative)
navigation links and story submissions (Score:2)
I think a link above Topic and Section on the story submission page would make it more understandable for first time submitters.
Sections (from what I understand, correct me if I'm wrong) is more about which Editor will look at your submission, as they have different sections as their responsibility, just like a newspaper. (as for those colours, I have no freakin idea, except that I do think Ask Slashdot should look a little different, as it's questions, not direct information)
Topics are really related to the subject matter, which I think can be a little intimidating for first time submitters, as there are a lot of variables on some submissions.
I recently submitted a story [slashdot.org] that was accepted, that would have fit under a couple of Topic headings.
It was News, but a lot of stuff is News. It was more important to people following Linux news, so that's what I submitted it under. But is also could have gone under Science or Technology.
I think it would be useful to have a little blurb to help submitters choose the most accurate Topic for Slashdot purposes.
With the navigation links, I'd like to see those become customised. For a new user, most of those links are useful. But for regulars, some of it is not so useful.
If I could tick boxes on what I want, I'd retain:
preferences
submit story
And below that I'd dump the section box altogether.
And I'd like a search box up high, above all links on the left, or just under them (I'd only have two if I could choose).
But for a new person, visiting the site for the first time (especially if they have never heard of it), different stuff is needed.
As for all the delightful goodness in Slashdot, I think most people have mentioned it all, aside from what I really love, which is news I can't always get ahold of easily and quickly. Slashdot gave me really great (fast, accurate, important) information on the American Attacks, I never had any trouble loading it during that time, when I was almost unable to use a lot of overseas sites like CNN (I know they said it didn't go down, but when it times out because it's so slow, it's the same thing to the viewer).
Re:Usability of slashdot.. (Score:2, Informative)
Obviously, Slashdot has great usability for its targeted user base of nerds. The proof is in the pudding, in that they use it so much and keep coming back. There is nothing here but pure user interface: nothing you buy or get, so if people use it, it must be because it is good. This said, many elements of the interface would present too much complexity for more average users. For example, the many different ways of viewing and sorting threaded discussions is quite difficult to understand. How do you really know what you will see if you click on one of the links from the home page? There are three elements of Slashdot that I particularly like:
* Simplicity in the layout itself: focus on content rather than flash.
* The liberal use of linking - in fact, the site lives off the ability to link to the rest of the Web. Too many other sites forget that hypertext is the foundation of the Web and provide nothing but a closed world.
* The reputation manager effect coming from the moderation system.
Slashdot editors are immune... (Score:2)
...because Jakob's Law of the Internet User Experience doesn't apply to Slashdot. After all, most /. users spend 98% of their time on this site...
Re:Usability of slashdot.. (Score:2)
Yah. Don't you get sick and tired of the bozo web designer that assumes you use your browser in full-screen mode? The idiot webpage designer that divides up the screen using the resolution of his monitor and forces everyone else that's not running at 1800x1200 resolution to side scroll?
There's a fairly easy fix for this if they'd only read the rest of the HTML language manual or stop using crappy design software: percentages. OK, this might limit them in some small way in that they might have a bit more trouble getting those navigation menues on both sides of the browser window (along with the one they stuck on the top of the window :-)) but, you know, that's just tough. The designers of the web pages are the least important viewers of those pages.
Re:Usability of slashdot.. (Score:2)
Re:Usability of slashdot.. (Score:2)
Take Jakob with a grain of salt (Score:2, Flamebait)
Re:Take Jakob with a grain of salt (Score:4, Insightful)
Example you say?
Google.
Re:Take Jakob with a grain of salt (Score:5, Interesting)
And just what do you think the web is? Some kind of place where people pay good money to see your blinking flashy popup crap? No. People use the web to find information. Anything else is secondary. If people can easily find what they want, they will buy it, and that's where the money comes from. They won't buy it because your ad blinks more than the next guy's.
I'm sorry non-information-delivery doesn't pay bills for you, but really, good riddance.
Kudos to Jakob for emphasizing function over form. The web is a functional medium. Now if you're running an on-line art-gallery...that's a different story.
--Bob
Re:Take Jakob with a grain of salt (Score:2)
Thats not true at all. There are plenty of useful sites that do something vastly different than delivery of text.
Movie promo sites?.Online shopping. Game sites.
Re:Take Jakob with a grain of salt (Score:2)
In any case you couldn't have a useful shopping or gaming site without them. Part of the purpose of a site is to also convey the brand or meaning, and frankly you are very hobbled in doing this using Jokob's rules. Maybe you have read Jokob or not, but I think its clear that it is impossible to use your site to effectively promote a brand using his web-of-1996, please-support-netscape-2.0-users model.
branding usually doesn't have much meaning (Score:2)
And if you spell like that, I'd say your brand comes across as illiterate and unobservant. It's Jakob, not Jokob, as any previous post could tell you. Your grammar could also do with some polishing.
Branding isn't usually information, except to marketroids.
A useful shopping or gaming site would:
Something which branding doesn't cover, if you just don't have what it takes.
Most sites don't have what's mentioned above.
Work on that and then start your branding.
Re:Take Jakob with a grain of salt (Score:2)
it's a well known brand, that's why (Score:2)
I would guess a lot of hits Nike gets are from being in the news for their slave labour practices.
A hit count won't tell you whether your site is good or bad, only how many people have visited it.
If lots of people go to a filthy public toilet that could give you any disease of your choice, it doesn't mean it's a great public toilet, it just means they needed to go.
Your site can have graphics, but if it's heavy, people will leave before they fall asleep, waiting for it to load.
I can't really think of any time to use this design. If I have to wait around for a site to load, I'm off doing something else, and I won't be back.
the slave labour is relevant (Score:2)
when a story is on slashdot, there's a lot of links to the items being discussed.
that's a lot of opportunities for someone to visit Nike when they are in the news so much.
you said:
Do you really think that they would get as many visitors to there site if it wasn't a flashy site? No way. and that's just not accurate
a lot of hits are first time visitors, they've never seen it before, so they don't know it's flashy.
branding is why Nike gets hits, it has nothing to do with their site.
but it could be aided by their frequent news items
Re:Take Jakob with a grain of salt (Score:2)
He notoriously overcompensates on a strictness in useability which typically mandates sucking all of the fun out of your web pages. Jakob seems to be stuck on information delivery in its distilled form, which simply isn't paying the bills for many sites out there.
Notice where Jakob focuses his work: business sites. Sites that sell products and services. Keeping the site usable so that customers can purchase stuff from you is a great idea. When I'm looking to buy a Palm Vx, or a new computer, or toy, I don't want "fun", I want to get information on the product and purchase it as easily as possible. This is at the core of his work.
Jakob's suggestions don't make alot of sense of entertainment sites. Perhaps he should make that more explicit. But for businesses trying to pay the bills by selling products and services, his suggestions are right on target.
I Love Usability! (Score:5, Interesting)
I've always been a fan of usability. I kept a copy of Psychology of Everyday Things on my bedside table. However, I've noticed some unpleasant patterns over the past couple of decades:
Alas, all the evidence is that, even if usability is on the list of criteria for purchasing (which it seldom is at all), it is way low on the list. It may even be a de facto negative.
Vincent Flanders asserts that web pages are different: that if people don't like it, they're gone. Well, maybe, but is there any evidence that usable commercial web pages sell better than less usable ones? Has anyone done a study? I thought the value of usability in commercial products was self-evident, too, until the evidence built up that I was flat-out wrong.
Re:I Love Usability! (Score:3, Interesting)
This is one of my pet peeves. Almost 100% of the time, push/pull confusion is caused because the door violates the unwritten rule of door and handle design that we've all incorporated subconsciously based on our experiences with doors: Doors with horizontal handles should be pushed, while doors with vertical handles should be pulled.
Chances are, next time you're fooled by a door, it will be violating this simple rule that you may not have even been consious of. It's unconscionable for those conscious of design to be unconscious of it, though...
Re:Take Jakob with a grain of salt (Score:2)
though the suggestions might be usefull... (Score:3, Interesting)
I will say the suggestions mentioned here however are not bad.
Re:though the suggestions might be usefull... (Score:2)
Frames have their place, yes, but they ended up being used in a million places that they sholdn't have been.
Re:though the suggestions might be usefull... (Score:3, Insightful)
Just for the record, there are lots of good reasons not to use frames often, though I myself don't tell people to "never" use them.
Basically, frames often create an absolute navigation nightmare. Which is ironic, because simple navigation was the reason they were created. Let me give you an example from an old IBM site I helped to code once (I'd point you there, but let's just say it was so long ago the product line's been renamed). Basically, they wanted to use a navigation frame on the left determined by the "type" of the visitor, eg, management, IT, or engineer.
The right-hand "content" frame would then get various case studies, whitepapers, whatever, which could be shown to any user "type", but the prominence in the navigation frame would be different. Anyway, it was a nightmare because when someone would call and say "I saw this on your X webpage," the sales rep would never know exactly what that page looked like to them because he didn't know which frame was on the left. Let alone trying to give someone a "deep" link within the site: there'd be no navigation frame!
I think eventually they switched to a dynamically generated table-based page, but that was after I left. That pretty much turned me off of frames as a general navigation tool, although I will acknowledge that they're quite useful in situations where the navigation frame never changes, such as in browsing a PDF file or book online, when you really, really only want to use the frame to navigate around in a specific area of content.
If the navigation from changes from section to section, though, and the same content is plugged in to multiple sections, just forget it. Use tables and have an App Server that dynamically generates the pages for you.
Re:though the suggestions might be usefull... (Score:3, Interesting)
most of the time people who determine what is and what is not good for web design dont have a clue, or are obsessed with old standards and old browsers. (ie you shouldnt use frames)
I don't think you've been paying attention . Frames have terrible usability. [useit.com] The article may be 5 years old, but most of the problems remain. This has nothing to do with old standards or old browsers, but fundamental problems with be behavior of frames. Bookmarks to framed pages don't work as users expect. Links from search engines into frames sites don't work as expected. Framed sites don't print as expected. Entering an URL from an email or newspaper article to a site using frames doesn't work as expected. When browsing web pages over limited browsers link handheld computers or cell phones, frames make the experience extremely painful.
That said, frames have their uses. Even Jakob admits as much. But too many people aren't considering the potential problems before using them.
Re:though the suggestions might be usefull... (Score:3, Insightful)
His "Authoring Problems" issue strikes me, frankly, as baloney. Frames aren't significantly harder to use than tables, and yet I rarely hear people advocating the elimination of tables, unless it's for other reasons [alistapart.com]. Besides which, the state of the WYSIWYG authoring tools is such that at least they can produce frames reliably now.
In other respects, much of what he wrote five years ago still applies now, and personally, I hate writing frames. Just be aware of how the technology has changed.
Re:though the suggestions might be usefull... (Score:2)
Does anyone know how MS Outlook handles them in email? (I don't permit Microsoft products on my systems... :-) )
Re:though the suggestions might be usefull... (Score:2)
By "old" standard, I don't mean the ones the cavemen wrought, but merely something older than last week. If my browser doesn't support the established standards, then that is MY problem, and not yours.
Let's say I take my form incompatible browser to your site. I could either end up with a lot of garbage, in which case I can only conclude that my browser sucks. Or you can throw up a page saying my browser sucks, in which cas I can only conclude that you're an asshole.
As far as browsers go, having used IE 5.0 around the time of the nimda worm... I have suggested in my project that we FLATLY regect anyone who doesn't have THE most up to date web browser, AS A PUBLIC SERVICE!
I certainly empathize with this viewpoint. However, when it comes to the web, I am not a developer, I am a user. When I come to a website that says "go away we don't want you", I can only assume that the webmaster is a) rude, b) way too rich to want business, or c) all of the above. The better solution is to simply say "IE 5.0 has a problem, please upgrade to the fix".
Imagine you drive into a service station to get some gas. You know your car uses gas because you put some in last week. However this fuel pump has a square nozzle and your gas tank has a round hole. When you try to jam the square nozzle in up flashes a sign that says "you drive a Dodge so go away!"
Whaa whaa.... I can't see any of the cool internet sites with my C64 anymore!
What pisses me off, and what you apparently can't understand, is that my browser is compliant with this weeks standards, but that you choose not to support it because it wasn't made by Microsoft or Netscape.
This book really is good (Score:2, Interesting)
Fatbrain... (Score:4, Informative)
Good for dev ppl to read (Score:2, Insightful)
I think this book, or something similar, should be standard issue when you reg a domain name. Whether or not you follow the advice given, it is good for ppl to know when they are straying off the path of what an average webuser (note: not a slashdotter) would grasp. They may still choose to do this, but at least they will then know that they could be alienating general users.
One example is that Slashdot does not follow much of these guidelines. Thats okay, cause they know their target audience is tech, but most sites aren't.
I really think a lot of sites put too much time into making something neat, and not enough into making it easy to use. This book could really help. I plan on buying it.
Same as it ever was... (Score:2, Flamebait)
Over the years, I've slowly developed an active dislike for the man. Should we really keep from using current technology in order to be backwards compatible with the 2.3% of all users who are incapable of upgrading their browser? How can innovation occur if we confine ourselves to Nielson's 256 color, 1995 view of the web? Can you really trust someone who includes the string "discount usability engineering" in the meta keywords on his site to give you good advice on web design?
Certainly there are applications for which the most minimal distillation of information is preferable (yes, I use lynx from time to time as well - put your flame thrower down), but come on - let's move forward.
Discount usability [was Re:Same as it ever was...] (Score:2, Informative)
"Discount usability" is a term Jakob uses for a specific method of usability testing.
I'm not a big fan, but I wouldn't discount his whole approach just because he puts that term in his site keywords.
Re:Same as it ever was... (Score:5, Insightful)
Unless you are just designing a site to be cool and impress your friends. Then do what ever you want.
Sure there may only be the lowest 2.3% of people that will be left out if you use newer stuff, but if you are designing a commerical site, do you really want to piss away more then 1 out of 50 visitors? And for the color thing, being very color blind, I get irritated when someone gets cute and uses unusual colors so I can't read the text on the screen, so there isn't any problem with the basic 256 for me.
Besides, look at the sites here people use. Google, Yahoo, Slashdot... all of them use innovation, but it is all on the backend. The pages themselves are still pretty simple HTML.
Re:Same as it ever was... (Score:4, Insightful)
Do we really another book from him telling us not build sites using any post-1996 technology? ... Should we
really keep from using current
technology in order to be backwards
compatible with the 2.3% of all users
who are incapable of upgrading their
browser? How can innovation occur if we
confine ourselves to Nielson's 256
color, 1995 view of the web?
Jakob is primarily addressing web sites that sell products. Not entertainment sites. Not personal sites. Sites whose goal is to maximize sales. This is not about Art or Beauty. It's about business. Maximizing the number of users who can access your site will increase the number of users who can buy products from you.
Furthermore, Jakob isn't suggesting that you should stick with the state of the web in 1996. He suggests that you lag the current state of the web by several years. He suggests you create sites that degrade gracefully. He suggests you focus on content and usuability. All of his suggestions stem from the goal of creating sites that satisfy your customer's needs and desires. He research shows that focusing in these areas increases completed sales. Sounds like good business practice to me.
Can you really trust someone who includes the string "discount usability engineering" in the meta keywords on his site to give you good advice on web design?
Most certainly. Part of his work is trying to convince people that you can do effective usability engineering without spending a great deal of money. Too many people skip usability testing because it's perceived as being expensive to do. More sites need to do usability engineering, and some simple, "discount" usability engineering is significantly better than no usability engineering.
Re:Same as it ever was... (Score:4, Insightful)
Even after five years of widespread web use, there are still many who just don't get it, who think that the way to pull users to a site is to hide the useful information and clog it with graphics and effects that were passe in 1997. (Possibly these sites are a little reduced in number after the dotcom crash, but not gone altogether. And there's always the worry that existing sites will forget their purpose and go downhill (eg Altavista).)
So I say that Nielsen should keep on plugging away with the same message. You may have heard it all before but not everyone has.
Re:Same as it ever was... (Score:2)
It pretty much boils down to Nielsen saying Flash is bad because it encourages bad design, and Meloni counters that this is the fault of bad designers.
I have to go with Neilsen on this one. He points out that part of the reason most Flash is bad is that producing usable Flash is expensive. Meloni mentions all sorts of workarounds, like simulating links that change color once you've clicked on them. This only proves Neilsen's point: producing usable Flash is possible, but it's a lot more expensive that producing usable HTML. This point seems to have gone right over Meloni's head.
There are cases where Flash does make sense, but 99% of the cases where it's used are bad. The best way to correct that is to make web designers realize that they should only use Flash if they really have a good reason, and they're willing to expend all of those extra resources to make it usable.
Critical? (Score:2)
Phsaw. Like most homepages have "critical content."
Re:Critical? (Score:2)
So... what is basically being said here is that the average internet user isn't smart enough not to be distracted be images? Does he think that these people also pass a mirror in the hall and lose an hour just because they see an image reflected in there?
That's certainly a great way to view your end user... as a bunch of drooling morons easily distracted by shiny objects.
(and, no this is not really a response to rkent's post, just easier to do a reply to is to keep my post with the one that inspired it)
My recommendations (Score:4, Insightful)
Also, make it so you, the user can resize the font. NOt sure how it works, but I've seen my share of pages where moving the font size up and down doesn't work at all. People with poor eyesight will be thankful.
Also, do not have links open up in a new browser window unless absolutely necessary. If I want to click on a link to open in a new window, I'll do shift-click. You don't have to do it for me. I guess people assume they want their website to be on everyone's browser at all times, so links away from the website open up yet ANOTHER window(or in any case of a site on cjb.net, you'll get about 20 pop up windows in addition).
And don't try to jam links to everything on the index.html page. Spread it out a bit, in a logical manner. Every gaming site(which all look the same) love to do this.
Don't have excessive amounts of porn banners just to make a few bucks you won't see in referrals. You'll lose out on the audience of people who surf at work.
Re:My recommendations (Score:2, Informative)
Someone else mentioned it but said they weren't sure, so I'll explain it more exactly:
Sites that specify font sizes as something concrete (ie, points or pixels) cause most browsers (read: Internet Explorer) to fail to resize the text. My webpage [wpi.edu] lays everything out via CSS (as in, no tables, but a menu on the left and content on the right). (No comments on usability please, I use it for myself and I can use the thing - actually, I think the base layout works fairly well, but my color scheme probably will piss off people who aren't me :). Also, a word of warning: if your browser does not support CSS and HTML4.0, the page will look funky. It'll render quasi-alright in Lynx (the menu currently comes first - maybe I should fix that) and it'll layout (almost) properly in Netscape 4, but the fonts will be all screwed up. Ignoring an off-by-one bug in Moz, it renders fine in both Mozilla and IE.) I use points to specify the layout since I would hope that specifying it in points would allow a browser to scale the font and don't want to play the "match layout with percent font size" game that I'd have to play otherwise.
Specifying font sizes as percents allow IE to properly scale the font. Specifying the size as points or pixels causes IE to keep the text size static when "zoomed." (Mozilla scales the font reguardless of point/percent, but I haven't tried pixel - my guess is that it would scale it as well.)
Personally, my view is that when text is "zoomed" the point to pixel conversion should be scaled up - IE doesn't scale the points and Mozilla only scales the font sizes. (Again, if you look at my webpage, I think that when I scale the font size up, the layout should scale along with the new font size since the font size and the layout are both specified in points. It doesn't scale at all in IE and Mozilla just makes the glyphs larger/smaller.)
Arguably, the fact that IE doesn't scale the font sizes larger is a bug in IE and not an issue with the web developers. But YMMV, I suppose it would make sense to redo the webpage to work around bugs in the most popular browser, especially one that makes pages illegible in it.
Opera magnifies pages easily (Score:2)
On your concern of page fonts being small, have you ever used the Opera [opera.com] web browser?
There's a little pull-down menu in the toolbar that lets you resize pages. It's similar to the zoom pull-down that you'll find in Word or any modern word processor. It's really convenient. Opera also carries many other little features that can make reading poorly-designed pages more pleasant, like buttons to toggle images or page formatting on/off.
Granted, this doesn't fix the problem of dumb webmasters, but it does help in reading poor pages.
I like when I can plug my favorite underused web browser.
-Grant/JimTheta
Never EVER override the browser colors! (Score:2)
If I go to a website that tries to override my browser's colors, I leave. Fuck them and whatever product they were trying to sell me.
Why? Because people who have any variation of color blindness will set their browser to use colors which they, the users, can distinguish. Most web sites never even consider this fact, and suddenly the users are faced with links, text, images, etc, which all look the same. (Consider a user with red-green color blindness going to a website that tries to "get in the Christmas spirit" by making the links red and green.)
Those websites need to die. I will not support them, visit them, nor refer them to others. I encourage everyone reading to do the same. The inconsiderate I-will-decide-what-you-display designers of those websites also need to die. I will torture them on sight with big flashing migraine-inducing strobe lights, and I encourage everyone reading to do the same.
The whole freaking point of HTML was to allow the end user to specify layout and appearance. The website designer specifies content, nothing else.
Re:Never EVER override the browser colors! (Score:2)
You know that, and I know that (ever since it was introduced in Netscape), but the average user doesn't know that.
Font size (Score:2)
Here's how it works ... a web designer who thinks everyone who will visit their site is as artsy and as ably bodied as themselves suddenly gets into his trendy head that a teeny tiny font will be good so he can fit more whizz-bang widgets on a page.
Not being familiar with the use of "font-size: xx-small;" and similiar CSS attributes, they instead specify an absolute font size (eg, 6pt).
Then a visitor comes along whose browser doesn't allow font resizing. Internet Explorer foolishly will not scale absolute font sizes and will only scale relative font sizes. This shortcoming is what you are noticing. On the other hand Opera's zoom and Mozilla's font size increase (Ctrl + +) ride roughshod over what the designer wanted and display what the user wants.
That's the way the web works: The user sees what he wants to see, and how he wants to see it ... which is why absolute font sizes are a sign of a small-minded designer (and a broken user agent that can't scale them).
Now regarding his target demographic ... it becomes a self-fulfilling prophecy, and he (and a few of his friends) end up being the only people visiting the site.
Re:My recommendations (Score:2)
Re:My recommendations (Score:2)
Sometimes when I'm on picture pages, I like to keep the thumbnails on one window, and the actual full-size images on another window. If you specify a targe(instead of _blank), you can click on several thumbnails and can alt_tab to the other window to see the image.
Of course, if you use Javascript(like mentioned above), forget abouddit.
Who has actually read the book? (Score:2, Insightful)
Have any of you actually read the book?
Come one, people.
Not really focused for techies (Score:5, Informative)
As for this book...it's pretty, but it's not aimed for developers and professionals. It is, as many have pointed out, very common-sense. This however makes it perfect for Marketing people who make a big deal out of lots of pretty pictures and gratuitous animation. Internet common sense is often lacking in those who grew up designing for paper and print. For better guides for techies, try Neilen's other books: Designing Web Usability and Usability Engineering (a very technical guide to designing interfaces). Both of those show that while he's an extremist, he knows what he's talking about. Additonally, the book Don't Make Me Think! is an excellent reference for designing usable web sites and applications (and it's a damn amusing read).
On the other end of the spectrum is the book Fresh Styles for Web Designers which is basically some guy collecting a bunch of pretty websites and telling you that they're cool and don't sacrifice usability (he's lying - 90% of them are almost totally unnavigable). Pretty pictures, though.
Reality is somewhere in the middle.
It's a tough field right now. On one hand you've got Joe Corporate-User who believes that if he's got MS Word's "Save as HTML" feature, he's as good a web developer as you are. You've got software engineers who would, given the chance, make every web interface beveled and battleship grey. You've got web designers who are still stuck in the 1996 mode of "if the website looks cool that will be enough to bring in users." The real challenge in web development is juggling these people and producing something that satisfies users and manages not to be mind-bogglingly dull.
Re:Not really focused for techies (Score:2, Funny)
Unfortunately -- despite all the pretty pictures in this particular book -- marketing people don't read.
I have the best beta testers out there (Score:2)
the most common sense thing to do is run it by people who will give constructive critisism
Visionary or Luddite? (Score:2, Informative)
One of Nielsen's famous complaints is that every web site should be compatible with the "Back" button - this is absurd, not even Slashdot is compatible with the Back button. Try posting a comment, hitting Preview, and then hitting back - Slashdot erases the contents of your comment window.
Admittedly, some of his ideas are very good. We DO need a way to deliver rich web content to dialup users, and right now a 100K web page is the wrong way to do that. Some of his other ideas - banning Flash for example - make less sense.
And why the obsession with this "any browser" business. Let's face the facts: some versions of Netscape 4 don't render Style Sheets at ALL. Their miserable failure of an attempt to implement CSS was noble but it just didn't work out. If I publish a browser with the ability to read nothing but the letter "Q", do you need to rewrite slashdot to be compatible with me? Of course, this is an absurd argument, but it cuts directly to the point: it's OK for web sites to prefer browsers that are more standards compliant. Slashdot, for instance, gets over 85% of its' hits from Internet Explorer - for good reason.
Anyway, Nielsen is certainly a vast improvement over "HTML for Dummies" and let's hope he gets past his own reactionism and continues to provide a valuable resource to the Web Design community.
Re:Visionary or Luddite? (Score:2)
Flash is enticing. Web designers say "Oooh...I can put pretty animations on a site." Managers say "Doesn't it make our site look professional?" But the reality of it is:
* It requires you to have a Flash plug-in.
* It makes download times longer, often much longer for modem users.
* In exchange for these drawbacks you're not gaining anything.
Even so, the enticement is difficult to get over. At least if Nielsen rants about it he'll eventually get articles questioning Flash into the magazines that web designers read, and then maybe they'll listen.
Re:Visionary or Luddite? (Score:2)
In 99% of cases this is not true. In all but a few cases, Flash is simply used to add pointless animation.
Re:Visionary or Luddite? (Score:2)
I remember reading Flash: 99% Bad [digitalout.com] and being totally confused. If Flash is so "bad", why does everyone use it?
He didn't say "Flash: 99% Unpopular." Popular and good design have nothing to do with each other. The article gives a healthy list of specific problems with using Flash. He specified the usability issues with each problem. His work focuses on maximizing the number of users who can successfully purchase a product or service from a web site. He gives clear examples of why Flash hurts this goal. He does usability tests to see how effectively users can accomplish tasks and found these problems. He's not being a visionary or a luddite, he's being a researcher.
Re:Visionary or Luddite? (Score:2)
And Jakob is right from a useability standpoint, web pages are built within the GUI of the browser, they should be built to be compatible with the additional navigation offered by the browser. They shouldn't rely on it and they shouldn't ignore it.
Re:Visionary or Luddite? (Score:2)
This is a function of your browser as much as it is Slashdot.
=====
Not really, the browser reacts to the caching headers that were sent to it. If the headers indicate no-caching, IE will reload the page from the server and clear all form data.
maru
Is iSee a business? (Score:2)
Slashdot is not the pinnacle of anything, especially not commercial site design. Arguing that "/. isn't 'back-button-compatible'" means nothing.
well, two things... (Score:2, Interesting)
2. make it an ebook - what is it with all these people - negroponte leading the charge - extolling electronic/cyber/wired life and grinding trees to pass out their gospels? dymitri or no dymitri, people pay for ebooks.
Re:well, two things... (Score:2)
Someone else said the book was #12 on the Amazon sales-rankins... that means they've sold tens of thousands of copies, so 20 of them wanting to resell them is hardly a lot!
make it an ebook - what is it with all these people - negroponte leading the charge - extolling electronic/cyber/wired life and grinding trees to pass out their gospels? dymitri or no dymitri, people pay for ebooks.
Wouldn't really work as an ebook - I tried to say that at the end of my review, but it's much easier to understand when you've seen the design of the physical book. It relies on being able to present an eigth of a square metre at the user in one hit, and hardly anyone has windows that big, with sufficiently good resolution, to achieve the same effect.
Danny.
typical jakob (Score:2, Informative)
Usability experts and designers like Donald Norman, Alan Cooper, and Bruce Tognazzini seem to me to be a lot more realistic in their mixing of user goals and business goals. If the business goals don't get met there is no company to meet the users goals. I wish Jakob would stop issuing these outdated proclamations ("If links are blue, users know what to do. End of story.") and start taking a more realistic view of what it takes to get a site to achieve both the users and the businesses goals.
Re:typical jakob (Score:2, Interesting)
Two of the three guys you mentioned are partners with Nielsen. Go to Nielsen Norman Group [nngroup.com] to see more. They seem to believe that their ideas are compatible.
K.
Revise "your own" home page (Score:2)
"Your company's home page" might make sense as a target for this, but 99% of the people reading this (including me, I admit) don't have anything to say on their OWN home page that's that crucial.
Usability? (Score:2)
Homeland useability? (Score:2)
(/me imagines John Ashcroft pronouncing <blink> to be a terrorist act)
Could we see the list of website sins? (Score:4, Insightful)
It'd sure be nice to see a summary of the list of flaws from the beginning of the book? I wanted to see if my pet peeves were in there:
Load Time
I hope Nielsen made prominent comments about load time. If I were the guy approving the design of the company's external web site, I'd do the final review offsite where one would have to use a dial-up connection to view the site. That would go a lo-o-o-ng way to reduce the amount of gratuitous graphics that most corporate web sites shove onto their homepages.
Not Testing with Popular Browsers
Not testing with all the popular browsers should be a misdemeanor, at least. (IE dominance aside, would it kill 'em to at least try out the top three or four?) True story: Compaq's home page used to have a link to text-only version of the same page. Unfortunately, all the links on the ``text-only'' page pointed to pages that were lousy with graphics and tons of Java/Javascript that crashed the browser that they shipped with their UNIX workstations. So much for text-only. The day after I called their office to point out that I was unable to view their web site using the software they shipped with their OS, the text-only link disappeared from their home page. I can only imagine the conversation between the manager and web page maintainer:
Boss: ``Hey! People that follow the text-only link from the home page have their browsers crash. Fix it.''
Maintainer: ``Sure, boss. Just take a few seconds.... Done!''
And Compaq people who I have to deal with wonder why I laugh when they suggest ``you know, this information is available on the web site''. The thing that pissed me off the most about this incident was that the pages wouldn't load using a browser that they were shipping on the OS CDs. Web pages on the CDs had links to pages on the corporate site that would crash your browser. Pathetic.
Teeny, Tiny Fonts
Then there are the web sites whose designers have 20/5 vision (or better) and force you to view the site with the smallest possible font that your browser is capable of displaying. Guess visitors will actually be able decide for themselves what font size is best for the viewer sometime before the heat death of the universe. If we want the ability to choose in our lifetimes, though, I'm betting that it'll only happen after someone shoots all these arrogant designers (``Listen! I'm an artiste! What school of design did you attend?'') and pry their pet style sheets from their cold, dead fingers. (BTW, the line forms behind me.)
Why do I mention these? Because it appears that 99% of the companies with these broken web pages couldn't care less whether users have an easy time accessing their sites. If they actually gave a damn, they'd stop creating web sites that didn't appear to purposely antagonize their visitors.
Gotta wonder: Who was it that posted the web page ``Why Web Sucks''? Hopefully it's still around. IMHO, it's still relevant.
Re:Font problems (Score:2, Insightful)
Why didn't you just hit CTRL-N to open the offending page in a new normal window with scrollbars etc.? Seems a lot easier...
Web "development" (Score:5, Insightful)
Software engineering in a nutshell:
1) Analysis. What are your project requirements? Who is your market? What are their needs? If it's not addressed here it shouldn't be in the final website. If your site is going to adhere to web standards, req them here. If it's going to support specific browsers instead, req it here and say why.
2) Design. Before you write one byte of HTML or PHP you need to get the design down on paper. Document all pages, modules, classes, databases, interfaces, etc., before you move on to the next step.
3) Coding. This is more than just knowing your language. Code review. Unit testing. Etc.
4) Verification and Validation. No go an test your website. Does it meet all requirements? Does it work for the Konqueror, Mozilla and Opera? Does it work on a monochrome monitor, or for Lynx? If not you had better have that in the requirements. Without looking at any of the design or code, a tester should be able to formally validate the website.
5) Maintenance. You may actually get bug reports! Fix them when you do and don't just tell the reporter to get a bigger monitor, switch to a different OS, or to use a different browser.
6) Repeat. Websites are dynamic beasties. Much more so than applications. Go all the way back to step one.
Re:Web "development" (Score:2)
That's how the original Netscape programmers got to be millionaires.
Or to take another example, how about the history of unix development?
And without rigorous software development methodology, we wouldn't even have slashdot to discuss this subject.
Re:Web "development" (Score:2)
This is a *book*? (Score:2, Funny)
You mean an actual *book* with pages and all?
How retro...
How oxymoronic...
t_t_b
I bought the book... (Score:2)
The Homepage Usability book has many guidelines that would make the web a much better place. About half of them are "Don't" guidelines, like:
A portion of the book is about what they call the site's "Tag Line". They claim that all homepages should have the company/organization name or logo near the top of the page, with a breif description of exactly the company/site actually does. They say that people who've never been to the site need to be able to quickly look at the top and see what company/organization this is, and what they can expect to get from the site. I hadn't really thought about this much, but it seems to make a lot of sense, particularly for a smaller site like mine where nobody would be familiar with the name. Robin and I talked about it for about an hour over Thansgiving and we came up with "PJRC: Electronic Projects, Resources and Open-Source Code, With Components Available For Worldwide Delivery". I've shown the site to some people over the years, and usually they initially ask some questions about what it is. I showed it to someone just the other day, and this tag line at the top made the site's purpose immediately obvious.
Another really insightful part of the book is about what to put into the title. They say you must begin with the most important word, and never something like "Welcome" or "The".
They claim that all sites should have search on the homepage, and they give some suggestions about how to make it appear. They don't go into detail much about the search, probably because Neilson's company sells a report about search usability.
They have some other really insightful suggestions... here is a short list of some:
I train people in this stuff... (Score:4, Insightful)
It may seem like common sense, but good page design is hard to implement. In our classes, we make sure that we always have representatives from at least two firms registered for any class. The students then do a usability analysis on pages that they did not create.
When the first student makes "dumb mistakes" on a page, the designer is sure that it's a fluke. When the third person makes the same "mistakes", it's funny to see the designer's jaw drop. Usability is not about being pretty, nor is it about what is expected.
Good usability incorporates page purpose, site purpose, and user expectations to make it easier to accomplish the purpose for the user. If I can't get to my desired item easily, return to it, and help other people find it, the site is not usable for me. End of story.
That thing about oil rigs and shadows in the water? It may seem trivial, but if a major purpose of the website is improved public relations with a potentially hostile audience, little things take on bigger meaning....
Home Page vs Start Page (Score:2)
Here is a temporary link to my home page [galstar.com]. Some of the functions aren't working. My ISP got hosed.
The top section has the stuff that I want others to see and use. Nothing too special. The box on the right is filler material (that displays a funny movie when working correctly). The left hand side is all the different links I usually go to in an average week.
That's right. Instead of using bookmarks, this comes up as my home page, and I can easily select my favorite destinations that I use on a regular basis. (And, at the same time, endorse them for others to use.)
Bottom left is some articles I wrote (mostly on Segfault, which is currently down).
I think the idea though is that people should customize a page that they use, if not just for themselves, which contains all the links they commonly use. It really makes surfing through your favorites easier. (And marking something as a "real" favorite versus a bookmark, which could be anything.)
Annother usability hint (Score:2)
Others have commented on font - I'll just point to an example of how not to do it. Here is a story [aviationnow.com] from Aviation Week. Notice how, having used a minscule font, they then add to the effect by using mid-grey for the text on a white background.
Checkout also the interface hall of shame [iarchitect.com], although this is aimed more at applications than web pages.
Alternative, not so glowing review... (Score:2)
Anyway, you can read my review of Homepage Usability here. [weblogger.com]
Charles Miller
No, you don't (Score:5, Insightful)
As for the author's credits, Nielsen is widely acknowledged to be a guru in the field. Check out his website, UseIt [useit.com], for lots of more usability-related stuff.
Re: (Score:3, Insightful)
Re: (Score:2)
Re:And....??? (Score:3, Insightful)
First off, if you haven't read the book (neither have I), you can't comment on the depth of the information in it, since the review is very brief. On the other hand, go out and surf the Web a bit. The sad fact is that most people don't know these fundamentals.
The problem is that most Web designers, who, it seems, have little or no knowledge of HCI issues are taking the same approach to Web pages that TV producers take to TV. Flashy, little content, lots of bright shiny things to look at. The problem is that TV is totally passive, all a TV program needs to do is make you look at it, and stay there slack-jawed and glassy-eyed while a puddle of drool collects in your lap.
Web sites are delivering information, and more and more, allowing people to do things. It is an interactive format that is far more sophisticated than TV, particularly when you start doing things like commerce.
If you want flashy, dumb pictures to mesmerize and bedazzle your audience toss out the Web site and replace it with a single Flash animation. If you want to provide real information and allow your users to accomplish something useful and productive, study Human-Computer Interface design and actually learn something, because you are ultimately providing a computer application.
Even sites from people who should know better, like Netscape and Microsoft have lots of real usability problems.
The crowd here on
Re:And....??? (Score:2)
(Freshmeat [freshmeat.net] has had the same problem ever since it switched to its new software a few months back.)
Re:"Homepage"? (Score:3, Insightful)
Which brings up a reasonable point: most people aren't going to do a damned thing about usability unless their silly authoring tools support it. If you take away the intimacy with your site's workings that hand coding brings, people think a lot less about what it is they're building, and how it should work. When you grab the table tool and create a jazzy layout in a few clicks, you distance yourself from the logical process of building a page. H1 just means bigger font, right?
Dreamweaver and such should enforce good practices, but they don't.
Re:Let the backgrounds be black! (Score:2)
However, I think Nielsen has a point with the links, so I'm not sure I'm going to use it when I redesign some stuff.
You have a important point about changing all colors. However, that makes a problem, because instead of insisting on that the links should be blue, I think that the important point there is that you shouldn't change the user's default (which will, in most cases, indeed be blue). But what the heck, does the visuall design really matter that much... :-)
Re:How about... (Score:2, Insightful)