A11y

Accessability

2025-01-08

A11y Module

Nuxt is planning to into an A11y Module for hinting and assistive technologies. See Nuxt Core Modules Roadmap.

NuxtRouteAnnouncer

Add to each layout.

<!-- Announce route changes to assistive technologies -->
<NuxtRouteAnnouncer />

Loading Feedback

Skeleton UI elements that get replaced once a third-party script (like video embed or payment modal) loads, thus reducing visual noise and improving performance.

a11y feedback is rqd to inform the user when the script is loading or on failure to load.

Load Failed Alert

<ComplicatedComponent>
  <template #error>
    <UAlert color="red" title="ComplicatedComponent to load" description="Refresh page to try again." />
  </template>
</ComplicatedComponent>

Loading Indication

<ComplicatedComponent>
  <template #loading>
  <ScriptLoadingIndicator />
  </template>
</ComplicatedComponent>

 

Copyright @ 2024 Anne Brown