Tag Archives: javascript

Making Accessibility Simpler, With Ally.js – Smashing Magazine

A long read but worth it.

One of the first things you’ll learn when looking at ARIA is that supporting keyboard navigation is fundamental. And the first step to understanding keyboard navigation is to understand what focus is. And this is where I tripped, because nobody knew (in detail) which elements could receive focus and which could not.

Having had a bit of experience testing browser compatibility (“CSS3 Transitions: Thank God We Have A Specification!”), I decided I would spend some time investigating. An ebook covering my findings is in the works and will be ready to make you lose focus in early 2016. But more importantly, the JavaScript variant of that book is available today:ally.js is a JavaScript library to help modern web applications with accessibility concerns by making accessibility simpler.

Source: Making Accessibility Simpler, With Ally.js – Smashing Magazine

Pixi becomes Accessible – Goodboy™

Pixi is now Accessible!

That’s right accessible. What am I talking about? Read on…Some users navigate the internet using the keyboard rather than mouse or trackpad. Users with certain disabilities interact purely the keyboard or an accessibility switch and blind users rely on assistive technology such as screen readers and so on. This is where using canvas to create full content starts to come unstuck, as the canvas itself has no concept of what’s going on inside it. Basically, it’s a bit of a black box!

The browser will always see it as a single element. Meaning that content rendered in canvas is completely unreachable by assistive technology such as screen readers. Not great really as it means certain users will not be able to navigate content built using canvas.

Doing a fair chunk of work for the BBC this year, they are striving to make their games as accessible as possible. One hurdle which we both faced was that a lot of games and rich media content these days are built on top of canvas. What we needed was a way to make the content accessible to the screen readers so that all users can enjoy the content they output as much as possible.

Source: Pixi becomes Accessible – Goodboy™ — Goodboy™

Keyboard Navigation for Responsive Web Design | Art+Tech

HTML provides a tabindex attribute to control the tab order of elements when their document ordering differs from their visual ordering, but this is insufficient to cope with multiple dynamic orderings that can arise from developing Responsively.A CSS nav-index property was proposed which would have provided a way to solve this problem, but was unfortunately dropped from the standards due to lack of support.In efforts to address this problem, we developed a simple tool to dynamically update the tabbing order of specially marked elements. The tool we’ve created takes the form of a small Javascript library called responsive-tab-order.

Curated by (Lifekludger)
Read full article at Source: Keyboard Navigation for Responsive Web Design | Art+Tech