Avoid aria-roledescription Adrian Roselli writes about this attribute that describes the role of an element. It overrides what is announced to the screen reader, e.g. <input type=”text” aria-roledescription=”Only numbers allowed”> will read as “Only numbers allowed” instead of “input type text”. This hides meaning and the control type – a confusing experience for the user…. [Read More]

Semantic sidenotes for the web Article (or video) by UI designer Koos Looijesteijn, describing ‘sidenotes’ that have been in print media for centuries, and the difficulty in representing them in HTML. His solution is a <span> containing a <label> that can be clicked to expand a corresponding <small> on mobile, or that highlights the text… [Read More]

Facing coronavirus while deaf and blind: ‘Everything relies on touch’ Article by ABC News, highlighting the plight of the 40,000 deaf-blind Americans who rely on touch but have to maintain social distancing. They use hand-over-hand signing to communicate, and finger-scan braille public signs for mobility, now prone to contagion. The community uses computers and internet… [Read More]

Treating cataracts in the 21st century Brief but interesting article highlighting that one billion people in the world have preventable or treatable visual impairments; 300 million of these are cataracts, which accounts for 50% of blindness worldwide. A cataract is an opacity in the lens of the eye, often caused by ageing, and can be… [Read More]

Track Which Element Has Focus Kayce Basques, technical writer at Google, shares a Chrome tip for developers/testers. By creating a “Live Expression” with the value document.activeElement, you can tab around the web page and always know where the focus state is, even if there aren’t any associated focus styles.

Why to Avoid Accessibility Overlay Toolbars, Pugins & Widgets Accessibility Works article warning against the installation of third-party overlays/widgets that promise to make your site accessible. These tools provide options for customising text size, providing magnifiers, and in some cases a built-in screen reader or alt-text generator. However, they cannot address the 70% of accessibility… [Read More]

How home working leaves deaf people out of the loop during coronavirus Three quarters of people who live with deafness fear they will be less productive working from home. People who lip-read or use British Sign Language are especially at risk of being excluded from phone and video interactions. We can all help by speaking… [Read More]

Accessible page title in a single-page React application Post by Hugo Giraudel, describing how following a link on a ‘normal’ web page loads a new page and causes a screen reader to read out the page title – this behaviour might be missing from your React SPA. He creates a <TitleAnnouncer> component, which listens for… [Read More]

This Is What Happened at a Captioned Virtual Reality Webinar Meryl K. Evans describes their experience of attending A11yVR meetup, which you can watch. Meryl is deaf and relies on the captions, but being in a VR environment raised several issues, such as other avatars standing in front of the captions. Technical issues such as… [Read More]

Squarespace, Wix, & Weebly: Accessibility Review Terrill Thompson tries out three website builders and examines the accessibility of their output. All three produce unsemantic headings in their default templates, such as Wix’s main heading being a <h3>. Alt text is generated from filenames, and is editable, but it’s not always clear that you’re editing alt… [Read More]