dai11y 04/08/2020

Your daily frequent11y newsletter, brought to you by @ChrisBAshton:

Making Facebook.com accessible to as many people as possible

  • A Facebook Engineering article describing how the site redesign in React provided opportunities to improve accessibility. Using React Context, heading levels automatically increase as they are nested (i.e. <Heading /><section><Heading /></section> automatically creates a h1 followed by a h2). They use the same mechanism for contextual keyboard commands, to perform actions relevant to the thing that is in focus. Components such as FocusList are wrapped around lists to handle focus and to define up/down arrow key behaviour. A static analysis tool errors when it encounters a form control without a label, and a runtime tool monitors the DOM in real time and visually alerts devs to any inaccessible components.

Prefer longer newsletters? You can subscribe to week11y, fortnight11y or even month11y updates! Every newsletter gets the same content; it is your choice to have short, regular emails or longer, less frequent ones. Curated with ♥ by developer @ChrisBAshton.

Loading...