Book Dont Make Me Think

download Book Dont Make Me Think

of 10

  • date post

  • Category


  • view

  • download


Embed Size (px)

Transcript of Book Dont Make Me Think

  • 8/8/2019 Book Dont Make Me Think


    Dont Make Me Think- A Common Sense Approach to Web UsabilitySteve KrugNew Riders Publishing

    --- summary only for my personal use.

    1. Dont make me think!I could list dozens of other things that visitors to a site shouldnt spend their timethinking about, like: Where am I?

    Where should I begin? Where did they put ____ ?

    What are the most important things on this page? Why did they call it that?

    2. How we really use the web.Scanning , satisficing, and muddling through

    We dont read pages. We scan them.

    Were usually in a hurry. We know we dont need to read everything. Were good at it. Weve been scanning newspapers, magazines, and

    books all our lives to find the parts were interested in , and we know that itworks.

    We dont make optical choice s. We satisfice.

    In reality, though, most of the time we dont choose the best option- wechoose the first reasonable option, a strategy known as satisfying. As soon aswe find a link that seems like it might lead to what were looking for, theres avery good chance that well click it.

    Why dont Web users look for the best choice?

    Were usually in a hurry. Theres not much of a penalty for guessing wrong.

    Weighing options may not improve our chancesOn poorly designed sites, putting effort into making the best choicedoesnt really help. Youre usually better off going with your first guess andusing the Back button if it doesnt work out

    Guessing is more fun.

  • 8/8/2019 Book Dont Make Me Think


    3. Billboard Design 101Designing pages for scanning, not reading

    Faced with the fact that your users are whizzing by, there are fiveimportant things you can do to make sure they see- and understand- asmuch of your site as possible.

    Create a clear visual hierarchy on each page Take advantage of conventions Break pages up into clearly defined areas Make it obvious whats clickable Minimize noise

    Create a clear visual hierarchy

    The more important something is, the more prominent it is. Things that are related logically are also related visually. Things are nested visually to show whats part of what.

    Conventions are you friends

    Conventions enable users to figure out a lot about a Web page, even if theycant understand a word of it. Theyre very useful

    Designers are often reluctant to take advantage of them.

    Break up pages into clearly defined areas.

    Make it obvious whats clickable.

    Keep the noise down to a dull roar.

    One of the great enemies of easy-to-grasp pages is visual noise. There arereally two kinds of noise: Busy-ness Background noise.

    Users have varying tolerance for complexity and distractions: some peoplehave no problem with busy pages and background noise, but many do.When youre designing Web pages, it s probably a good idea to assumethat everything is visual noise until proven otherwise.

    4. Animal, Vegetable or mineral?Why users like mindless choices

    In general I think its safe to say that users dont mind a lot of clicks aslong as each click is painless and they have continued confidence that

  • 8/8/2019 Book Dont Make Me Think


    theyre on the right track. I think the rule of thumb might be something likethree mindless, unambiguous clicks equal one click that requires thought.

    We face choices all the time on the Web and making the choices mindlessis one of the main things that make a site easy to use.

    5. Omit Needless words.The art of not writing for the web.

    Omit needless words

    Vigorous writing is concise. A sentence should contain no unnecessarywords, a paragraph no unnecessary sentences, for the same reason thata drawing should have no unnecessary lines and a machine no

    unnecessary parts.

    Getting rid of those words that no one is going to read has severalbeneficial effects: It reduces the noise level of the page

    It makes the useful content more prominent It makes the pages shorter, allowing users to see more of each page at a

    glance without scrolling.

    Happy talk must die.

    - A lot of happy talk is the kind of self-congratulatory promotionalwriting that you find in badly written brochures. Unlike goodpromotional copy, it conveys no useful information, and it focuseson saying how great we are, as opposed to delineating what makesus great.

    Instruction must die.

    - The main thing you need to know about instructions is that no oneis going to read them. If the instructions are wordy, the odds ofusers finding the information they need is pretty low.

    - You objective should always be to eliminate instructions entirely bymaking everything self-explanatory, or as close to it as possible.

    When instructions are absolutely necessary, cut them back to thebare minimum.

    6. Street signs and BreadcrumbsScene from a mall We need a decision chart*

    Web Navigation 101

    Youre usually trying to find something You decide whether to ask first or browse first.

  • 8/8/2019 Book Dont Make Me Think


    If you choose to browse, you make your way through a hierarchy, usingsigns to guide you.

    Eventually, if you cant find what youre looking for, you ll leave.

    The unbearable lightness of browsing No sense of scale: In web, there could be huge corners weve never


    No sense of direction: meaning up and down, the direction in hierarchy- toa more general or more specific level.

    No sense of location: We develop a sense of where things are and cantake shortcuts to get to them.

    The overlooked purposes of navigationTwo of the purposes of navigation are fairly obvious: to help us find

    whatever it is were looking for, and to tell us where we are. It gives us something to hold on to. It tells us whats here: By making the hierarchy visible, navigation tells us

    what the site contains. It tells us how to use the site: Navigation tells us implicitly where to begin

    and what your options are. It gives us confidence in the people who built it. Clear, well-thought-out

    navigation is one of the best opportunities a site has t create a goodimpression.

    Web navigation conventions

    The basic elements are: Site ID Sections/Sub-Sections : sometimes called the primary navigation- are the

    links to the main sections of the site: the top level of the sites hierarchy. Utilities: Important elements of the site that arent really part of the content

    hierarchy.// About Us, Archives, Checkout, Company Info, Contact Us, CustomerService, Discussion Boards, Downloads, Directory, Forums, FAQs, Help,Home, Investor Relations, How to Shop, Jobs, My____, News, OrderTracking, Press Releases, Privacy Policy, Register, Search, ShoppingCart, Sign in, Site Map, Store Locator, Your Account

    You are here indicator Page Name Local Navigation(Things at the current level) Small text version A way home A way to search

    Homepage and Forms

    Homepage is not like the other pages- sometimes it makes sense not touse the persistent navigation there.

  • 8/8/2019 Book Dont Make Me Think


    Forms: Its useful to have a minimal version of the persistent navigationwith just the Site ID, a link to Home, and any Utilities that might help me fill

    out the form.

    Just click your heels three times and say, There s no place likehomeTheres an emerging convention that the Site ID doubles as a button that

    can take you to the sites Home page. It s a useful idea that every siteshould implement, but a surprising number of users still arent aware of it.

    include a Home page link in either the Sections or the Utilities, or add the word Home discreetly to the site ID everywhere but the Home

    page to let people know that its clickable.

    A way to search

    Unless a site is very small and very well organized, every page shouldhave either a search box or a link to a search page.

    Fancy wording: Search , not Find, Quick Find, Quick search, or KeywordSearch.

    Instructions: Type a keyword just makes you sound clueless. Option: Only give the option when it is useful.

    Secondary, tertiary, and whatever comes after tertiary

    I almost inevitably get a flowchart that shows a site four levels deep.

    I think this is one of the most common problems in Web design (especiallyin larger sites): failing to give the lower-level navigation the same attentionas the top. In so many sites, as soon as you get past the second level, thenavigation breaks down and becomes ad hoc. The problem is so commonthat its actually hard to find good examples of third-level navigation.

    The reality is that theres users usually end up spending as much time onlower-level pages as they do at the top. And unless you ve worked out top-to bottom navigation from the beginning, its hard to graft it on later andcome up with something consistent.

    The moral? It s vital to have sample pages that show the navigation for allthe potential level of the site before you start arguing about the colorscheme for the Home page.

    There are four things you need to know about page names: Every page needs a name

    The name needs to be in the right place The name needs to be prominent The name needs to match what I clicked

  • 8/8/2019 Book Dont Make Me Think


    You are hereThe common failing of You are here indicators is that theyre too subtle.

    They need to stand out: if they don t, they lose their value as visual cues

    and end up just adding more noise to the page. One way to ensure thatthey stand out is to apply more than one visual distinction-


    You are here: Home > Hobbies > Book Collection > WelcomeBreadcrumbs alone are a good navigation scheme. Breadcrumbs are se