When you use semantic HTML, the browser handles a lot of things for you. It takes a subset of the DOM and creates an accessibility tree that can be queried using platform-accessibility APIs. It also provides keyboard and touch interaction when you need it.
However, there are times when semantic HTML isn’t used. JavaScript frameworks don’t always use the appropriate element for a task, opting instead to recreate standard elements using div and span elements. As developers, we also use div and span elements as the building blocks of custom widgets and increasingly as the primitives for web components.

Understanding accessibility mechanics is an important part of good interface design. Léonie Watson provides a developer’s guide to accessibility mechanics, explaining the relationship between code, the browser, and assistive technologies and demonstrating how to create accessible custom widgets with HTML, CSS, ARIA, and JavaScript.

свернуть