Web Usability Articles & Videos

  • Analyzing Good Designs: Ritual.com

    A close look at how complementary colors, visual hierarchy, and clean imagery come together to make Ritual.com's UI feel effortless.

  • Status Trackers: 6 Guidelines for Discoverability and Clarity

    Use these 6 guidelines to create status trackers that are easier for your users to find, access, and understand.

  • Grids 101

    Page grids use columns, gutters, and margins to structure content—boosting layout consistency, readability, and visual flow.

  • Test Keyboard Accessibility On Your Website

    Keyboard accessibility is crucial for inclusive web design. Test your site using only a keyboard to ensure clear focus states, access to all interactive elements, and logical tab sequences.

  • Buttons vs. Links: What’s the Difference and Why Does it Matter?

    Buttons trigger actions, while links navigate between pages, and using them correctly is key for clarity and accessibility.

  • Comparison Tables: 5 Scenarios When Not to Use Them

    Comparison tables are most effective when they’re used in the right context. Prevent unnecessary confusion by making sure a comparison table will help decision-making on your site.

  • Destination Pages vs. Transition Pages

    Destination pages fulfill users' information needs through detailed content, while transition pages guide them toward these destinations through navigation and brief overviews. Content prioritization based on user goals and information needs is key in designing both pages.

  • SEQ vs. SUS

    Pair qualitative methods with quantitative metrics like the System Usability Scale (SUS) for benchmarking and the Single Ease Question (SEQ) for task-level insights. Use both carefully with qualitative data.

  • Create Efficient Error Messages

    You need efficient error messages to keep users engaged in their workflow. Follow these four efficiency guidelines to design error messages that respect users' effort and offer time-saving guidance.

  • Error Messages: 4 Guidelines for Effective Communication

    Communicate effectively with your error messages by using human-readable language, concisely and precisely describing the issue, offering constructive advice, and not blaming the user.

  • Homepage Design: 4 Common Mistakes

    Enhance your homepage design by avoiding false floors, providing clear scrolling cues, adhering to familiar web standards, and creating a distinct visual hierarchy to focus user attention.

  • Breakpoints in Responsive Design: What & Why

    Breakpoints determine when a webpage may adjust to different layouts. They help designers (and developers) maintain layout consistency across multiple screen sizes, orientations, and devices.

  • Tabs vs. Accordions: When to Use Each

    Tabs and accordions organize and layer content on the same page. Tabs suit a few long sections, while accordions fit many short ones. Choose based on your content structure and user needs for optimal layout.

  • In-Page Links: 3 Usability Tips

    In-page links help users navigate to specific content sections on the same page. For effective use, use descriptive headings that match the destination, and clearly distinguish in-page links from other links.

  • Responsive Web Design: 3 Key Fundamentals

    Responsive web design adapts to various screen sizes while emphasizing developmental efficiency over device-specific designs. It's key to prioritize content based on different contexts of use across devices and create a cohesive experience for all users.

  • Cognitive Walkthroughs Help Assess Interface Learnability

    A cognitive walkthrough is a task-based usability-inspection technique used to evaluate the learnability of a system from the perspective of a new user.

  • Visual Treatments that Improve Accessibility

    To design accessible visuals, account for color contrast, don’t rely on color alone, and make interactive elements easy to identify.

  • Usability 101

    Usability assesses how easy user interfaces are to use. Usability is defined by 5 quality components: learnability, efficiency, memorability, errors, and satisfaction.

  • 5 Tips for Augmented Reality Calibration

    Before users can use an AR app, they must often calibrate it first. Usability studies find many big problems in calibration designs that can prevent people from ever getting into the actual AR experience.

  • Design for Them Not for You (UX Slogan #13)

    It does not matter whether you like a design or whether you find the product easy to use. We must design for the way real customers actually behave.