Global Accessibility Awareness Day

May 20, 2021

The Global Accessibility Awareness Day is a one-day accessibility campaign to raise awareness for digital accessibility. It is on the 3rd Thursday of May, which for 2021 is May 20. It is encouraged that designers, developers, usability professionals take an hour to experience first-hand the impact of digital accessibility (or lack thereof).

Goals

  • Participate in the collective effort to improve digital accessibility,

  • Experience using different assistive technologies (e.g. keyboard, screen-reader),

  • Increase knowledge & application of accessibility best practices,

  • Integrate free accessibility tools into workflows (design, development, QA)

Activities

Outlined in this section are several activities that participants may choose from to spend their ‘hour’.

Funkify Simulator

You may spend your “hour” doing a variety of different exercises available within the Funkify Simulator. It may be disorienting to use this simulator for an extended period of time, so it is acceptable to do these for a few minutes each, and then switch to another exercise such as grayscale mode, screen magnification, or the No-Mouse Challenge.

No Mouse Challenge

Take one hour to “disconnect” your mouse and perform your daily activities using only the keyboard. This will give you an opportunity to experience your computer in a different way, observe how it is for you to navigate, input information, or activate controls such as buttons.

Common Keyboard Controls

The navigation and interaction keys you will need for this exercise are:

  • Tab: Moves through all elements on the page.

  • Shift + Tab Goes backwards through the elements on the page

  • Enter / Return This is the “go” key to follow a link, a-la- clicking a button via mouse

  • Spacebar Can be used toggle checkbox values

  • Arrow Keys: Use to go up and down a page, select a radio button or move between interactive menus, or tab panels

There are “power users” of keyboard-only interactions utilizing multiple keystroke shortcuts to improve their experience. This is not always possible without applying accessibility best practices.

Keyboard Settings

You may have to go into your computer’s settings to ensure maximum accessibility using the keyboard:

MacOS

  1. System Preferences > Keyboard

  2. Select Shortcuts from the top utility menu

  3. Check off, “Use keyboard navigation to move focus…”

Additional Browser Configuration

See Scott Vinkle’s screen-shots and visual walk-through of configuring browser settings for keyboard navigation:

Viewing Simulated Color Conditions

Funkify Simulator: Color Carl

Using the (free) version of the Funkify Color Contrast Simulator allows you to view the webpage under different color conditions. Evaluate whether or not elements have appropriate contrast. Do important call out buttons stand out in relation to the color palette?

Toptal Color Simulator

The Toptal Color Simulator enables you to view your website side-by-side under a filtered condition of color blindness. This is more of a side-by-side screen comparison. This gives you a sense of how color choices in the brand palette may impact the experience for others with specific types of color blindness. Observe whether or not calls-to-action buttons, links, forms and other user experience components are clearly distinguishable. This experience also raises potential pitfalls when color may be used as a sole means of communication, when text, icons or other graphical elements should be paired with color.

Grayscale Mode (or Similar)

Although 100% color blindness is the most rare, viewing the website in grayscale mode helps understand instances where color may be used for communication and meaning.

MacOS

  1. Go to System Preferences > Accessibility > Display

  2. Navigate to the Color Filter Menu in the Utility Navigation

  3. Select Grayscale from the dropdown menu,

  4. Select “Enable Color Filter”

You may optionally switch to other modes to further your exploration.

Low Vision

Screen Magnification

Some users with low vision magnify their screen up as faras 200%. An accessibility requirement and consideration is that there is “no loss of content or functionality” when the screen is zoomed in.

You may do this by using your browser’s zoom function.

Tunnel Toby

This is a vision loss simulator that emulates absence of peripheral vision.

Peripheral Pierre

The opposite of Tunnel Toby, the experience when a person can only see from the edges, but not in the central part of their vision.

Mobility

Trembling Trevor

This is a simulation of someone who lacks fine motor control. As the app uses as an example, imagine that you are on a bumpy bus trying to interact with your mobile phone.

Observe how it may be more challenging to interact with user interface elements such as buttons, links, icons, form fields. Are you able to easily activate these elements with an ample “touch target” or does it require precision and focus to activate the targets?

You may adjust the sensitivity of the tremor in the settings.

Last updated