Year round learning for web and digital professionals

A few accessibility and inclusion things

A non trivial part of my working life involves scouring the web for great resources for our audience of frontend developers, designers, and other web and digital professionals. I use pinboard, an excellent bookmarking site, with browser extensions that make it very straightforward to add a site to my list of bookmarks, regardless of the […]

Web Directions AAA ’21 session spotlight–Deep dive into ARIA

Deep dive into ARIA By now you probably know the first rule of ARIA: Don’t use ARIA, unless you really need to. Because sometimes, we do need to use ARIA. But when should we use ARIA? And how should we use it? These questions can leave us high and dry!

This session is more than a simple overview of what ARIA is. It’s an in-depth exploration of common ARIA roles, states, properties, and techniques that we can use to increase the accessibility of our web pages or applications. Don’t fret, we’re not going to dive head first into cold and murky water!

Web Directions AAA ’21 session spotlight–ARIA Spec for the Uninitiated

ARIA Spec for the Uninitiated Specs are usually not very fun, but I have learned that reading the ARIA specs is important to fully understand all the various options that are available. In this presentation, I will walk you through the ARIA spec and show you how to make the most out of it to create custom components with ARIA.

Making online conferences more accessible

Accessibility has been a core focus of our conferences since the very beginning, with something like 20% of our very first conference way back in 2004 focussed specifically on the topic (sadly the site for that conference is lost to the sands of time). And all these years later in 2021 we’ve come somewhat full […]

Web Directions Code ’21 session spotlight–Accessibility APIs: Where the magic happens!

Accessibility APIs: Where the magic happens! Are you coding for accessibility? Have you ever wondered how the accessibility information of the elements you’ve used and components you’re building is exposed to assistive technologies, or why every accessibility person ever says: “Use native elements!”?

With this talk I aim to fill in the blanks by discussing how the Accessibility APIs work together with HTML elements, WAI ARIA and the Accessibility Tree to make the magic happen by extracting accessibility information from web interfaces and presenting it to assistive technologies.

Web Directions aaa ’21 session spotlight–Understanding Live Regions

Understanding Live Regions Live regions help us expose useful information, and notify users with minimal distraction. However, they are frequently misused in many modern Web applications. Ugi will talk about how to create live regions, how to debug them, and rules to make them truly accessible for all.

Web Directions Code ’21 session spotlight–Overlays Underwhelm

Overlays Underwhelm The organizers pitched it to me, so this may change: Accessibility overlays bring promises of accessible sites in one line of code, but experiences from users tell us the opposite. We will look at the guarantees, the marketing efforts, the code efforts, and lived experiences of users.

Web Directions Code ’21 session spotlight–The Low-Hanging, High Impact Accessibility Issues For Developers

The Low-Hanging, High Impact Accessibility Issues For Developers In this talk Samuel Proulx, Accessibility Evangelist at Fable and blind since birth, will walk you through low-effort, high yield opportunities for you to improve accessibility in your apps and websites. It is tailored to developers and will cover major items within the context of the W3C principles, as well as informed by his experiences as a screen reader user and member of a community of people with disabilities

Web Directions Code ’21 session spotlight–Intro to Cross Screen Reader Testing

Intro to Cross Screen Reader Testing There’s a wide variety of screen readers available today — NVDA, JAWS, VoiceOver, Narrator, and TalkBack to name a few. Much like web browsers, each has its own strengths, weaknesses, and unique quirks.

In this talk, we’ll dive into why testing with screen readers is important, the major differences between them, and strategies you can use to prioritize and debug screen reader issues that surface in your accessibility work.

Web Directions aaa ’21 session spotlight–SpeakingNaturally on Dragons and other alternative navigations

SpeakingNaturally on Dragons and other alternative navigations Accessibility talks typically focus on understanding standards and code, but there’s something that’s more important to understand before you even start thinking about WCAG or ARIA. It’s assistive technology.

What types are there and how do they work? We’ll dive into the lesser know alternative navigation tools like Dragon NaturallySpeaking, switch systems and on screen keyboards. Once you know more about assistive technology you can better understand the impact of following or not following WCAG and you can test that your accessible code actually makes sense.

Web Directions aaa ’21 session spotlight–Making Motion Inclusive

Making Motion Inclusive Let’s clear the air about animation and inclusive design. It’s a common misconception that things like inclusive design and accessibility only come at the cost of design details like motion, but that’s just not the case. Whether it’s microinteractions, animated illustrations, or larger animated experiences, a little care and consideration can go a long way towards getting the best of both worlds.

In this session Val will show you how to build animated interactions with inclusivity in mind from the start. We’ll discuss how to apply web accessibility guidelines to modern web animation, when and how to implement reduced motion, and approaches to building up animated interactions for a solid standards base.

Web Directions Code ’21 session spotlight–Building the most inaccessible site possible with a perfect Lighthouse score

Building the most inaccessible site possible with a perfect Lighthouse score Google’s built-in testing tool Lighthouse judges the accessibility of our websites with a score between 0 and 100. It’s laudable to try to get a high grading, but a score of 100 doesn’t mean that the site is perfectly accessible. To prove that Manuel Matuzović carried out a little experiment.

Web Directions Code ’21 session spotlight–Forced colors explained

Forced colors explained Forced colors, or Windows high contrast mode (a “misnomer”, we’ll get to that), is a way for browsers to completely overwrite your websites design with a user specified style. The CSS Media query of the same name can help you adapt, or compensate, for this radical change in your sites design. But what should you adapt to, and how? Join Kilian in this talk to explore the what, why and how of forced colors.

delivering year round learning for front end and full stack professionals

Learn more about us

Thanks for an amazing few days Web Directions. So many great themes of empathy, inclusion, collaboration, business impact through design, and keeping our future deeply human.

Laura van Doore Head of Product Design, Fathom