- Don’t make me Think! Krug’s First law of Usability
- How we really use the web Scanning, satisficing, and muddling through
- Billboard Design 101 Designing for scanning, Not Reading
- Animal, Vegetable, or Mineral ? Why users like mindless choices
- Omit Needless Words The art of not writing for the Web
THINGS YOU NEED TO GET RIGHT
- Street signs and Breadcrumbs Designing navigation
- The Big Bang Theory of Web Design The importance of getting people off on the right foot
MAKE SURE YOU GOT THEM RIGHT
- The Farmer and the Cowman Should be Friends Why most arguments about usability are a waste of time, and how to avoid them
- Usability Testing on 10 cents a day Keeping testing simple—so you do enough of it
LARGER CONCERNS AND OUTSIDE INFLUENCES
- Mobile: It’s not just a city in Alabama anymore Welcome to the 21st Century. You may experience a slight sense of vertigo
- Usability as common courtesy Why your Web site should be a mensch
- Accessibility and you Just when you think you’re done, a cat floats by with buttered toast strapped to its back
- Guide for the perplexed Making usability happen where you live
First Law of Usability-Don’t Make Me Think!: The primary principle in UI/UX design is to make interfaces self-evident and intuitive. Users should be able to understand a website or app without expending much effort in thinking about how to use it.
Eliminate Question Marks: Unnecessary elements, like cute or clever names, unclear links, or buttons, can create confusion. The goal is to reduce cognitive workload by eliminating elements that make users pause and think.
Self-Evident Design: The ideal design makes every page or screen self-evident, allowing the average user to know what it is and how to use it without much thought. This involves using clear names, intuitive layouts, and easily clickable elements.
Self-Explanatory as a Compromise: In cases where complete self-evidence is challenging, settle for self-explanatory design. While it may require a bit of thought, the overall understanding should be easily achievable through thoughtful design elements.
Importance of Clarity: Good design is akin to good lighting in a store; it enhances the overall user experience. Clarity and ease of use contribute to a sense of effortlessness, whereas confusing elements can drain user energy and time.
• Effortless Interaction is Key: Users should be able to interact with a website or app effortlessly. The less users have to think about navigation and functionality, the more likely they are to engage with and appreciate the design.
• First Impressions Matter: Since users spend less time on pages than designers may imagine, the initial glance should provide a clear understanding. A self-evident design ensures that users quickly grasp the purpose and functionality, making the first impression positive.
• User Empathy is Crucial: Understanding the user’s perspective and minimizing unnecessary cognitive load is crucial in design. Consider how users will perceive and interact with each element to create a user-friendly experience.
Realities of Web Use: Designing effective web pages requires understanding three key facts about real-world web use:
Scanning Behavior: Users scan pages because they are typically on a mission, seeking to accomplish tasks quickly. Scanning allows users to find relevant information efficiently, focusing on words and phrases that match their interests or tasks.
Satisficing Decision-Making: Users often satisfice, choosing the first reasonable option instead of thoroughly evaluating all choices. Time constraints, efficiency, and the low cost of clicking the “Back” button contribute to this behavior.
Muddling Through: Users frequently use products and technology without a deep understanding of how they work. Muddling through is common, and users may have inaccurate or incomplete ideas about the functionality of tools like web browsers.
• Design for Scanning: Since users tend to scan rather than read, design pages with attention-grabbing elements and clear, concise information that can be quickly absorbed.
• Consider Satisficing: Understand that users may not always make optimal choices. Design interfaces that make the first reasonable option clear and easily accessible.
• Account for Muddling Through: Recognize that users often muddle through without a deep understanding. Design interfaces that are intuitive and minimize the need for explicit instructions.
• User-Centric Design: Prioritize designing for the user’s behavior and preferences rather than expecting users to conform to idealized models.
Clear Page Structure:
Clickable Elements:
Reduce Visual Noise:
Format for Scanning:
• Prioritize Clarity over Complexity: Users prefer clear and organized pages. Avoid visual noise and unnecessary distractions to provide a focused and pleasant experience.
• Make Clickable Elements Obvious: Users should easily identify clickable elements. Consistent formatting and color schemes contribute to a user-friendly interface.
• Understand Scanning Behavior: Users often scan for specific information. Use formatting techniques like headings and lists to make content scannable and easy to digest.
• Simplify Paragraphs: Long paragraphs can be daunting. Break them into shorter, digestible segments to improve readability and aid scanning.
• Ginny Redish’s Book Recommendation: “Letting Go of the Words” by Ginny Redish is highly recommended for learning about content scan ability and writing for digital screens.
Krug’s Second Law of Usability: “It doesn’t matter how many times I have to click, as long as each click is a mindless, unambiguous choice.
Debating Clicks vs. Difficulty: The number of clicks may not be as critical as the ease and clarity of each click. Users prefer mindless choices over complex decisions.
Scent of Information: Users follow the “scent of information,” relying on clear and unambiguous links that assure them they are on the right track.
Three Mindless Clicks Equal One Thoughtful Click: A rule of thumb suggesting that users tolerate multiple mindless clicks if each is effortless. Exceptions exist for repeated paths or slow-loading pages.
The “Animal, Vegetable, or Mineral” Analogy: Explains the concept of mindless choices using the example of the simple yet clear question from the word game Twenty Questions.
Challenges in Web Choices: Users face challenges when presented with unclear choices on websites, requiring thought and creating uncertainty.
Forms as a Source of Difficulty: Difficult choices often arise in forms, and providing guidance becomes crucial to enhance the user experience.
Just-in-Time Guidance: Brief, timely, and unavoidable guidance, such as tooltips or form field tips, can assist users when faced with difficult choices.
Example from Street Corners: London’s “LOOK RIGHT” signs offer a real-world example of just-in-time guidance, emphasizing brevity, timeliness, and unavoidability.
Importance of Mindless Choices: Making choices mindless is crucial for improving the ease of use on a website.
• Clarity Over Click Count: Users prioritize clear and effortless choices over minimizing the number of clicks.
• Scent of Information: Clear and unambiguous links contribute to user confidence in navigating a website.
• Just-in-Time Guidance: Provide brief, timely, and unavoidable assistance when users face difficult choices, similar to street signs.
• Forms Require Careful Design: Forms should be designed to minimize difficult choices, and when unavoidable, offer clear guidance.
• Mindless Choices Enhance Usability: Simplifying and making choices mindless is a key factor in creating a user-friendly website.
Krug’s Third Law of Usability: “Get rid of half the words on each page, then get rid of half of what’s left.”
E.B. White’s Rule: “Omit needless words,” emphasizing the importance of concise and clear writing.
Problem with Excessive Words: Many web pages have unnecessary words, creating noise and making pages appear more complex.
Benefits of Removing Unnecessary Words:
Reduces noise on the page.
Highlights useful content.
Shortens pages for better visibility without scrolling.
Happy Talk: Refers to unnecessary introductory text that often lacks useful information. Users prefer content that gets straight to the point.
Instructions Must Be Minimal: Users are unlikely to read lengthy instructions. Strive for self-explanatory design and minimize instructions.
Eliminate Happy Talk and Excessive Instructions: Users value content that is concise, clear, and directly relevant to their needs.
• Conciseness Matters: Try for briefness in web content to enhance user experience.
• Clarity Over Volume: Users prefer clear, concise information over excessive words.
• Avoid Happy Talk: Eliminate content that lacks substance or useful information.
• Instructions Should Be Minimal: Users are more likely to engage with content that is self-explanatory.
• Constant Pruning/ cropping: Regularly review and prune content to maintain clarity and relevance.
Navigation Beyond the First Two Levels: Lower-level navigation often gets neglected in web design, leading to breakdowns and ad hoc structures. This is a common issue, but it’s crucial to address for a seamless user experience.
Challenges in Multi-Level Navigation:
Importance of Lower-Level Navigation: Users spend considerable time on lower-level pages. It’s challenging to retrofit consistent navigation later if not planned from the beginning.
Street Signs Analogy: Page names are compared to street signs. They guide users and help them understand their location on a website.
Four Aspects of Page Names:
“You Are Here” Concept: Navigation should indicate the user’s current location on the website hierarchy, aiding in orientation.
Effective Techniques for Indicating Current Location:
Breadcrumbs Best Practices:
Tabs as Navigation Elements: Tabs are praised for their self-evident nature, visibility, and visual appeal. They act as a clear division between navigation and content.
Tabs Best Practices:
Trunk Test: An acid test for web navigation effectiveness. Simulates being dropped onto a random page within a site. Users should quickly identify key elements like site ID, page name, sections, local navigation, “You are here” indicators, and search options.
• Consistency Across Levels: Lower-level navigation requires as much attention as top-level navigation for a seamless user experience.
• Page Names as Guides: Treat page names like street signs, guiding users through the web landscape.
• Clarity in Current Location: Users should always be aware of their location on the website, akin to a “You Are Here” indicator on a map.
• Breadcrumbs as Navigational Aids: Breadcrumbs provide a clear path from the home page to the current location, aiding in navigation, especially in large sites.
• Tabs for Division and Visibility: Tabs serve as an effective visual division between navigation and content, offering a clear and visually appealing interface.
Effective Communication of Purpose:
The Power of Taglines:
When to Skip a Tagline:
own or household name sites might skip a tagline, but even they can benefit from a concise message.
The Fifth Question:
Avoiding Over-Promotion:
Tragedy of the Commons in UI/UX Design:
Preserving the Home Page:
• Clarity in Communication: Clearly communicate the site’s purpose on the Home page using concise and easily absorbable messages.
• The Power of Taglines: Utilize taglines effectively to summarize the site’s purpose and benefits. Ensure they are clear, concise, and differentiating.
• Knowing Where to Start: Design the Home page to guide users on where to start for searching, browsing, or accessing the best content.
• Avoiding Over-Promotion: Be cautious about promoting too many elements on the Home page, as it can lead to clutter and reduced effectiveness.
• Understanding the Tragedy of the Commons: Recognize that overuse and over-promotion of the Home page can harm its overall effectiveness, impacting all sections negatively.
Usability Debates and Gridlock:
Personal and Professional Perspectives:
Cultures of Hype and Craft:
Myth of the Average User:
The Pitfall of One-Dimensional Likes and Dislikes:
Antidote: Usability Testing:
Task-Based Testing: The chapter emphasizes the importance of task-based usability testing, where real users are observed while attempting specific tasks on a website. This method provides valuable insights into user behavior and helps identify usability issues.
Thinking Aloud: Encouraging users to “think aloud” during testing sessions allows designers to understand their thought processes, challenges, and reactions, providing deeper insights into user experiences.
Common User Issues: Usability tests often reveal common problems such as users being unclear on the concept, missing desired information, or feeling overwhelmed by too much on the page.
Probing Questions: After task completion, asking probing questions helps uncover user perceptions, thoughts about specific elements on the page, and any confusion they might have experienced.
Debriefing and Prioritization: After testing, a debriefing session with the team helps prioritize identified issues. It’s crucial to focus on fixing the most serious problems first rather than attempting to address everything at once.
Low-Hanging Fruit: Keep a separate list of easy-to-fix issues known as “low-hanging fruit” that can be quickly addressed without extensive resources.
Avoid Adding Complexity: Resist the urge to add explanations or features in response to usability issues. Sometimes, simplifying or removing elements is more effective than adding more complexity.
Remote Testing: The chapter introduces the concept of remote testing, where participants engage in usability tests from their own locations using screen sharing. This approach can be more convenient for participants and expand the recruiting pool.
Unmoderated Remote Testing: Services like UserTesting.com allow unmoderated remote testing, where users record themselves while performing tasks. While lacking real-time interaction, this method is cost-effective and requires minimal effort.
• Task-Focused Design: Designers should prioritize creating websites that facilitate users in accomplishing specific tasks easily and efficiently.
• User Empathy: Understanding user behavior, preferences, and challenges is crucial for effective design. Usability testing provides direct insights into the user experience.
• Simplicity Over Complexity: Strive for simplicity in design. Avoid clutter and unnecessary complexity on web pages. Users often appreciate straightforward and intuitive interfaces.
• Prioritization of Fixes: Not all issues need immediate attention. Focus on fixing the most critical usability problems first before addressing minor issues.
• Continuous Improvement: Usability testing is an iterative process. Regularly testing and refining designs based on user feedback is key to continuous improvement.
Fun vs. Usability: The chapter highlights the balance between creating fun and innovative interactions in apps and ensuring ease of use. Some apps with creative features may be challenging for users to learn.
Training and Help: Many apps lack effective training and help features, leading to user frustration. The example of the Clear app demonstrates that even well-designed training may not be sufficient for all users.
Task Complexity: Users may struggle with apps that involve multiple levels and unconventional functions. Clear’s difficulty in usability testing indicates the challenge of navigating between different levels.
Memorability: The chapter introduces the concept of memorability, emphasizing that users should remember how to use an app after the initial learning phase. Difficult-to-remember interfaces may result in users abandoning the app.
Mobile Usability Testing: Usability testing on mobile devices shares similarities with desktop testing but involves additional logistical challenges. Setting up mobile testing requires considerations such as camera placement, participant movement, and screen capturing.
Mobile Testing Logistics: Issues such as whether participants can use their devices, how the device is held, and what observers need to see must be addressed in mobile testing logistics.
Screen Recording Challenges: Mobile testing faces challenges in screen recording due to the absence of robust screen recording and sharing apps for mobile devices.
Suggested Solutions: The chapter suggests using a camera pointed at the screen for mobile testing, attaching the camera to the device for natural movement, and prioritizing screen visibility over capturing participant faces.
Memorability Impact: The impact of memorability on app adoption is discussed, emphasizing the importance of making interfaces clear and easy to learn initially.
•Balancing Act: Designers should balance innovation and usability, ensuring that creative features don’t compromise the ease of use for the majority of users.
• Effective Training: Training features should be comprehensive and easily accessible. The example of Clear illustrates that even with good training, usability challenges may persist.
• Consider Task Complexity: Be mindful of the complexity of tasks within the app, especially when involving multiple levels or unconventional functions.
• Prioritize Memorability: Aim to create interfaces that are easy to remember. If users struggle to relearn an app every time, it may lead to frustration and abandonment.
• Logistical Considerations: In mobile testing, consider logistics such as camera placement, participant movement, and capturing both the screen and user gestures.
• Screen Recording Solutions: Until better technology is available, use a camera pointed at the screen for mobile testing to capture user interactions effectively.
Introduction to Mensch Concept: The chapter introduces the concept of “mensch,” a Yiddish term for a person of integrity and honor. It emphasizes the importance of sincerity and doing the right thing in web design.
Personal Experience: The author shares a personal experience with an airline website that failed to provide information about an impending strike. The lack of transparency and consideration for users’ concerns led to a depletion of goodwill.
Reservoir of Goodwill: The chapter suggests imagining users entering a website with a reservoir of goodwill. Each problem encountered diminishes this reservoir, affecting user satisfaction and potential negative outcomes.
Things That Diminish Goodwill:
Things That Increase Goodwill:
• User-Centric Approach: Prioritize the user’s needs and make essential actions easily accessible.
• Transparency is Key: Be transparent about information users care about, even if it’s not favorable. Honest communication builds trust.
• Efficiency Matters: Streamline processes to save users time and effort. Consider user convenience in every design decision.
• Invest in Quality: Put effort into content creation, presentation, and overall website appearance. A polished and professional design fosters a positive user experience.
• Anticipate User Needs: Understand user expectations and provide clear answers to potential questions. Frequently Asked Questions (FAQs) should genuinely address common user queries.
• Comfortable Experience: Offer creature comforts like printer-friendly pages and easy error recovery options to enhance the overall user experience.
• Apologize When Necessary: When unable to meet user expectations, acknowledge the limitations and apologize. Transparent communication during shortcomings can maintain goodwill.
Common Reasons for Ignoring Accessibility:
The Central Argument for Accessibility:
Concerns of Designers and Developers:
Challenges and Complexity:
Immediate Actions for Improvement:
Importance of Usability for Accessibility:
• Moral Imperative: Accessibility is not just a legal requirement; it’s a moral obligation to make digital experiences better for everyone.
• User Testing: Observing users with disabilities provides invaluable insights into their challenges and needs.
• Educational Resources: Books and articles on accessibility help designers and developers understand the principles and laws governing accessibility.
• Practical Changes: Immediate actions include adding alt text, using proper headings, ensuring form accessibility, providing keyboard navigation, and selecting accessible templates.
• Usability and Accessibility Connection: Usability improvements benefit all users and are foundational for successful accessibility.
Usability as User Advocacy:
Challenge of Manipulation:
Ethical Influence is Acceptable:
Caution Against Deception:
Definitive Guidelines:
Importance of Accessibility:
Reminder of Responsibility:
• User Advocacy: Understand that the core of usability is advocating for users and enhancing their experience with products.
• Ethical Influence: Learn principles of ethical influence, such as those presented in books like “Influence: The Psychology of Persuasion” by Robert Cialdini.
• Avoid Deceptive Practices: Be cautious about using usability tests to manipulate perceptions or engage in practices that may deceive users.
• Definitive Guidelines: Pay attention to specific guidelines like avoiding small, low-contrast type and not placing labels inside form fields without careful consideration.
• Accessibility Matters: Prioritize accessibility to ensure usability for a diverse range of users.
• Balancing Rules and Creativity: Recognize the importance of adhering to fundamental usability principles while allowing room for creative deviations when necessary.