Story Intro

Putting users first should always be at the forefront of a web developer's mind when designing a website. Unfortunately, sometimes developers accidentally create inaccessible websites that alienate different user groups and exclude them from fully utilizing a website. For many of us, we don't think twice about going online and navigating through different websites, but for the millions of users around the world with disabilities, this process can be difficult and frustrating. As a web designer, it is essential to acknowledge these challenges and realize accessibility concerns should also go beyond users with a disability and focus on all users for 100% inclusivity.

Body

Accessibility Affects Everyone

If something is accessible, it means it easy to get to and readily usable. The concept of accessibility has moved away from a term just associated with people with physical or cognitive disabilities. It has expanded to include everyone since we all experience some form of functional limitations when navigating through modern technology. Functional limitations are encountered everywhere; it could be trying to hear a phone call in a noisy office, attempting to access a website as an ESL user, and many more scenarios that make it difficult for users to navigate the website even without a disability.

WAI-ARIA

WAI-ARIA (Web Accessibility Initiative - Accessible Rich Internet Applications) gives specifications and defines how to make website content and applications more accessible. Some of the accessibility patterns discussed below are examples the W3C Working Group provides using ARIA.

Keyboard Interface

For a webpage to be completely accessible, all interactive components must be operable by the keyboard. Many people rely on a keyboard, so providing an efficient and enjoyable experience to keyboard-only users is a huge part of your website's accessibility.

Accessibility Patterns 

Buttons: A button is a widget that users can click to activate another action or event. A navigation menu button provides a menu of items that work as links when clicked on. An action menu button opens a menu of actions or commands. An example of an accessible button pattern would be a "mute" toggle button that allows users to silence any sound or media, which can be important depending on the user's environment.

Carousel: A carousel displays slides sequentially that can either be prompted by a button or the rotation can automatically start when the website loads. Making these carousels accessible is extremely important, so users don't get frustrated with the rotation speed or pattern and to avoid confusion when trying to understand information. Some features essential to providing an accessible carousel are:

  • Buttons for navigating between previous and next slides
  • An option to choose which slide to display
  • An option to stop or restart the rotation
  • Stop rotations when keyboard focus enters slides or mouse hovers over the carousel

Alerts: An alert is an element that sends a brief but important message that gets the user's attention without interrupting their task. Alerts should not interfere with the user's task, so it is imperative that they do not interrupt keyboard focus. However, an alert dialog interrupts the user to display a message that needs a response before returning to their task.

Search Form: Accessibility is very important when designing a search bar. Including a search icon allows the user to recognize the search bar easily and get the information they desire faster. In addition, providing text in the search bar to guide the user on what they are expected to input to reach their goal can be helpful. An example is telling a user to input zip code, city, or an address to help find locations or products near them. Finally, making these search bars easily accessible for mobile devices is also essential. Some ways to make a search bar more accessible for mobile device users are to have a separate search page or hide the search bar behind an icon.

We Can Help!

Accessibility with 100% inclusivity is hard to achieve and often difficult for web designers to understand and implement fully. At New Target, we believe a website should address the needs of all users. Whether you have a disability, every user can run into some form of a functional limitation, so we place significant importance on accessibility when designing websites. To get started with making your website more inclusive, contact us today!

With offices in Washington, D.C. and Los Angeles, CA, New Target provides digital strategy, web design, web development, data integration, application hosting, and online marketing for prominent national associations, companies, and government agencies.

 

 

 

 

Share this