marcysutton

A new feature released in Angular 1.3.0 is the accessibility module, ngAria. As someone involved in delivering this community-driven effort, I thought it might be helpful to introduce ngAria, a module which can improve the user experience for many people with disabilities.

In this post:

• What is ngAria?
• Why ngAria?
• Including the Module
• New and proposed features

##What is ngAria?

marcysutton

The goal of ngAria is to improve Angular's default accessibility by enabling common ARIA attributes that convey state or semantic information for assistive technologies used by persons with disabilities.

##Including ngAria

Using ngAria is as simple as requiring the ngAria module in your application. ngAria hooks into standard AngularJS directives and quietly injects accessibility support into your application at runtime.

marcysutton

List of Accessibility Github Repos

• https://github.com/karlgroves
• https://github.com/quailjs/quail
• https://github.com/GoogleChrome/accessibility-developer-tools
• https://github.com/paypal/bootstrap-accessibility-plugin
• https://github.com/stubbornella/oocss-accessibility-guidelines
• https://github.com/dylanb/a11yfy
• https://github.com/yargalot/grunt-accessibility

marcysutton

describe('radioButton', function() {
  beforeEach(module('material.components.radioButton'));
  
  it('should set roles', inject(function($compile, $rootScope) {
    var element = $compile('<material-radio-group ng-model="color">' +
                            '<material-radio-button value="blue"></material-radio-button>' +
                            '<material-radio-button value="green"></material-radio-button>' +
                          '</material-radio-group>')($rootScope);

    var rbGroupElement = element;

marcysutton

.warning
  color: red

  &h1
    background-color: white
    padding: 1em
    text-align: center

marcysutton

a, button
  &:hover, &:focus
    color: orange
    
  
.profile-list-item
  &.selected
    background-color: $dark-gray

marcysutton

Personalization for Accessibility

I'm looking for web apps or online experiences that offer personalization options to users with the intent to improve accessibility, such as increased font-size, variable color scheme or layout (for example, always give me mobile). Thoughtful implementations would persist after users leave the site, so their desired settings would still be there when they came back.

Trello has an "Enable Color Blind Friendly Mode". It's pretty simplistic and probably not that useful, but their hearts are in the right place.

Have you seen any applications that do well with this type of offering?