featured design, mobile
Better for All: Equal Accessibility
Considering accessibility in design and development not only helps you connect with a wider audience, it can also be a catalyst for innovation. Equal accessibility is about finding ways to adapt and adjust your design to create a better user experience for everyone.
In the latest installment of our 'Better for All' series, we're looking at how designers can address ableism—discrimination in favor of able-bodied people—by putting accessibility at the center of their work, ultimately creating better designs. Here are some considerations to help you understand accessibility, its scope, and how accessibility can create better user experiences.
The Four Pillars of Accessibility
To help make the web accessible to people living with disabilities, the Web Accessibility Initiative (WAI) develops guidelines, technical specifications, and educational resources that are a trusted international standard designers and developers can reference. Their Web Content Accessibility Guidelines are organized around four principles to foster accessibility, known as POUR: perceivable, operable, understandable, and robust.
- Perceivable is how your content is absorbed by users. For example, information presented visually isn't perceivable to everyone.
- Operable addresses how users can navigate the content. Certain UI components, like the hover interaction, cannot be operated by someone who can't use a mouse or touch screen.
- Understandable emphasizes simplicity and consistency. The content you create should be communicated in a way that avoids confusion.
- Robust promotes access to content by a wide variety of user agents (browsers). It's important that the content is compatible with assistive technology.
For more information and best practices to help improve the accessibility of your content, reference the Web Content Accessibility Guidelines (WCAG) 2.0.
Hierarchy in Typography is Important
Your design should allow for information to be absorbed quickly. Good typography establishes a strong visual hierarchy, provides a graphic balance, and sets the overall tone. A text hierarchy that visually calls out key information in larger, bolder text helps to improve the experience for people who have difficulty retaining lots of information or have a visual condition.
Create Text Blocks to Improve Readability
For people who have difficulty reading or seeing, long lines of text can become a significant barrier to comprehension. Here are some ways to improve readability when dealing with design for long blocks of text.
- Provide extra space between lines and paragraphs to make it easier to track the next line and to recognize the end of a paragraph.
- Use several different line breaks, such as space-and-a-half and double-spacing.
- Create narrow blocks of text to help improve readability.
- Avoid using justified text which can create uneven enlarged spaces between words, sometimes known as “rivers.”
Design Text to Work with the Zoom Function
Users with low vision may prefer to have their browser resize text or zoom into page content to make it easier to read. The ability to zoom in 200% supports a wide range of designs and layouts and complements older screen magnifiers. Zooming in above 200% resizes text, images, and layout regions and creates a larger canvas that may require both horizontal and vertical scrolling.
Optimize Color Contrast between Foreground and Background
The WCAG states that your text should have at least a 4.5:1 contrast ratio to achieve an AA rating and a 7:1 contrast ratio to achieve an AAA rating. The AA rating compensates for the loss in contrast sensitivity usually experienced by users with vision loss equivalent to approximately 20/40 vision, which is common for those roughly 80 years old. There are online tools for checking color contrast, like this one by WebAIM.
The AAA rating compensates for users with vision loss equivalent to approximately 20/80 vision. People with more than this degree of vision loss typically use assistive technologies to access their content, which usually have contrast-enhancing and magnification capabilities built in.
Design plays a big part in how we perceive our world and improving how we can interact with it. Considering accessibility in your design is an important step towards addressing ableism to build a world where we all feel welcome.
We hope you find the advice in this series helpful in shaping your design-thinking, to help you create a more diverse, inclusive, and accessible world.
Follow us on Twitter at @samsung_dev for more tips on designing and developing for Samsung.
Want to read more from the 'Better for All' series?
Here are the links to the other installments in this series.