Print dit verslag
    Stuur door naar vriend(in)
Info verslag
Verslagtype: Werkstukken
Taal: Nederlands
Vak: Informatica
Commentaar: Geen
Aantal keer bekeken: 1316
Informatica

Webdesign & Jacob Nielsen

LET OP: Dit verslag is uitsluitend bedoeld als hulpmiddel bij het maken van je eigen verslag en niet om zomaar in te leveren bij je docent(e).

www.UseIt.Com

De bespreking
Door: Tim Verboom


“Goed webdesign in 50 stappen”


Op vraag van Ariane IT vat ik de site www.useit.com van Jakob Nielsen over keurig webdesign samen. Zelf is deze site afschuwelijk, onoverzichtelijk en lelijk opgesteld. Wetende dat het niet echt mijn opdracht is deze site te beoordelen, maar ervan te leren, valt het mij toch erg moeilijk hier niets over te zeggen. Als iemand zoals Jakob Nielsen zoveel weet over correct webdesign, waarom doet hij het zelf dan niet? Na een rondvraag in onze projectgroepen kwamen we allemaal tot hetzelfde oordeel: deze site is zelf één van de slechtste voorbeelden van correct webdesign. Toch geeft Nielsen, zoals je zal zien, zéér nuttige tips over degelijk webdesign.
Het leek mij niet nodig korte Engelse teksten te vertalen. In dit document zal ik dan ook Engels en Nederlands door elkaar gebruiken. De Nederlandse teksten zijn meestal, niet altijd dus, uitbreidingen van mijn hand aangezien ik ruim 5 jaar ervaring heb met het ontwikkelen van websites en een bloedhekel heb aan slechte sites! De onderwerpen staan in willekeurige volgorde.
Voor alle duidelijkheid: deze samenvatting zegt wat je moet en niet mag doen, maar niet ‘hoe’ (implementatie) je iets moet doen.

Jakob Nielsen:
"the king of usability"
(internet magazine)

De samenvatting:
Inhoud:


1. Sitemap 19. Simple search: fight complexity 35. Hyperlinks (not) in blue
2. Reaction time < 1 sec - No Graphics 20. Advanced search: No! 36. Navigation: on top and left!
3. Hyperlink: adding a slash / make it simple 21. PDF: avoid it! 37. Prioritize
4. HTTP keep-alive 22. Error messages 38. Frames are bad
5. Not only website is important – other factors 23. Date formats 39. Bleeding-edge technology, don’t use it
6. Style sheets 24. Passwords: don’t make them complicated 40. Scrolling text & blink: No!
7. Useful, even when not completely loaded 25. Single log-in & log-out: 41. Outdated Information
8. Resizable fonts 26. Flash: 99% bad 42. Video: Download Usually Better Than Streaming
9. Javascript: No 27. Scrollbars: don’t change! 43. Opening New Browser Windows
10. Fancy navigation: No 28. Mailing lists 44. Lack of Biographies
11. Advertising: No 29. Cancel buttons: No! 45. Lack of Archives
12. Subscriptions: Wrong 30. Radio buttons: initial value 46. Moving Pages to New URLs
13. Micropayments: Eventually yes 31. Under construction 47. Old browsers & Netscape
14. Keep users with disabilities in mind! 32. Navigation: not overdone! 48. URL as UI
15. Meta-tags 33. Content rulez! 49. Domain ends in .com
16. Easy-to-use interface 34. Plug-ins are hated! 50. 2D better than 3D
17. Feedback: in danger!



1. Sitemap:
Het is volgens Nielsen belangrijk een sitemap aan de site toe te voegen.
Users go to site maps if they are lost, frustrated, or looking for specific details on a crowded site. A site map's main benefit is to give users an overview of the site's areas in a single glance by dedicating an entire page to a visualization of the information architecture. If designed well, this overview can include several levels of hierarchy, and yet not get so big that users lose their ability to grasp the map as a whole.
Een sitemap lijkt mij overbodig voor een goed ontwikkelde website. Het is net als een softwarebedrijf dat zich eerst bezig houdt met het maken van een FAQ “Known Problems’” vooraleer het de problemen in het programma aanpakt!



2. Reaction time < 1 sec - No Graphics
Download times rule the Web, and since most users have access speeds on the order of 28.8 kbps, Web pages can be no more than 3 KB if they are to download in one second which is the required response time for hypertext navigation. Users do not keep their attention on the page if downloading exceeds 10 seconds, corresponding to 30 KB at modem speed. Keeping below these size limits rules out most graphics.

Considering these fundamental facts in both human factors and computer networking, there is only one conclusion: webpages have to be designed with speed in mind. In fact, speed must be the overriding design criterion. To keep page sizes small, graphics should be kept to a minimum and multimedia effects should only be used when they truly add to the user's understanding of the information.

Deze cijfers zijn enigszins gedateerd want ze blijken na enig onderzoek op het web van 2000 te zijn. Volledige (gedateerde) statistieken op: http://gladstone.uoregon.edu/~aharmon1/A1-what_are_the_statistics.html.
Flash en grote graphics zijn voor corporate sites natuurlijk uit den boze, maar kleine, mooie afbeeldingen maken het surfen, al zorgt dat voor enige vertraging, wel veel aangenamer! Een goed evenwicht vinden is dus de boodschap. Overigens zijn tegen het einde van dit jaar 90% van de Amerikanen (en Europa zal snel volgen) aansluitbaar op broadband.
http://www.cybertelecom.org/broadband.htm



3. Hyperlink: adding a slash / make it simple:
Links to a directory should include the final slash in the URL when embedded in webpages. The slash should be left out when writing the URL for human consumption. For example, the link to the list of Alertbox columns should be written as http://www.useit.com/alertbox in a (printed) magazine article but coded as http://www.useit.com/alertbox/ for the hypertext anchor in the online version of the article. The reason to include the slash in online links is to avoid a redirect when the server would have told the browser that the link refers to a directory and not a file. Adding trailing slashes to HREFs when appropriate reduces latency by a small but noticeable amount, so you may as well do it.

We have found that users actually try to decode the URLs of pages to infer the structure of web sites. Users do this because of the horrifying lack of support for navigation and sense of location in current web browsers. Thus, a URL should contain human-readable directory and file names that reflect the nature of the information space.
Also, users sometimes need to type in a URL, so try to minimize the risk of typos by using short names with all lower-case characters and no special characters (many people don't know how to type a ~).




4. HTTP keep-alive:
Use a server that supports HTTP keep-alive: saving the overhead of establishing a new TCP/IP connection for every "hit" cuts latency dramatically. The experienced response time to load a page often drops to about half by using keep-alive.



5. Not only website is important – other factors
Een goede website heeft geen zin als de rest van de factoren niet mee willen:
- the throughput of the server: ought not to be a problem since the cost of hardware is the smallest part of developing a website, but popular sites often get surprised by rapidly increasing traffic and do not upgrade their machines fast enough.
- the server's connection to the Internet: many sites try to save on their connection and put off upgrading from, say, a T-1 to a T-3 even when their current connection is saturated
- the Internet itself: even though the net keeps getting upgraded, it still has bottlenecks, especially for cross-continent connections and for use at peak hours
- the user's connection to the Internet: as discussed above, connection speeds are very low for the majority of users and will stay that way for several years
- the rendering speed of the user's browser and computer: rarely a big problem, though complex tables can take significant time to lay out on low-end machines
Having a website that works all the time greatly contributes to user happiness. It can also contribute to yours: Our studies show that a site's robustness and availability impacts users' trust in your company and thus their willingness to do business with you.



6. Style sheets
Volgens mij en Nielsen een van de belangrijkste vernieuwingen van het modern webdesign: style sheets!

Om kleur te brengen in een site zijn afbeeldingen niet altijd noodzakelijk.
Much can be done by colored table cells and creative (but restrained) use of different fonts. In particular, style sheets can be used to improve page design without incurring a download penalty. If you are using style sheets (and everybody should be doing so by the end of 1997), I do recommend making them linked rather than embedded: a linked style sheet only needs to be downloaded once (assuming that you have a consistent style for your site), whereas embedded styles add to the size of every single page.

Style sheets zijn ook handig om een consistente vormgeving door te voeren en om de site, als de tijd gekomen is, snel van uiterlijk te veranderen. Style sheets worden door een eenvoudige HTML-editor zoals MS Frontpage perfect ondersteund!



7. Useful, even when not completely loaded:
It matters less if it takes longer to load the full page and all its illustrations if the user can start acting on some information fast.

Guidelines for fast initial loading are:
- the top of the page should be meaningful even when no images have been downloaded (i.e., more text, less images)
- use ALT attributes for images so that the user can understand what they are about before they are rendered
- the browser must draw the top of the page fast: it can only do so if it has all the information it will need for layout, so include WIDTH and HEIGHT attributes on all images and table columns
- complex tables often take a long time to render, so cut down on the complexity of your tables by splitting the information into several tables. In particular, the top table should be simple and fast to render.



8. Resizable fonts
Fixed fonds zijn volgens Nielsen uit den boze. De site van de olympische winterspelen gebruikt ze (www.saltlake2002.com). Hierdoor wordt de website voor slechtziende gebruikers nutteloos. Wat hij zegt is natuurlijk waar, maar waarom hij op www.useit.com als standaard lettergrootte verdana 12ptn gebruikt is mij een raadsel. Dit is voor ‘goedzienden’ erg onaangenaam om te lezen.
Dus: standaard een aardige puntgrootte kiezen (voor verdana niet groter dan 10ptn, zoals in dit document) en resizen mogelijk maken!



9. Javascript: No
Je weet zelf wel voor hoeveel problemen Javascript kan zorgen. Surf maar eens naar http://webmail.telenet.be. Je krijgt de ene foutmelding na de anderen. Volgens Nielsen moet je Javascript dus zoveel mogelijk vermijden.
No (java)code equals no risk of bugs! If you must use JavaScript, test and debug religiously on all combinations of platforms and browser versions.



10. Fancy navigation: No
Avoid special menu controls in your Web navigation. Stick to simple point-and-click. Fancy navigation controls often fail, especially for users who move their mouse fast or who have motor skill impairments.



11. Advertising: No
Since 1997, I've said that advertising doesn't work on the Web because it's contrary to the fundamental nature of the user experience: goal-driven navigation. (The exceptions are search-engine ads and classified ads; these support users' goals instead of thwarting them.)

If a website degrades the user experience too much, people will simply stay away. There are already several sites I am reluctant to visit because they pollute my screen with pop-ups.

Annoying ads are ultimately self-defeating since people will avoid sites that do not give them a positive user experience. The Web is a user-driven phenomenon, where people go online for a purpose.

En hier zijn we het allemaal mee eens! Volgens Kliks.Nl, een Nederlands bedrijf dat zich bezig houdt met advertenties op het internet, zijn bezoekers overigens meer geneigd op tekstlinks dan op banners te klikken. www.kliks.nl.

Why search engines are an exception: Because they know what users are looking for, search engines can target ads to a user's current navigation goals. Displaying an ad for something that the user immediately wants is much more powerful than targeting ads based on general user profiling and demographics.
à reclame mag dus, als deze handig kan zijn voor de gebruiker. Gebruikers die online schoenen willen kopen hebben er niets op tegen dat er een banner van een e-schoenwinkel getoond wordt. Beter dan een banner zijn natuurlijk tekstlinks zoals bij Google.com.



12. Subscriptions: Wrong
Subscriptions are a bad idea because they violate a fundamental web principle: freedom of movement and discovery.
We kunnen hieronder verstaan:
- Inschrijven verplicht om verder te gaan in de site: enerverend voor de gebruiker!
- Inschrijven en betalen: users simply cannot afford to pay such fees for all the Internet services they're likely to benefit from.



13. Micropayments: Eventually yes
The main problem with subscription fees is that they provide a single choice: between paying nothing (thus getting nothing) and paying a large fee (thus getting everything). Most users will chose to pay nothing and will go to other sites.
Micropayments lower the threshold and do not require a big decision before users get their initial benefits: thus users will be encouraged to view more pages and spend more.
Betalen per download ja, maar betalen voor een jaar downloads NEE!
“Charging subscriptions is like building a city wall: you keep people out!”



14. Keep users with disabilities in mind!
Users with disabilities are disabled and many must use assistive technologies to access the Web. Obviously, websites must be accessible through alternative user interface devices, such as screen readers and screen magnifiers. If you can't get at the information or services that a website or intranet offers, then you definitely can't use it either. But, just because a design is theoretically accessible, doesn't mean that it's easy to use, simple to learn, or supports efficient job performance.
Usability is Three Times Better for Non-Disabled Users!
ALT-tag bij afbeeldingen invullen is dus de boodschap!



15. Meta-tags
Een site moet vindbaar zijn op het internet. Het is daarom belangrijk om meta-tags in een html-document op te nemen. Deze bevatten een korte beschrijving van de site met keywords die gebruikt worden door zoekmachines. De implementatie hiervan is eenvoudig, maar wordt door de zoekmachines niet altijd correct gebruikt.


Dit zou moeten voorkomen dat je site in zoekmachines terechtkomt met als beschrijving: “Uw browser ondersteunt geen frames” of iets dergelijks.
Uit ervaring weet ik dat het niet gemakkelijk is om met een correcte beschrijving in zoekmachines terecht te komen. Het lastigste is: eens er een verkeerde beschrijving bij je site staat, kan je deze nauwelijks nog veranderen! Daarbij komt nog eens dat je moet te weten komen welke zoekstring een potentiële gebruiker zou invoeren voor je site! Als zelfs een bedrijf als Microsoft daar bij AltaVista niet in slaagt! Typ maar eens Microsoft in. De hoofdsite is zeker niet de eerste in de lijst!



16. Easy-to-use interface
To design an easy-to-use interface, pay attention to what users do, not what they say! Self-reported claims are unreliable, as are user speculations about future behaviour.
In past years, the greatest usability barrier was the preponderance of cool design. Most projects were ruled by usability opponents who preferred complexity over simplicity. As a result, billions of dollars were wasted on flashy designs that were difficult to use.
Maak enkele alternatieve designs en laat de gebruikers ermee werken (niet alleen laten zien!) en vraag welke het beste is. If the users have not actually tried to use the designs, they'll base their comments on surface features. Such input often contrasts strongly with feedback based on real use.

No drop-down menus: drop-down menus often have low usability and either confuse users or lead them to unintended parts of the site.



17. Feedback: in danger!
You must consider how and when to solicit feedback. Although it might be tempting to simply post a survey online, you're unlikely to get reliable input (if you get any at all). Users who see the survey and fill it out before they've used the site will offer irrelevant answers.
Feeback: OK, maar dan wel als de gebruikers de site al gebruikt hebben!



18. Description of you site
Users decide quickly whether to stay or leave a site. To assess whether your homepage communicates effectively to visitors in the crucial first 10 seconds, follow two simple guidelines.
- First, collect the taglines from your own site and your three strongest competitors. Print them in a bulleted list without identifying the company names. Ask yourself whether you can tell which company does what. More important, ask a handful of people outside your company the same question.
- Second, look at how you present the company in the main copy on the home page. Rewrite the text to say exactly the opposite. Would any company ever say that? If not, you're not saying much with your copy, either.



19. Simple search: fight complexity
Search is the user's lifeline for mastering complex websites. The best designs offer a simple search box on the home page and play down advanced search and scoping.
A typical comment is: "I don't want to have to navigate this site the way they want me to. I just want to find the thing I'm looking for." This is why many users go straight to the home page search function.
Search is also users' escape hatch when they are stuck in navigation. When they can't find a reasonable place to go next, they often turn to the site's search function. This is why you should make search available from every page on the site; you cannot predict where users will be when they decide they are lost.

Guidelines:
- On home pages, search should be a type-in field and not a link.
- The search input field should be wide enough to contain the typical query; if the box is too small, the query will scroll and diminish usability.

First page = golden:
Users almost never look beyond the second page of search results. It is thus essential that your search prioritize results in a useful way and that all the most important hits appear on the first page.



20. Advanced search: No!
The mean query length is 2.0 words.
Most users cannot use advanced search or Boolean query syntax.
De woorden ‘and’ en ‘or’ worden dikwijls verkeerd geïnterpreteerd door niet-informatici.
Vb: Gebruiker zoekt bedrijven uit Mechelen en Antwerpen en typt “Bedrijven and Mechelen And Antwerpen”. Je kan al raden (maar de gebruiker waarschijnlijk niet) wat het gevolg is!

Do not offer advanced search from the home page. Advanced search leads users into trouble, as they invariably use it wrong. When it makes sense, offer advanced search as an option users can link to from the search results page: "Didn't find what you were looking for? Try advanced search."



21. PDF: avoid it!
Forcing users to browse PDF files makes usability approximately 300% worse compared to HTML pages. Only use PDF for documents that users are likely to print. PDF was designed to specify printable pages. PDF content is thus optimized for letter-sized sheets of paper, not for display in a browser window! PDF pages lack navigation bars and other apparatus that might help users move within the information space and relate to the rest of the site. Because PDF documents can be very big, the inability to easily navigate them takes a toll on users. PDF documents also typically lack hypertext, again because they are designed with print in mind.

In those cases, following basic guidelines will minimize usability problems:
- Create a gateway HTML page that summarizes the PDF file in sufficient detail, including page count and file size. This will let users decide whether it is worth downloading.
- State clearly that the PDF file is for printing only. Present the same content on other Web pages in traditional formats, and provide links to them for readers who prefer to read online.
- From any other part of the website, link only to the gateway page.
- Never let your search engines index the PDF file. Instead, ensure that your gateway page is indexed.
- Ensure that your PDF document format is at least one version behind the latest offering. (vb: Acrobat-reader versie 4 ipv 5 als die uit is)
- Format your printable documents for different sizes of paper. Some countries use 8.5x11, while others use A4. Make sure your document will fit both.



22. Error messages
Good error messages are polite, precise, and constructive. The Web brings a few new guidelines: Make error messages clearly visible, reduce the work required to fix the problem, and educate users along the way.

Het beste voorbeeld van een slechte foutboodschap is de alom bekende 404.

Guidelines:
- Explicit indication that something has gone wrong. The very worst error messages are those that don't exist. When users make mistakes and get no feedback, they're completely lost.
- Human-readable language, instead of obscure codes or abbreviations such as "an error of type 2 has occurred."
- Polite phrasing that doesn't blame users or imply that they are either stupid or doing something wrong, as in "illegal command."
- Precise descriptions of exact problems, rather than vague generalities such as "syntax error."
- Constructive advice on how to fix the problem. For example, instead of saying "out of stock," your error message should either tell users when the product will be available or provide a way for users to ask to be notified when the product is restocked.

Two other guidelines can make the error situation less unpleasant for users:
- Preserve as much as the user's work as possible. Let users correct errors by editing their original action instead of having to do everything over again.
- Reduce the work of correcting the error. If possible, guess the correct action and let users pick it from a small list of fixes. For example, instead of just saying "city and zip code don't match," let users click on a button for the city that matches the zip code they entered.



23. Date formats
Een datum die niet voluit geschreven wordt kan door personen van verschillende nationaliteit anders begrepen worden. Om dit te voorkomen is het handig om een datum voluit te schrijven of het internationale / Japanse formaat te gebruiken van jaar-maand-dag.
Dat dit altijd even gemakkelijk te verwezenlijken is bewijst mijn eigen website www.verslagen.com die het Amerikaanse formaat gebruikt aangezien dit door ASP (Active Server Pages) en de server waarop de site staat zo opgelegd wordt. Natuurlijk is dit te omzeilen met een scriptje, maar dit zorgt dan weer voor meer bewerkingen op de server en dus tragere responsetijd.



24. Passwords: don’t make them complicated
A big lie of computer security is that security improves as password complexity increases. In reality, users simply write down difficult passwords, leaving the system vulnerable. Security is better increased by designing for how people actually behave.
The big lies of computer security:
- Random passwords are more secure.
- A system-selected password is more secure than one the user chooses.
- Long passwords are more secure than short ones.
- Forcing the user to change passwords frequently increases security.
- Requiring different passwords for different systems increases security.
User-id:

It is recommended letting users enter their email address instead of a user-id: It's guaranteed to be unique and it is easy to remember.
Natuurlijk zijn er ook gebruikers die liever niet zomaar een email-adres op een site invullen. Je kan dit volgens mij dan ook alleen maar gebruiken bij zakelijke sites en met een duidelijke vermelding wat er met dit emailadres gebeurt.



25. Single log-in & log-out:
Log-in:
Users want a single log-in that follows them as they use the system. Nobody wants to log in again and again.

Log-out:
For sensitive systems, many users feel more comfortable when they see an explicit logout button. For most systems, however, you can assume that users will not log out and instead will simply leave.



26. Flash: 99% bad:
Although multimedia has its role on the Web, current Flash technology tends to discourage usability for three reasons: it makes bad design more likely, it breaks with the Web's fundamental interaction style, and it consumes resources that would be better spent enhancing a site's core value.
Flash intros that have the an obnoxious effect: They delay users' ability to get what they came for. Even when there is a “skip intro”-button it still delays a user to get what he came for… Unless he came to see the flash-animation!

Een flash-animatie heeft meer weg van interactieve televisie dan van een interactieve website. En 1 keer naar een programma is leuk… maar 100 keer hetzelfde al helemaal niet meer! Flash-animaties worden zelden geüpdatet!



27. Scrollbars: don’t change!
Scrollbars werden gedurende jaren bestudeerd. Het huidige concept van scrollbars is zeer degelijk en iedereen weet hoe ze werken. Het is daarom nutteloos deze te veranderen!



28. Mailing lists
Mailing list content must be ultra-short. Provide separate email addresses for subscribing and unsubscribing and include info on how to get off in every mailing list message.

Some companies send out very long emails that constitute complete newsletters. Keep the email very short, restricting it to headlines and summaries with links to more extensive content on the website. Two reasons:
- Users are incredibly stressed when processing their inboxes: they have to get to the urgent messages from their boss, customers, spouse, etc., so they typically don't have time to read much. The rule for Web content is keep it short. The rule for email content is keep it ultra-short.
- You want the email to link back to your website since that's where you can provide a much richer user experience in those cases where the user does want more depth than can be provided in an email.

Registration:
Users must opt-in before getting your email newsletter. Many sites try to do so by having a user registration form that contains a little box for "I want to receive valuable marketing promotions" that is checked by default. This is not good.

Sure, some users will overlook the box and will not uncheck it. That does not mean that they will welcome your newsletter. On the contrary, they will detest your company for sending them spam. Even worse, those users who do notice the little box will lose trust in your site because they will feel that the site is trying to trick them.

Much better to leave the box unchecked and only collect those users who are eager to get your material.

Als tekst bij het aankruisvakje moet staan: “Receive our newsletter”. Niet “Do not receive our newsletter”.

Increasing subscriptions:
To increase the number of users who subscribe, don't just talk about "valuable offers". Instead, provide explicit information about:

what type of information and offers the mailing list will contain
how frequently it is published (people are more likely to subscribe if the frequency matches their needs - consider offering multiple newsletters with different publication frequencies to serve different market segments)
how to see a sample newsletter before subscribing - people are more likely to sign up if they know what they will get.

Confirmation:
Send the user a confirmation message and don't activate the subscription unless you receive a positive reply. Extra steps are obviously an annoyance and some users will not understand the instructions in the confirmation message: make sure to usability-test this text thoroughly. Yes, plain text can be a user interface.



29. Cancel buttons: No!
The Reset and Cancel buttons are the Web's attempt at mirroring cancel and undo buttons in GUI software, but users usually prefer to use the Back button instead when they want to escape from an undesired state.

The Web would be a happier place if virtually all Reset buttons were removed. This button almost never helps users, but often hurts them.

Reset clears away the user's input on a Web form, but why would people want to do that? The Web is characterized by frequent movement between pages and users rarely encounter the same form twice. Thus, a Web form is almost always cleared when the user sees it. Even when a user revisits a form in a single session, it is usually faster to edit the old data than to erase it and start over.

Redenen:
- Een gebruiker kan zich vergissen.
- Meer knoppen: meer keuzes à meer beslissingstijd.

Exception:
Reset can be useful for forms that satisfy both of the following criteria:
- the form is filled-in repeatedly by the same user
- the data to be entered differs significantly from one use of the form to the next

Nog extra uitzonderingen:
- bij winkelwagentjes
- bij multi-step dialogs… al worden deze best niet gebruikt.
Je moet er ook altijd rekening mee houden dat een gebruiker een website kan verlaten zonder eerst de cancel-button te gebruiken!



30. Radio buttons: initial value
A classic design mistake on the Web is to have radio buttons that initially do not have a selection. Often, there is no way for the user to select a "nothing" option, once he or she has selected one of the choices. Always include an explicit radio button for the default choice and always include a selectable menu entry in pull-down menus for the default choice. Otherwise you do trap users.



31. Under construction
It is clear that under construction messages should be avoided.
In addition to telling the users that you cannot satisfy their needs, you should avoid leaving them stranded.
This goes against the grain of many sales people, but sometimes it is best to link to another site that does offer the solution. Sure, you will lose this sale, but you would have lost it anyway, and by giving the user a useful referral, you will have won credibility points. Just as important, you will have secured a position in the user's mind as the place to start the next time they go looking for solutions. Also, you may try to get a referral fee for the link so that you do recapture some revenue.

The happiest case is the one where something is currently unavailable but will become available reasonably soon:
- If you know the availability date for sure and it is less than a week away, then simply tell users the date and ask them to check back. Or allow them to pre-order if the price and product description are known.
- If the availability date is uncertain or is too far into the future for users to remember, then offer users the option to enter their email address to be notified when the product or service becomes available. Add an explicit statement that the email address will only be used for this one mailing and never again. Honour this promise!



32. Navigation: not overdone!
Navigatie moet er natuurlijk zijn en liefst zo duidelijk mogelijk. Maar op elke pagina verwijzen naar elke andere pagina is uit den boze!

There is no reason to mention all features of the site on all pages. Instead, select a very small number of highly useful features and limit pervasive linking to maybe five or six things like search: users turn to search when they are lost, and you cannot predict when that may happen. Less is more: having a small number of standard links on every page makes it more likely that users will notice those links they do need. In contrast, a link like "how to contact us" can safely be relegated to the home page, which is where users will go when they need it.

Exception:
Contact info also needs to be on order confirmation pages.

Structural Navigation:
Do not link to all sections of the site from all pages. What is the probability that a user will go from looking at hairdryers to looking at grunge music? Why not just go back to the home page (one click to a page that is already cached and thus displays in half a second if coded correctly).
Instead, provide links to all levels of the hierarchy above the current location.



33. Content rulez!
Studies have shown the same user behaviour: users look straight at the content and ignore the navigation areas when they scan a new page. (Remember, users almost always scan - they rarely read carefully online.)

- users comment on the content first; if the content is not relevant, then they don't care about any other aspect of the design
- when they arrive on a page, users ignore navigation bars and other global design elements: instead they look only at the content area of the page
- users don't understand where they are in a website's information architecture
- users are extremely goal-driven and look only for the one thing they have in mind - they don't spend much time on promotions for anything else
- in pursuit of their goal, users often rely on search as their main hunting strategy
- users rarely look at logos, mission statements, slogans, or any other elements they consider fluff (in particular, they ignore advertising and anything that looks like an ad)
- if a page does not appear relevant to the user's current goals, then the user will ruthlessly click the Back button after two to three seconds
- if users don't understand a certain design element, they don't spend time learning it - instead, they ignore it and continue the hunt for their own goal



34. Plug-ins are hated!
Web users are getting more impatient every year: reduced desire to learn new interaction techniques, less ready to download plug-ins, and unwilling to tolerate slow downloads. If a site doesn't provide immediate gratification, they leave.



35. Hyperlinks (not) in blue
The mother of bad web design conventions is the decision to make hypertext links blue. Other colors would have been a better choice and would have increased the reading speed of the anchor text by a few percent. It is unfortunate to put the most important text on the page in a color that is known to reduce readability.
If we were designing the Web from scratch, I would recommend using a different link color than blue. Since we are designing sites for the Web as it exists, I retain my recommendation to leave the standard link colors alone:

Blue text means "click here" on the Web, so by keeping unvisited links blue, there is no doubt in users' minds as to what they can do. The time they save by knowing what to do on a page is probably much bigger than the time they lose by having the few words in the hypertext anchors be a few milliseconds slower to read.
Even more important, knowing the difference between unvisited (blue) and previously visited (purple) links helps users understand the structure of the website and their own navigation history. On sites that change the colors, we often observe users revisiting the same pages again and again because they do not realize that they have already seen those pages. The added confusion, substantial navigation delays, and reduced probability of ever finding the right page are all very severe usability penalties from changing the default link colors.

Voor hyperlinks die op een hoog niveau in de navigatiehiërarchie staan is het veranderen van de kleur naar paars natuurlijk wel ongepast en zelfs ergerlijk!



36. Navigation: on top and left!
Jakob Nielsen twijfelt zelf over de plaats van de navigatie maar besluit uiteindelijk dat je best bovenaan en links van de pagina de navigatie plaatst. Het argument dat door navigatie aan de kant van de pagina ruimte verloren gaat is volgens hem, en ik deel zijn mening volledig, minderwaardig aan het feit dat dit een gewoonte is en dus tot beter en vooral sneller navigeren leidt!

Two things that are absolutely clear is that the navigation rail has to have some kind of coloured background to set it aside from the content and that it has to be on the left side of the page.
In western culture people look always first at the left side and the top of the page.
Navigation on the top is not really a problem because people look always first at the content of a page, not the navigation.

Het is aanbevolen om een gebruiker in te lichten waar hij zich op een bepaald moment in de hiërarchie van de website bevindt. Pijltjes, dubbele punten en ‘>’-tekens kunnen hierbij helpen.



37. Prioritize
If everything is equally prominent, then nothing is prominent. It is the job of the designer to advise the user and guide them to the most important or most promising choices (while ensuring their freedom to go anywhere they please).
On today's Web, the most common mistake is to make everything too prominent: over-use of colors, animation, blinking, and graphics. Every element of the page screams "look at me" (while all the other design elements scream "no, look at me"). When everything is emphasized, nothing is emphasized.



38. Frames are bad
Frames hebben vele slechte eigenschappen, maar kunnen soms handig zijn. Algemeen wordt toch afgeraden om frames te gebruiken bij het ontwikkelen van een nieuwe website.

Splitting a page into frames is very confusing for users since frames break the fundamental user model of the web page. All of a sudden, you cannot bookmark the current page and return to it (the bookmark points to another version of the frameset), URLs stop working, and printouts become difficult. Even worse, the predictability of user actions goes out the door: who knows what information will appear where when you click on a link?

Een ander belangrijk probleem zijn de zoekmachines. Iedereen heeft ooit al wel eens “Uw browser ondersteunt geen frames…” als beschrijving van een website in de zoekmachines gezien. Het komt ook regelmatig voor dat een zoekmachine linkt naar een pagina van je website verschillend van de hoofdpagina met frames.

Het enige, niet onbelangrijke voordeel, van frames dat ik kan bedenken is het feit dat de navigatie van de site ten allen tijde zichtbaar blijft voor de gebruiker. De beste manier om vast te stellen dat frames meestal onbruikbaar zijn is door gewoon eens een site met frames te maken. De problemen zullen vroeg of laat wel zichtbaar worden, geloof mij!



39. Bleeding-edge technology, don’t use it
Don't try to attract users to your site by bragging about use of the latest web technology. You may attract a few nerds, but mainstream users will care more about useful content and your ability to offer good customer service. Using the latest and greatest before it is even out of beta is a sure way to discourage users: if their system crashes while visiting your site, you can bet that many of them will not be back. Unless you are in the business of selling Internet products or services, it is better to wait until some experience has been gained with respect to the appropriate ways of using new techniques. When desktop publishing was young, people put twenty fonts in their documents: let's avoid similar design bloat on the Web.



40. Scrolling text & blink: No!
Never include page elements that move incessantly. Moving images have an overpowering effect on the human peripheral vision. A web page should not emulate Times Square in New York City in its constant attack on the human senses: give your user some peace and quiet to actually read the text!
Of course, is simply evil. Enough said.



41. Outdated Information
Hire a web gardener as part of your team. You need somebody to root out the weeds and replant the flowers as the website changes but most people would rather spend their time creating new content than on maintenance. In practice, maintenance is a cheap way of enhancing the content on your website since many old pages keep their relevance and should be linked into the new pages. Of course, some pages are better off being removed completely from the server after their expiration date.



42. Video: Download Usually Better Than Streaming
Because of the poor quality of streaming video, it is often best to digitize a higher-quality version of the video and make it available for download. If the video actually has value, then users won't mind waiting, say, five minutes to download a one-minute video where they can actually see something.
For any download that will take more than 10 seconds at the bandwidth available to most of your users, you should state the size of the file. For most sites, this means that they should indicate the size of anything larger than 50 kilobytes. Also state the file format if you are using any type of non-standard format.

It is rare that current-quality streaming video could not be replaced by a few still images and a transcript. In fact, most sites would improve if they replaced streaming video with an alternative format such as a comic strip-like sequence of photos with captions. Not only can the photos employ much higher image quality, but the user will also be able to scan the presentation and easily focus on those segments that interest him or her.



43. Opening New Browser Windows
Opening up new browser windows is like a vacuum cleaner sales person who starts a visit by emptying an ash tray on the customer's carpet. Don't pollute my screen with any more windows, thanks (particularly since current operating systems have miserable window management). If I want a new window, I will open it myself!



44. Lack of Biographies
Users want to know the people behind information on the Web. In particular, biographies and photographs of the authors help make the Web a less impersonal place and increase trust.

It is particularly bad when a by-line is made into a mailto: link instead of a link to the author's biography. It is much more common for a reader to want to know more about an author (including finding the writer's other articles) than it is for the reader to want to contact the author.



45. Lack of Archives
Old information is often good information and can be useful to readers. Even when new information is more valuable than old information, there is almost always some value to the old stuff, and it is very cheap to keep it online. I estimate that having archives may add about 10% to the cost of running a site but increase its usefulness by about 50%.
Archives are also necessary as the only way to eliminate linkrot and thus encourage other sites to link to you.



46. Moving Pages to New URLs
Anytime a page moves, you break any incoming links from other sites. Why hurt the people who send you free customer referrals?



47. Old browsers & Netscape
Incompatibiliteit van de verschillende browsers is een waar probleem. Gelukkig is er na enkele jaren weer een ‘standaard’ browser, namelijk Internet Explorer. Het is dan ook aangeraden vooral met deze browser rekening te houden zelfs al ben je geen IE fan. Eigen onderzoek heeft uitgewezen dat nog slechts 1% van de bezoekers van Netscape gebruiken en dan nog wel een oude versie (4).

Incompatibiliteit tussen verschillende versies:
- sites will have to support users with version 3 browsers until early 2001
- version 4 will have to be supported until late 2003
- Netscape 5 will never get more users than Netscape 4
- not until the year 2003 will advanced browsers be sufficiently widely used to allow sites to go beyond the basics

A particularly interesting aspect of the predictions is that Netscape 5 is a "lost generation" that never rises above Version 4 on the chart. In fact, it may never again be possible for a single browser version to dominate the Web the way Mosaic and Netscape versions 1-3 did. Even Netscape 4 didn't truly dominate the way the chart shows because it had to share the limelight with IE 4.

In fairness it must be said that IE 5/6 is the best browser yet and that it does support almost everything in the basic Web standards (HTML 4 and CSS 1).



48. URL as UI
The URL will continue to be part of the Web user interface for several more years, so a usable site requires:
- a domain name that is easy to remember and easy to spell
- short URLs: not like www.vandesselautomatisatie.com ->
- less than 78 characters (no line feed)
- easy-to-type URLs
- URLs that visualize the site structure
- URLs that are "hackable" to allow users to move to higher levels of the information architecture by hacking off the end of the URL
- persistent URLs that don't change
- do not use MiXeD case text in URLs since people can't remember the difference between upper-case and lower-case characters



49. Domain ends in .com
Many users have been trained to view ".com" as the standard ending for commercial websites: this is an artifact of the early American dominance on the Web and of the completion algorithm in several popular browsers which automatically add .com to any name. Because of this situation, my advice is:
- for a site that uses English and is clearly world-wide in its appeal and user base: get a .com domain
- for a site that uses any other language: use the appropriate country domain ending
- for a site that has mainly local appeal, covers mainly local issues, or sells mainly local products: use the country domain, no matter what language is used on the site



50. 2D better than 3D
If we had been frogs with eyes sitting on the side of the head, the story might have been different, but humans have their eyes smack in the front of their face, looking straight out.

Exception: When you visualize physical objects that need to be understood in their solid form.





Slot: When Bad Design Elements Become the Standard
Web design is easy: If you are thinking about how to design a certain page element, all you have to do is to look at the twenty most-visited sites on the Internet and see how they do it.
- If 90% or more of the big sites do things in a single way, then this is the de-facto standard and you have to comply. Only deviate from a design standard if your alternative design has at least 100% higher measured usability.
- If 60-90% of the big sites do things in a single way, then this is a strong convention and you should comply unless your alternative design has at least 50% higher measured usability.
- If less than 60% of the big sites do things in a single way, then there are no dominant conventions yet and you are free to design in an alternative way. Even so, if there are a few options, each of which are used by at least 20% of big sites, you should limit yourself to choosing one of these reasonably well-known designs unless your alternative design has at least 25% higher measured usability than the best of the choices used by the big sites.

Voila! Ik hoop dat je iets hebt geleerd uit deze 50 tips, ik alvast wel! Het www zal ongetwijfeld veel ordelijker en gebruiksvriendelijk worden als iedereen er rekening mee houdt!

Greetz,
Tim Verboom

Terug Stuur je eigen verslag op Opnieuw zoeken