The complete checklist to create accessible designs

A Simple Yet Effective Guide

The Complete Checklist To Create Accessible Designs

If you are designing a new website from scratch or updating an existing design, accessibility is very important in this day and age.

Website accessibility is best understood and implemented when you clearly know the use case you are designing for.

That is why we have separated website accessibility features according to different disabilities. Keep in mind that many of the items here will benefit more than one use case. We've just picked the best one.

For individuals with visual disabilities, designers should -

  1. Provide descriptive alt text for images, ensuring that screen readers can accurately convey the content of the image. 

  2. Ensure sufficient color contrast between text and background colors to make it easier for individuals with low vision to read.

  3. Allow text resizing options.

  4. Ensure that all interactive elements can be accessed and operated using only a keyboard.

  5. Don't use color as the only way to convey information. Instead, use thick borders, bold text, italics, and underlining in your designs.

  6. Use labels in forms, written below the desired input space.

  7. Use semantic HTML, which provides meaningful structure and labels to web content. This helps individuals using assistive technologies to navigate and understand the content more easily. 

  8. Create responsive designs that ensure the website or application adapts to different screen sizes and orientations, making it accessible to individuals using different devices.

For individuals with hearing disabilities, designers should -

  1. Provide subtitles or captions for multimedia content. This allows them to understand the audio content. 

  2. Offer adjustable volume levels and mute options. Helpful for those who may have difficulty hearing certain frequencies. 

  3. Provide text transcripts of audio content.

Cognitive disabilities can affect an individual's ability to process and understand information.

For individuals with cognitive disabilities, designers should -

  1. Keep navigation simple and intuitive, avoiding complex menus or confusing layouts. 

  2. Maintain a consistent layout throughout the website or application helps individuals with cognitive disabilities to navigate and find information more easily. 

  3. Use readable fonts (avoid italics) and provide clear error messages to help individuals to comprehend the content and complete tasks successfully. 

  4. Use plain language, avoid jargon or complex terminology, aiding individuals to understand the information.

For individuals with dexterity disabilities, designers should -

  1. Ensure that interactive elements, such as buttons or links, have a sufficient touch target size. This allows individuals with limited fine motor control to accurately select the desired element. 

  2. Offer keyboard shortcuts as an alternative input method, this benefits individuals who have difficulty using a mouse or touch screen. 

  3. Support various input methods, such as voice commands or alternative pointing devices.

Individuals with seizure disorders may be sensitive to flashing or rapidly changing content. Designers should avoid using flashing animations or provide options to pause or disable such content to prevent triggering seizures.

For individuals with speech or language disabilities, designers can -

  1. Implement speech recognition technology to allow users to interact with the website or application using their voice. 

  2. Enable voice commands as an alternative input method.

Remember, prioritizing accessibility in the design process is a continuous effort towards creating digital experiences that are inclusive for individuals with disabilities. 

By adhering to this comprehensive checklist, designers can ensure that their designs cater to those with visual, hearing, cognitive, dexterity, seizure, and speech or language impairments. 

It is important to note that accessible designs not only meet legal requirements but also broaden the user base, foster inclusivity, and showcase a dedication to social responsibility. 

You can also use Wally, to make your designs easily accessible. Wally lets you automatically implement all the above points, if you choose to do so. 

Many designers have now taken advantage of Wally. Try Wally on a completely Free-Trial today.

By creating accessible designs, let us contribute to a more inclusive digital world for all.


Resources:

https://learn.microsoft.com/en-us/windows/win32/uxguide/inter-accessibility

https://lucidspark.com/blog/designing-for-accessibility-best-practices

https://medium.com/salesforce-ux/7-things-every-designer-needs-to-know-about-accessibility-64f105f0881b