My review
Good
- It’s very easy and straightforward to read. Knowledge is practical. Lots of examples.
Can be improved
- The examples and some of the knowledge are outdated. I remember there’s a part where the author expressed doubts about flat designs, which has become so popular these days. And the screenshots of webs and apps look ancient.
Book notes
the Big Bang Theory of Web Design: the first few seconds you spend on a new Web site or Web page are critical.
The Homepage needs to include:
- Site identity and mission: what this site is, what it’s for, why I should be here.
- Site hierarchy: site overview, features, how it’s organized → persistent navigation
- Search
- Teases: hints of the good stuff
- Content promos: newest, best, most popular content
- Feature promo
- Timely content: shows that your site is not dead
- Deals: ads, cross-promotions, co-branding deals
- Shortcuts: most sought after content
- Registration
Homepage objectives:
- Show how to get what people want to look for
- Show wonderful things people don’t actively look for
- Show where to start
- Establish credibility and trust
Usual constraints:
- Stakeholders all want a piece of them on the front page.
- Everyone has opinions on the homepage.
- One size fits all (visitors).
People can click on any page within your site, not just the homepage. That’s why every page should orient people properly: give the right idea about who you are, what you do, and what your site has to offer. Also, very often, people will visit homepage to find out about you.
3 important places to find out what the site is about: tagline, Welcome blurb (terse description of site), Learn more (Short explanatory video). Not everyone will use these 3.
Keep it (the message) short, but long enough to get the point across, and no longer.
Don’t use a mission statement as a Welcome blurb. Many sites fill their Home page with their corporate mission statement that sounds like it was written by a Miss America finalist. “XYZCorp offers world-class solutions in the burgeoning field of blah blah blah blah blah…” Nobody reads them.
Show the Home page to people outside your organization to tell whether the design is getting this job done.
Tagline
Explain exactly what your site or your organization does. Just long enough, 6-8 words. Convey differentiation (value proposition) and clear benefit.
Example: Save time. Save money. Here for you. We bring good things. You’re in good hands. → They’re generic mottos, not taglines.
Personable, lively, sometimes clever.
Is tagline necessary? Probably not, but unless you’re well-known, a tagline is a chance to tell people why they’re better off at your site.
Where to start
Be clear about where to start if people want to search/browse/sample stuff. Label clearly: Search, Browse by category, Sign in, Start here.
The tendency to promote everything might clutter the Home page and affect the effectiveness of all other sections.
8. Arguments about usability
All Web users are unique and all Web use is basically idiosyncratic.
While designers want to create good-looking web/app and engineers want to create great features, there’s no average user. The clash of personal and professional opinions, finding outside expert, research, or focus groups.
There are no simple “right” answers for most Web design questions. What works is good, integrated design that fills a need — carefully thought out, well executed, and tested.
X: “Do most people like this pull-down menu?” Y: “Does this pull-down, with these items and this wording in this context on this page create a good experience for most people who are likely to use this site?”
There’s really only one way to answer this kind of question: testing.
9. Usability testing
Focus groups are good for getting a sampling of users’ feelings and opinions, determining wants, needs, and likes, but not for learning whether your site works. → The planning stages, before designing and building.
Usability tests (you observe people actually use things) help you detect and fix the things that confuse or frustrate users. → Entire process.
- Testing 1 user is better than none.
- Testing 1 early is better than 50 near the end.
One way to test more often, simply, and less expensively: test only 3 users, recruit them loosely, one morning a month, in an office or conference room, debrief with the team over lunch, and decide what to fix. This kind of testing isn’t to prove anything. It’s to improve. Actionable insights, not proof.
Unless your site requires specific domain knowledge and you have lots of time and money to recruit, you don’t need to be too precise about participants. You can find them in user groups, trade shows, Craigslist, Facebook, Twitter, customer forums, a pop-up on your site, friends, neighbors.
Resource: How to Recruit Participants for Usability Studies — NNGroup report.
Tools:
- Computer with Internet, mouse, keyboard, microphone
- Screen sharing software to observe from another room
- Screen recording software
- A facilitator who leads users through the test — should be patient, calm, and a good listener
Observation room with snacks to lure as many observers in as possible. Observers write down the 3 most serious usability problems they noticed during the session to share in the debriefing.
The book has detailed info about what to test, when, how to choose tasks, script to say during test, what to do during and after the test. There’s also a sample record of a test session (transcript, behavior description, video, along with analysis from the facilitator).
Typical problems
- Users don’t get it.
- Words users look for aren’t there.
- Too much. → Reduce overall noise or make things they need to see pop out more.
Alternatives: users doing it at their own home, or services like UserTesting.com.
10. Mobile
It’s all about constraints and trade-offs.
- Leave things out. Which one to leave out? One approach is to build mobile-first and include features/content that are most important to users.
- It’s ok to tap or scroll more, as long as it’s clear where to tap to get what you want.
Responsive design can be a lot of work, so at minimum: allow zooming, provide correct links, and provide a link to the full website (especially if it has info that isn’t available on the mobile site).
Affordance is a visual clue in an object’s design that suggests how we can use it.
- e.g. a box with a border → can click and type something
On mobile, there’s no cursor and hover.
Keep in mind that Internet speed might vary depending on where people are, so page speed and performance also need to be fast.
The author’s definition of usability:
A person of average (or even below average) ability and experience can figure out how to use the thing [i.e., it’s learnable] to accomplish something [effective] without it being more trouble than it’s worth [efficient].
Apps need to be delightful, learnable, and memorable. Can you complete tasks using the app? Will you remember how to use it the next time you try?
When testing users on mobile, you can set up a camera pointed at the screen (not the user’s face).
11. Usability as common courtesy
Each user has a reservoir of goodwill, and each problem they encounter on the site lowers its level. If you exhaust it, there’s a good chance they’ll leave, not eager to use your site, think less of your org, or savage you on social media.
That reservoir is idiosyncratic (some people have a large one, some small), and situational (people may be in a bad mood). You can refill it. A single mistake can empty it.
Things that diminish goodwill
- Hiding info: support phone number, shipping rates, prices
- Punishing users for not doing things your way: forcing them to enter dashes, spaces in data fields
- Asking for unnecessary info, especially personal info
- Shucking and jiving: faux sincerity, disingenuous attempts to convince users that you care
- Putting sizzle in the way: I’m in a hurry
- Amateurish-looking site
There may be times you choose to do something users don’t really want, like uninvited pop-ups — if statistics show it’s worth it, you can do it. Just be sure to make that business decision in an informed way.
Things that increase goodwill
- Make the main things people want to do obvious and easy.
- Be upfront about costs, fees, outages, etc.
- Reduce steps wherever you can.
- Put effort into it: useful information, presented clearly and organized so people can find it.
- Know the questions and answer them: keep FAQs up to date.
- Create printer-friendly pages.
- Make it easy to recover from errors.
- When in doubt, apologize.
12. Accessibility
There’s only one reason: it’s the right thing to do. We can improve people’s lives just by doing our job a little better.
Designers and developers often fear more work and compromise on design.
What you can do right now
- Test your site often and fix usability problems that confuse everyone.
- Read this article. They observed blind users using screen readers to do tasks on a variety of sites.
- Blind users scan with their ears, just like sighted users scan with their eyes.
- Read:
- A Web for Everyone: Designing Accessible User Experiences — Sarah Horton & Whitney Quesenbery
- Web Accessibility: Web Standards and Regulatory Compliance — Jim Thatcher et al.
- Go for the low-hanging fruit:
- Add alt text to every image
- Use headings correctly: convey useful info about logical organization and make it easy to navigate by keyboard
- Use
<label>elements to associate fields with text labels - Put a “Skip to Main Content” link at the beginning of each page
- Make content accessible by keyboard
- Ensure significant contrast between text and background
- Use an accessible template or theme
Guide for the perplexed
To convince management to support usability work:
- Demonstrate ROI: prove a usability change results in cost savings or additional revenue
- Speak their language: pain points, touch points, KPIs, CSI — not just “benefits for users”
- Get the boss to watch a usability test (best in person, or highlight clips)
- Do the first test yourself, on your own time, without asking for permission. Keep it simple and informal.
- Test competitive sites.
- Empathize with management: understand the position they find themselves in.
- Know your place in the grand scheme of things. Your primary role is to share what you know, not tell people how things should be done.
Recommended books:
- It’s Our Research: Getting Stakeholder Buy-In for User Experience Research Projects
- The User Experience Team of One: A Research and Design Survival Guide
- Influence: The Psychology of Persuasion — Robert B. Cialdini
Definitive answers
- Don’t use small, low-contrast type.
- Don’t put labels inside form fields.
- Make visited and unvisited text links distinct.
- Don’t float headings between paragraphs.