Skip to main content Link Menu Expand (external link) Left Arrow Right Arrow Document Search Copy Copied

Summary

In the third and last part of this workshop, we learned how to ensure our Next.js SPA is AODA compliant using the WAVE tool. We also added accessible focus indicators to a number of MUI components and we added a “Skip to Main Content” button to our navigation bar. We now know how to:

  • Install the WAVE tool
  • Assess a webpage for AODA compliance using the WAVE tool
  • Fix contrast errors
  • Fix empty button errors
  • Address missing form label errors
  • Add accessible focus indicators to several MUI components
  • Add a “Skip to Main Content” button to the navigation bar

If you would like to learn more about the Next.js framework and the different MUI components, please consult the resources linked in the conclusion of this workshop series.