7 principles of universal design

https://www.bitovi.com/blog/embrace-7-principles-of-universal-design-for-better-website-design

  1. Equitable Use
    • “The design is useful and marketable to people with diverse abilities.” For example:
    • High Contrast: Having high contrast helps both users with weak vision, and users simply standing in the sunlight.
    • Alt Texts: Screen readers need alt texts, of course, but they also help users on slow or unstable connections, and act as a fallback if the image path is broken.
    • Mouse-Only Interactions: Hiding information behind a mouse-only interaction (like hover or double-click) makes it impossible to access for many users. Devices without pointers are in the majority, which changes the interaction ‘abilities’ of your users regardless of their personal physical state.
  2. Flexibility in Use
    • “The design accommodates a wide range of individual preferences and abilities.” For example:
    • Scroll-Jacking: The arguments against scroll-jacking are often in line with this principle. If you take away the user’s ability to navigate your website at their own speed, they may not have time to take everything in. This can get frustrating, causing them to leave.
    • Text Resizing: Allow for the sizing up and down of text in your layouts. A simple browser or OS text adjustment shouldn’t ruin your beautifully crafted application.
  3. Simple and Intuitive Use
    • “Use of the design is easy to understand, regardless of the user’s experience, knowledge, language skills, or current concentration level.”
  4. Perceptible Information
    • “The design communicates necessary information effectively to the user, regardless of ambient conditions or the user’s sensory abilities.” For example:
    • Information Organization: Besides having adequate text contrast and sizing, breaking your information down into easily digestible pieces will make your content more accessible. Specifically, things like using subheadings in a long text post will make speed reading and skimming more effective.
    • Graphics: A graphic to emphasize a point you’re making in text helps more visual users (and can convince a skimmer to slow down and read more closely).
    • Charts and Graphs: Supplying both graph and table views of data allows users not only the flexibility to choose how to get information (#2 Flexibility in Use), but also can help make patterns in the data more discernible. Who doesn’t want that?
  5. Tolerance for Error
    • “The design minimizes hazards and the adverse consequences of accidental or unintended actions.” For example:
    • Avoiding Accidents: Account for these inevitabilities by putting permanent functions inside menus and/or behind “are you sure?” confirmation prompts. This makes them harder (practically impossible) to accidentally execute.
    • Allow for Undo: An alternative to prompting users all the time is to give them an “undo” option, or a way to dig into archives to retrieve old items.
  6. Low Physical Effort
    • “The design can be used efficiently and comfortably and with a minimum of fatigue.” For example:
    • Action Grouping: Group actions together in specific areas of the screen. This minimizes the amount of mouse dragging or thumb stretching needed, which is helpful for anyone. It is especially helpful for users with either very large screens, or for users who have super-zoomed into their operating system and have to scroll through interfaces that would normally fit on a “default” screen.
    • Minimize Requests: Don’t require users to fill out lengthy forms or jump through multiple ‘hoops’ to gain access to their goal (account creation, a trial period of your application, a sample of a new book etc.). The less effort you require, the more involvement you’ll get.
  7. Size and Space for Approach and Use
    • “Appropriate size and space is provided for approach, reach, manipulation, and use regardless of user’s body size, posture, or mobility.” For example:
    • Action Targets: Take into account varying hand size and dexterity, especially for one-handed mobile device use. Make action targets large enough to click or tap easily, and put your primary actions within easy reach.
    • Posture: Some users are walking down the street, laying in bed, or doing other things that may make their reach a challenge. We can’t assume all users are sitting in a chair, at a desk, with a keyboard and mouse.
    • Dynamic Spaces: Virtual keyboards (and other accessibility tools) cover part of the screen. Keep dynamic space usage in mind through all states of onscreen keyboards, dropdown menus, etc. to avoid causing the user to block their own actions forward.
Advertisements

Disability = mismatch between abilities and the world around you

“As he began to see it, disability wasn’t a limitation of his, but rather a mismatch between his own abilities and the world around him. Disability was a design problem.”

“Disability is an engine of innovation simply because no matter what their limitations, humans have such a relentless drive to communicate that they’ll invent new ways to do so, in spite of everything.”

https://www.fastcodesign.com/3054927/the-big-idea/microsofts-inspiring-bet-on-a-radical-new-type-of-design-thinking

 

What is the Web?

  • The web is made of code and must be designed, there- fore designing with code is working with the right materials. This is the best course of action.
  • Content — what we write or otherwise express via the web — must be subject to design thinking and, in fact, all other design decisions should facilitate that.
  • Web pages are not immutable artifacts. They should be tolerant of changing, dynamic content. This content should be managed in terms of discrete components which can be reused as agreed patterns.
  • The potential audience of a website or app is anyone hu- man. Inclusivity of ability, preference and circumstance is paramount. Where people differ — and they always do — inclusive interfaces are robust interfaces.

Heydon Pickering: Inclusive Design Patterns – Coding Accessibility into Web Design, p.11

 

AccessibilityOz uses the following design principles when analysing a current web site:

  • Matching experience and meeting expectation
  • Metaphor
  • Consistency – internal and external
  • Functional minimalism
  • Cognitive load
  • Engagement
  • Memory load
  • Functional layering
  • Visibility
  • Feedback and orientation
  • Direct manipulation
  • Mapping
  • Control, trust, and explorability
  • Error prevention, detection and recovery
  • Mousing and Fitt’s law
  • Affordance
  • Hierarchy of control
  • Spatial memory
  • Visual hierarchy
  • Natural reading order
  • Grouping
  • Visual weight
  • Visual balance
  • Visual minimalism
  • Visual rhythm and scanability
  • Aesthetics

http://www.accessibilityoz.com/services/accessible-user-experience/