Chris Ashton

dai11y 07/11/2019

Your daily frequent11y newsletter, brought to you by @ChrisBAshton:

What I’ve learned about accessibility in SPAs

  • SPAs need you to manage “back button” behaviour yourself: scrolling to the previous scroll position and focussing on the previous element that was clicked (something browser navigation normally does for free). The article doesn’t describe how you can achieve this and mostly isn’t SPA-related at all. The author extols the virtues of accessibility for improving readability of tests (by querying aria attributes for state). I also learned that not all clickable elements necessarily need to be focusable; if you have multiple links to the same destination, you should apply tabindex="-1" to some of them to avoid unnecessary tabbing.
  • Background: Single Page Applications (SPAs) use JavaScript to handle navigation between pages by modifying the DOM and History API.
Screenshot of Mastodon UI with clickable areas highlighted
These links link to the same place, so one of them can be legitimately removed from the tab index.