Quantcast
Jump to content


Better for All: Equal Accessibility


Recommended Posts

2021-09-02-01-banner.jpg

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.”

Image showing accessible versus non-accessible typography

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.

Image showing correctly zoomed text

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.

Image showing optimal contrast

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.

View the full blog at its source

Link to comment
Share on other sites



  • Replies 0
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...





×
×
  • Create New...