I just finished reading Steve Krug’s book Don’t Make Me Think and I loved it. This post is meant to keep the highlights and annotations for reference, hope it helps you. Super enjoyable read, lots of puns, lots of good clean fun, an entertaining read and I would say it’s the most usable book I have ever hefted.

Don’t Make Me Think Book Cover

Even with this summary, I still think that nothing compares to reading this book, it’s a real page-turner, I read it in two days amidst a bunch of other things on my to-do list, this post is just for reference.

Chapter 1: Don’t Make Me Think

  • Use obvious naming conventions
  • Make sure buttons and links are obviously clickable
  • Minimize the question marks above your user’s head
  • Minimize the mental chatter in your user’s head

Great quotes

  • If you can’t make something self-evident [because it’s too novel], you at least need to make it self-explanatory.
  • Making every page self-evident is like having good lighting in a store, it makes everything better.

Chapter 2: How we really use the Web

  • Your webpage is a billboard going by at 60 mph
  • Web users don’t read, they scan because:
    • We are typically on a mission
    • We know we don’t need to read everything
    • We’re good at it
  • We don’t look for optimal choices when browsing:
    • People take the first choice that seems like it could work
    • If it doesn’t work they can go back (although it’s annoying)
  • We don’t figure out how things work; we just muddle through
    • People use things all the time without knowing how they work; they don’t need to
    • No one cares how something was meant to be used, we care about how it addresses our problem
    • By designing your site to have the right answers be the first thing they try, the users will feel smart and come back.

Great quotes

  • When we’re creating sites, we act as though people are going to pore over each page, reading all of our carefully crafted text, figuring out how we’ve organized things, and weighing their options before deciding which link to click. [Really they just glance, scan some and click the first thing that vaguely resembles the thing their looking for.]
  • If your audience acts like they want billboard design, then design great billboards.

Chapter 3: Billboard Design 101

  • Follow conventions, they are not boring, they are your friend. For example, Stop signs are visually consistent across the globe because people need to “get it.”
  • If you deviate from a convention make sure either:
    1. There is no learning curve
    2. Or, it’s so much better that a very small learning curve is justified
  • Use visual hierarchies
    • More important -> more prominent
    • Logically related -> visually related
    • Nesting helps group logically/visually
  • Use the same color for everything that’s clickable and don’t use that color anywhere else in text.
  • Minimize the three kinds of noise:
    • Shouting: if everything is calling for your attention it just gets overwhelming
    • Disorganization: failure to use grid patterns to delineate areas of the page is confusing
    • Clutter: too much stuff. Remove anything that isn’t making a real contribution
  • Text formating
    • Use plenty of headings. They help you read, scan, and skip large sections of text. In general, use more headings than you’d think.
    • Keep paragraphs short. Even one sentence can be appropriate on the web.
    • Anything that can be bulleted should be bulleted. Each bullet should have just a little bit of whitespace between them.
    • Highlight a small number of key terms so users can find them (don’t overdo it for obvious reasons)

Great quotes

  • Innovate when you know you have a better idea, but take advantage of conventions when you don’t.
  • You’ll often hear consistency cited as an absolute good. People win a lot of design arguments just by saying, “We can’t do that. It wouldn’t be consistent.” But clarity trumps consistency.
  • A good visual hierarchy saves us work by preprocessing the page for us.

Chapter 4: Animal, Vegetable, or Mineral?

  • 3 mindless clicks are roughly equivalent to 1 ambiguous click. The exception is if there is slow load time or if it’s a super common path
  • Users don’t ask themselves what the right answer is when faced with a question on a website, they ask themselves, “what do the website creators think the right answer is?” this is wasting the user’s time.
  • On the rare occasion when you feel guidance will be useful make sure:
    • The message is brief: providing the smallest amount of information that will help me
    • The message is timely: arriving exactly when I need it
    • The message is unavoidable: formatted so that I can see it
    • Example: In London at every crosswalk there is a large white lettered message painted on the road just off the curb saying “LOOK RIGHT” which is designed to help tourists who typically look left for oncoming traffic not realizing that it will come from the right. This fantastic example satisfies all three of Steve’s criteria from above.

Great quotes

  • It doesn’t matter how many times I have to click, as long as each click is a mindless, unambiguous choice.

Chapter 5: Omit needless words

  • Happy talk must die. Happy talk means talk about the site and what wonderful things blah, blah, blah if it doesn’t help the user achieve some objective, get rid of it
  • Instructions must die
    • Eliminate instructions by making things self-explanatory
    • When absolutely necessary, cut instructions back to the bare minimum
  • Reducing words has the following benefits
    • reduces the noise level on the page
    • makes what is useful more prominent
    • makes pages shorter

Great quotes

  • Get rid of half the words on each page, then get rid of the half of what’s left.
  • Happy talk is like small talk– content-free, basically just a way to be sociable. But most Web users don’t have time for small talk; they want to get right to the point. You can–and should–eliminate as much happy talk as possible
  • The main thing you need to know about instructions is that no one is going to read them–at least not until after repeated attempts at “muddling through” have failed.

Chapter 6: Street signs and Breadcrumbs

  • There are two kinds of users, browse first and search first
  • Purposes of navigation include
    • Help us find what we’re looking for
    • Tell us where we are
    • Tell us what else is here
    • Tell us how to use this site
    • Build our confidence in the site and the organization the site belongs to
  • Forms don’t need all sticky navigation bars because the objective is to get the form filled. Only include what will help with that objective
  • Most people expect the site id to take you home
  • Notes about search bars
    • Use the word “search” (not “find”, “quick find”, “keyword search” or anything else, just “search”)
    • No instructions of any kind
    • Don’t provide options
    • If you can search within a scope, only offer that when the user needs it like if they get a search that returns a lot of results
  • Lower level navigation needs the same attention as higher-level nav
  • About page names:
    • In Los Angeles, street signs are massive, so should your page names be
    • Every page needs a name
    • The name should clearly be clumped visually with what it’s naming
    • Make it prominent, generally the largest text on the page
    • The link to the page, must match the title
  • “You are here”
    • Make sure that each page provides the necessary information to give a user their bearings
  • Don’t make anything subtle, designers like to do subtle things because it shows thought in good design. But users are in way too much of a hurry.
  • Breadcrumbs:
    • Should show a path from home to wherever you are in a site
    • Should be at the top of a page
    • use the ‘>’ symbol to delineate each level
    • Boldface the last item, not clickable (because it’s where you are currently)
  • Tabs are super underrated and here’s why
    • They’re self-evident (no matter how computer illiterate you are, you have seen tabs before)
    • They’re hard to miss
    • They’re slick (they add a lot of flash to a web site)
    • The selected tab must be both in the visible foreground and a different color
  • Every page of every site needs to have the following easily identifiable to the user:
    • Site Id
    • Page name
    • Sections (primary nav)
    • Local nav
    • “You are here” indicators (breadcrumbs, selected tabs, highlighted nav bars etc)
    • Search

Great quotes

  • Home pages are like the North Star because they serve as a fresh start. So make sure each page has an obvious way home.
  • If you think a visual cue is sticking out like a sore thumb, it probably means you need to make it twice as prominent.
  • Hansel dropped breadcrumbs so that they could find their way back home… eventually the tale devolves into attempted cannibalism, grand larceny, and immolation, but basically it’s a story about how unpleasant it is to be lost.

Chapter 7: The Big Bang Theory of Web Design

  • Basically, the home page has a lot of responsibilities and the most often neglected is to make it completely clear what exactly the site is.
  • Any user should be able to answer the following 4 questions when they get to your home page:
    • What is it?
    • What can I do here?
    • What do they have here?
    • Why should I be here and not somewhere else?
  • Make sure visitors are clear on the big picture
  • Ways to get the message across
    • Have a 6-8 word tagline that no one else in the world could use but you and conveys your value proposition. It should be personal, lively and sometimes clever
    • The tagline should be right next to the site id
    • Use a welcome blurb: a terse, informative summary of the main point of the site that is placed conspicuously
    • A learn more video (people tolerate videos a lot more than text)
    • Never use a mission statement. It’s meaningless to users
    • Use as much space as is necessary, but not too much
  • Make it clear what you want the user to do

Great quotes

  • All too often, no one has a vested interest in getting the main point across
  • Innovative products and business models tend to require a fair amount of explanation, often more than most people have the patience to bear. But people have become accustomed to watching short videos on their computers and mobile devices. As a result, people have now come to expect a short explanatory video on most sites and are often willing to watch them.
  • A good tagline is one that no one else in the world could use but you.

Chapter 8: “The Farmer and the Cowman Should Be Friends”

  • There is no average user
  • There are many things that are clearly wrong, they just don’t typically come up during arguments

Great quotes

  • All web users are unique and all web use is basically idiosyncratic
  • Usability testing tends to move people away from the religious debate about what people like or don’t like and into the realm of what works or doesn’t work.

Chapter 9: Usability testing on 10 cents a day

  • Focus groups are good for getting opinions from potential users in the abstract whereas usability testing allows you to watch a person attempt to complete something
  • Bottom line. Test three users, one time per month, invite everyone that you can to view the usability test, have good treats/high-quality pizza to make sure the observers attend, debrief over lunch focusing only on the most serious issues that the test uncovered, then do it again next month
  • Don’t over qualify your participants, usability issues are not domain-specific, anyone should be able to spot them, you just can’t because you, the developer, have been looking at it for too long
  • Pay about $50-$100 per participant, this will help increase the likelihood of them showing up which is important if you are having a lot of people attend to watch live in the next room
  • Most common problems include:
    • Too much noise for the user to understand
    • Users are unclear on the concept of the site (Unique Value Prop)
    • The words that they are looking for aren’t there
  • Always debrief and make an action plan for the three biggest problems

Great quotes

  • The main thing [usability testing] ends up doing is revealing that the things we were arguing about weren’t all that important. Agonizing over which color drapes are best only to realize you forgot to install windows.
  • A simple test early–while you still have time to use what you learn from it–is almost always more valuable than an elaborate test later.
  • You can find more problems in half a day of usability testing than you can fix in a month.
  • It’s much more important to do more rounds of testing than to wring everything out of each round.

Chapter 10: Mobile, It’s not just a city in Alabama anymore

  • I didn’t really get anything from this chapter

Chapter 11: Usability as a common courtesy

  • Things that diminish goodwill:
    • Hiding information that I want (phone numbers, shipping rates, prices)
    • Punishing me for not doing things your way (I should NEVER have to think about formatting data, SSN, phone number, credit card etc.)
    • Asking for information that you don’t need
    • Trying to shmooze me (disingenuous attempts to convince me that you care about me)
    • Putting sizzle in my way (a bunch of feel good marketing photos that burn through my time)
    • Your site looks amateurish (not just bad colors)
    • Pop-ups
  • Things that increase goodwill:
    • Knowing the main things that people want to do on your sight and making them obvious and easy
    • Tell me what I want to know, be upfront about costs, fees, outages, strikes, and anything you’d rather not be upfront about. You’ll lose points for some but gain points for candor.
    • Save me steps wherever you can (don’t offer to track my package, just put the link in the confirmation email)
    • Put effort into it (go the extra mile to solve my problem)
    • Know what questions I am likely to have and answer them
      • Just make sure that they are legitimate FAQs not marketing schemes
      • Make sure they are up to date
      • Make sure they are candid, FAQs are where you’ll find questions you’d rather they hadn’t asked but that candor again goes a long way
    • Provide me with comforts like printer-friendly or sharing-friendly features
    • Make it easy to recover from errors
    • When in doubt, apologize

Great quotes

  • “Sincerity: that’s the hard part. If you can fake that, the rest is easy.” -Hollywood Agent Joke
  • Don’t make me jump through hoops just because you don’t want to write a little bit of code.

Chapter 12: Accessibility and you

  • Make sure that your font size is not fixed so that people can enlarge it easily without having to zoom
  • Make sure that you address the usability problems that confuse everyone
  • Use the alt tags on images
  • Research the works of Janice (Ginny) Redish and other resources for accessibility

Great quotes

  • [Accessibility is] profoundly the right thing to do, because the one argument for accessibility that doesn’t get made nearly often enough is how extraordinarily better it makes some people’s lives. For example: blind people with access to a computer can now read almost any newspaper or magazine on their own. Imagine that.

Chapter 13: Guide for the perplexed

  • Be willing to conduct experiments on your own if you don’t have the support you need
  • Get your boss to watch a live usability test (they’ll be blown away at how different it is from what they expected)

Great quotes

  • I am the Lorax, I speak for the trees USERS.