structure / layout

  • Accessible Page Layouts

    The structure of a given page is more than only a visual consideration. This topic explores how heading levels, semantic HTML, and the order in which you declare and label your elements can all be leveraged to improve the experience of your assistive technology users

  • Accessible Images, Icons and Emojis

    All images require an 'alt' attribute, but deciding what content it should have can be very challenging. This topic steps through some key questions you can ask yourself to help decide the right alternative text given an image's context. It also considers some other types of imagery (font icons and emojis) that don't use the 'img' element, but still present visual information to users.

  • Lists with Repeating Calls to Action

    Often when we create lists of UI elements, they may have similar or even identical text labels. This topic considers how screen reader users interact with this kind of content, and what we can do to improve their accessibility. It also explores how we can create flexible React components suitable for reuse in this way.