Checklist Renow 4.3

NV.041 - Traduction partielle du site - Niveau 3

Pour des versions différentes en terme de contenu, l'utilisateur a uniquement la possibilité d'opter pour un changement de langue sur la page d'accueil.

Etape(s):
- Prototype
- Final
Types d'exigence:
- Ergonomie

NV.032 - Fonction de partage - Niveau 3

Les pages de contenu proposent une fonction de partage.

Les pages passerelles et la page d'accueil n'ont pas besoin de cette fonction.

Etape(s):
- Prototype
- Final
- Design graphique
Types d'exigence:
- Ergonomie

NV.029 - Section "A la une" - Niveau 3

Aucun lien externe n'est présent dans la section "A la une" (ou la section similaire) de la page d'accueil. Ils renvoient tous vers une page de l'arborescence du site.

Etape(s):
- Prototype
- Final
- Design graphique
Types d'exigence:
- Ergonomie

NV.023 - Surface des zones d'interaction - Niveau 3

Chaque élément d'interaction possède une zone d'interaction de
- soit une surface minimum de 32px sur 20px
- soit une surface minimum de 20px sur 12px et une marge de 6px avec les éléments alentours.

Etape(s):
- Prototype
- Final
- Design graphique
Types d'exigence:
- Accessibilité
- Ergonomie
WCAG 2.1:
- 2.5.5(AAA)

NV.014 - Contenus datés - Niveau 3

Les contenus datés sont archivés par mois et/ou année et accessibles via un système de navigation dédié.

Les filtrages sont proposés uniquement si la volumétrie est telle que ces contenus ne sont pas affichables sur 1 seul page.

Etape(s):
- Prototype
- Final
Types d'exigence:
- Ergonomie

NV.027 - Comportement liens internes - Niveau 3

Chaque lien interne (pointant vers une page du produit) s'ouvre dans la fenêtre courante.

Etape(s):
- Prototype
- Rédaction
- Final
Types d'exigence:
- Ergonomie

NV.012 - Compréhension des niveaux de navigation - Niveau 3

Le système de navigation proposé donne la possibilité à l'utilisateur d'identifier clairement les différents niveaux de navigation qui lui sont proposés.

Etape(s):
- Prototype
- Final
Types d'exigence:
- Accessibilité
- Ergonomie
WCAG 2.1:
- 2.4.8(AAA)

NV.009 - Profondeur minimum de l'arborescence - Niveau 3

Les rubriques thématiques proposent toujours des sous-rubriques.

Etape(s):
- Arborescence
- Prototype
- Final
Types d'exigence:
- Ergonomie

NV.040 - Sites multilingues - Niveau 3

Pour des versions du site entièrement identiques en terme de contenu, l'accès aux versions linguistiques alternatives est présent sur toutes les pages du site de manière à ce que l'utilisateur accède d'1 clic à la traduction de la page en cours de consultation

Etape(s):
- Prototype
- Final
Types d'exigence:
- Ergonomie

NV.028 - Longueur des liens - Niveau 3

La longueur des textes de lien proposés dans le corps de texte est comprise entre 5 et 80 caractères.

Moins de 5 caractères révèle un manque de signification du lien et une zone de clic difficile à atteindre. Plus de 80 caractères révèle un lien trop long en particulier pour les plages brailles et lecteurs d'écran

Etape(s):
- Prototype
- Rédaction
- Final
Types d'exigence:
- Accessibilité
- Ergonomie
WCAG 2.1:
- 1.4.8(AAA)

NV.019 - Utilisation de modale - Niveau 3

Les fenetres modales (et non des pop up) sont utilisées de manière appropriées:
- apparence et intérêt
- titre
-navigation clavier
-role aria.

Apparence: une modale est une boite affichée en superposition de la page consultée en conservant le contexte. (par opposition aux pop up qui s'ouvrent dans une nouvelle fenetre ou onglet)
Si le processus utilisateur doit être interrompu, le background est inaccessible.
interet: La modale est nécessaire à la réalisation d'une tâche demandée par l'utilisateur dans son contexte (affichage d'une définition ou d'une aide, saisie de données spécifiques).
Le titre est visible et lié à un aria-label ou un aria-labelledby.
navigation clavier: Elle recoit le focus lors de son apparition et est manipulable au clavier.
Le role dialog est utilisé.
<code><div role="dialog" aria-labelledby="modal-title">
<h1 id="modal-title">[Titre de la fenetre modale]</h1>
[Contenu texte de la modale]
<button>Fermer</button>
</div> </code> https://www.w3.org/TR/wai-aria-practices/#dialog_modal, https://www.w3.org/TR/wai-aria-practices/examples/dialog-modal/dialog.html

Etape(s):
- Prototype
- Final
Types d'exigence:
- Accessibilité
- Ergonomie
WCAG 2.1:
- 2.1.1(A)
- 4.1.2(A)

NV.013 - Chemin de localisation - Niveau 3

Le chemin de localisation décrit de manière fidèle la position de l'utilisateur dans le produit (site, application) et reprend tous les titres des pages parentes associées. Le dernier élément correspond à la page en cours.

Chemin de localisation est aussi appelé fils d'ariane ou breadcrumb

Etape(s):
- Prototype
- Final
Types d'exigence:
- Accessibilité
- Ergonomie
WCAG 2.1:
- 2.4.8(AAA)

NV.002 - Profondeur maximum de l'arborescence - Niveau 3

La navigation thématique a une profondeur de 5 niveaux maximum

Etape(s):
- Arborescence
- Prototype
- Final
Types d'exigence:
- Ergonomie

NV.007 - Titre de page dans le navigateur - Niveau 3

Les titres affichés dans la barre de titre du navigateur respectent le formalisme suivant: "Titre de la page en cours - Nom du site"

Etape(s):
- Prototype
- Final
Types d'exigence:
- Ergonomie

NV.039 - Liens vers les versions linguistiques - Niveau 3

Le changement de version linguistique est proposé sous forme de lien rédigé dans les langues cibles

Etape(s):
- Prototype
Types d'exigence:
- Ergonomie

NV.033 - Fonction haut de page - Niveau 3

Les pages contiennent une fonction « Haut de page ».

Etape(s):
- Prototype
- Final
- Design graphique
Types d'exigence:
- Ergonomie

NV.006 - Titres homogènes - Niveau 3

Les titres de pages de même niveau sont définis de manière homogène

Utilisation d'une catégorisation cohérente et homogénéité dans les termes employés

Etape(s):
- Arborescence
- Prototype
- Rédaction
Types d'exigence:
- Ergonomie