Single-page applications introduce unique accessibility issues like poor semantics, generic page titles, and difficult focus management.
Semantic HTML provides inherent meaning and structure, which translates directly to a navigable and understandable accessibility tree for screen reader users.
React Fragments allow grouping elements without adding extra nodes to the DOM, preventing invalid HTML structures like a div inside a ul.
React uses camelCase for most HTML attributes, so it is important to use `className` instead of `class` and `htmlFor` instead of `for`.
A CRUD application example demonstrates how to handle focus logically after adding, editing, or deleting items to create a predictable keyboard navigation experience.
Use techniques like updating the document title and implementing ARIA live regions to inform screen reader users about dynamic content changes and notifications.
Combine manual keyboard testing, browser extensions like axe DevTools, linters, and automated tests to ensure components are accessible.
A recap of essential practices including using semantic HTML, managing focus, announcing updates, and consistent testing to build accessible applications.
27:16Tanja Ulianova
56:01Dirk Ginader
31:30Ramona Domen
32:00Eeva-Jonna Panula
31:38Anuradha Kumari
25:33Manuel Mauky
55:32Hidde de Vries
56:00Karl Groves
Jobs that call for the skills explored in this talk.
Cap3 GmbH
Kiel, Germany
BSB Bremer Software & Beratungs GmbH
Bremen, Germany
JO Media Software Solutions GmBh
Brunn am Gebirge, Austria
tarent solutions GmbH
tarent solutions GmbH
tarent solutions GmbH
Optimi Solutions GmbH