Nuxt
nuxt/route-announcer
The app renders NuxtRouteAnnouncer (in app.vue or a layout) so client-side page changes are announced.
umiarkowanastatyczneWCAG 4.1.3 · AAfe-nuxt
Dlaczego
After the first load, Nuxt changes pages without a browser navigation. A screen reader user who follows a link hears nothing: no new page title, no sign that the content changed, and keeps reading where they were.
Poprawka
Render <NuxtRouteAnnouncer /> once, in app.vue or in every layout. It announces the new page's title in a polite live region, so give each page a distinct title with useHead or useSeoMeta. Move focus to the main heading or <main> as well when the design allows.
Przykłady
<!-- good: app.vue -->
<template>
<NuxtRouteAnnouncer />
<NuxtLayout><NuxtPage /></NuxtLayout>
</template>Źródła
Fakty
- Identyfikator
nuxt/route-announcer- Waga
- umiarkowana
- Sprawdzanie
- statyczne sprawdzane w kodzie źródłowym przez
audit - Dotyczy plików
project- Tylko w projektach z
nuxt- WCAG 2.2
- 4.1.3, poziom AA
- Uczy jej skill
fe-nuxtNuxt apps- Od wersji
- 0.1.0
Przeczytaj w terminalu
npx github:dawidolko/frontend-skills explain nuxt/route-announcer