Tag Archives: code

An Introduction to the Reduced Motion Media Query | CSS-Tricks

The open web’s success is built on interoperable technologies. The ability to control animation now exists alongside important features such as zooming content, installing extensions, enabling high contrast display, loading custom stylesheets, or disabling JavaScript. Sites all too often inundate their audiences with automatically playing, battery-draining, resource-hogging animations. The need for people being able to take back control of animations might be more prevalent than you may initially think.

Although technology unintentionally inflicting adverse effects has existed before this, the popularity of iOS gave the issue prominence. Apple has great support for accessibility, so an option in the operating system preferences to disable motion effects for those with vestibular disorders was added in response.

#Vestibu-what?

Your vestibular system provides an internal sensor to communicate your body’s physical position and orientation in the world, and is key to controlling balance and eye movement.

Vestibular disorders can cause your vestibular system to struggle to make sense of what is happening, resulting in loss of balance and vertigo, migraines, nausea, and hearing loss. Anyone who has spun around too quickly is familiar with a confused vestibular system.

Curated by (Lifekludger)
Read full article at Source: An Introduction to the Reduced Motion Media Query | CSS-Tricks

ARIA Labels and Relationships  |  Web  |  Google Developers

using aria-label to identify an image only buttonLabels

ARIA provides several mechanisms for adding labels and descriptions to elements. In fact, ARIA is the only way to add accessible help or description text. Let’s look at the properties ARIA uses to create accessible labels.

aria-label

aria-label allows us to specify a string to be used as the accessible label. This overrides any other native labeling mechanism, such as a label element — for example, if a button has both text content and an aria-label, only the aria-label value will be used.

You might use an aria-label attribute when you have some kind of visual indication of an element’s purpose, such as a button that uses a graphic instead of text, but still need to clarify that purpose for anyone who cannot access the visual indication, such as a button that uses only an image to indicate its purpose.

Curated by (Lifekludger)
Read full article at Source: ARIA Labels and Relationships  |  Web  |  Google Developers

Web Accessibility Lessons from Blind and Low Vision Users — Medium

Approximately 10% of US citizens are blind or have some degree of vision loss.

At TransitScreen we are exploring ways to make our digital signage more accessible to blind and low vision (BLV) users. Our work on this project has just begun, but we already learned some important lessons that we wanted to share.

Good code = accessible

Too often accessibility is thought of as extra work to be done after a site is finished. But in reality well-written HTML is already accessible by default, so the majority of the “work” simply involves knowing how to use it correctly and complying with standards.

  • Use semantic markup appropriately by choosing the tag that best describes the content it contains.

Curated by (Lifekludger)
Read full article at Source: Web Accessibility Lessons from Blind and Low Vision Users — Medium

Getting started with ARIA – The Accessibility Project

ARIA (Assistive Rich Internet Applications), is a spec from the W3C and created to improve accessibility of applications by providing extra information to screen readers via HTML attributes. Out of the box, screen readers work with regular HTML, but adding ARIA can provide screen reader users with more context and greater interactivity with content.

ARIA has no effect on how elements are displayed or behave in browsers. It does not add new functionality and is meant to act only as an extra descriptive layer for screen readers.

Curated by (Lifekludger)
Read full article at Source: Getting started with ARIA – The Accessibility Project