Checklist Renow 4.3

37 résultat(s) trouvé(s)

Recherche

RC.008 - Portée d'une recherche spécifique - Niveau 1

La portée d'une recherche spécifique est indiquée.
Soit dans le label soit avec un titre placé avant. Exemple: pour une recherche parmi les publications
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 3.2.2(A)

Présentation

PR.025 - Contraste minimum - Niveau 2

Le contraste entre l'avant-plan et l'arrière-plan est au moins de 4,5:1. Pour les textes de plus de 18 pt ou 14 pt gras et les éléments graphiques (pictogramme,...) de plus de 5px, il est au moins de 3:1.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
  • WCAG 2.1:
    • 1.4.3(AA)
    • 1.4.11(AA)

PR.010 - Effet de flash - Niveau 1

Les pages n'imposent pas d'effets de flash, des changements de luminosité ou des clignotements.
La fréquence de l'effet doit être inférieur à 3 sur une seconde. Si la fréquence est supérieure l'utilisateur doit pouvoir le stopper
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
  • WCAG 2.1:
    • 2.3.1(A)
    • 2.2.2(A)

Navigation

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)

Identification

ID.013 - Utilisation de cookies simple - Niveau 2

Si des cookies sont utilisés sur le site, l'utilisateur en est informé.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • RGPD

Tableau

TB.005 - Tris pour tableaux complexes - Niveau 3

Une fonctionnalité de tri est proposée pour les tableaux de données ayant plus de 20 lignes et 3 colonnes et dont le tri fait du sens.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

Présentation

PR.023 - Portée d'un système d'onglet - Niveau 1

Lorsqu'un système d'onglets est utilisé, la portée des onglets est mis en évidence par le design et grâce au code.
avec des role=tab et des aria-controls
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 4.1.2(A)

Identification

ID.011 - Logo SIP - Niveau 3

La "GOV Bar" utilise le logo officiel du SIP, le logo et le texte renvoie vers gouvernement.lu.
  • Etape(s):
    • Arborescence
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
    • Référencement

ID.002 - Favicone - Niveau 3

Le site possède une favicon pertinente.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
    • Référencement

Formulaire

FM.011 - Apparence des boutons d'action - Niveau 3

Les actions de formulaires ne sont pas mis en forme comme des liens.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

FM.002 - Label des champs - Niveau 1

Les champs de formulaire ont un label explicitement associé et pertinent.
Le label contient la propriété for et l'input contient un id identique <code><label for="label1"> étiquette du champs</label><input id="lable1"></input></code>
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 3.2.2(A)

Présentation

PR.006 - Mise en forme du contenu - Niveau 3

Les contenus des pages sont alignés à gauche sans justification
  • Etape(s):
    • Prototype
    • Rédaction
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
  • WCAG 2.1:
    • 1.4.8(AAA)

PR.027 - Repérage des liens visités - Niveau 3

Dans les contenus, les liens visités se distinguent visuellement des liens non-visités.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

PR.021 - Contraste des liens - Niveau 1

Les liens de type "contenu" sont soulignés ou ont un contraste avec le texte alentour de 3:1 minimum.
https://webaim.org/resources/linkcontrastchecker/
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 1.4.1(A)

PR.018 - Stabilité de la structure des sites - Niveau 2

Toutes les pages doivent contenir et toujours à la même place (sauf exception argumentée):
- une zone d'identité
- une zone de navigation primaire
- une zone de recherche
- un chemin de localisation (sauf en page d'accueil)
- une zone de contenu
- un footer (donnant accès à tous les contenus du site)
- une zone de signature Renow (contenant le logo Renow)
- la GovBar (si son utilisation a été confirmée par le SIP).
Pour l'accessibilité, la stabilité des éléments de l'interface sont essentiels (le menu particulièrement)
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
    • Référencement
    • Accessibilité
  • WCAG 2.1:
    • 3.2.3(A)
    • 2.4.5(AA)

Navigation

NV.031 - Cohérence entre les noms visibles et le code - Niveau 1

Le libellé d'un bouton ou d'un lien dans le code correspond au texte ou au début de l'intitulé qui est visible ou graphiquement évident.
Il peut être complété par un title mais non remplacé. Un pictogramme doit faire appel à un intitulé suffisamment évident.
(un bouton loupe signifie de manière évidente "rechercher")
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
  • WCAG 2.1:
    • 2.5.3(A)

Présentation

PR.009 - Texte en images - Niveau 2

Les textes mis en images ne sont utilisés que si un texte mis en forme par des styles CSS ne peut pas produire l'effet attendu (boutons, menu navigation, contenus…).
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
  • WCAG 2.1:
    • 1.4.5(AA)

Navigation

NV.026 - Apparence des zones d'interactions - Niveau 1

Les "actions utilisateurs" (p.ex. lancer une recherche) se distinguent clairement des liens de navigation.
Pour l'accessibilité, une action utilisateur se présente avec une balise ou un role button.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 4.1.2(A)

Présentation

PR.003 - double transmission d'information - Niveau 1

L'information ne doit pas être donnée uniquement par la couleur, la forme, la taille ou la position.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 1.3.3(A)
    • 1.4.1(A)

Navigation

NV.025 - Intitulé unique - Niveau 1

Le contenu ne contient pas de lien ayant un texte identique pour des cibles différentes.
Les textes et titres dont le lien fait parti, doivent le rendre explicite.
  • Etape(s):
    • Prototype
    • Rédaction
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 2.4.4(A)
    • 2.4.9(AAA)

Identification

ID.012 - Liens de la GOV Bar - Niveau 3

La GOV Bar propose les liens crossgov.lu, luxembourg.lu, guichet.lu, gouvernement.lu et un lien « Autres sites » qui renvoie vers etat.lu, sauf exception argumentée.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
    • Référencement

ID.010 - Logo Renow - Niveau 3

Le logo Renow renvoie vers le site "Renow".
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
    • Référencement

Formulaire

FM.021 - Format attendu - Niveau 1

L'utilisateur est guidé dans les valeurs à saisir:
- format de données attendu (type de caractère ou type de fichier...)
- suggestion de valeur pertinente (proposition à partir de l'historique utilisateur)
Le champs et l'aide à la saisie sont liés<label for="document"> Ajouter un document à votre dossier </label>
<input type="file" id="document" name="document" aria-describedby="formats" />
<p id="formats">Formats acceptés : pdf ou doc.</p>
Pour les champs texte qui permettent de saisir l'identité d'une personne, le champ "nom" a pour valeur de l'attribut autocomplete "family-name", le champ "prénom" la valeur "given-name", etc.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 3.3.2(A)
    • 1.3.5 (AA)

FM.018 - Apparence des messages d'erreurs - Niveau 1

Les messages d'erreurs, les libellés et les champs associés sont mis en valeur, visuellement, au moyen de 2 mécanismes différents, au moins l'un d'eux doit faire apparaitre du rouge (contraste de couleur, graisse, style, pictogramme, etc...).
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 1.3.3(A)

FM.012 - Libellé des boutons d'action - Niveau 1

Les libellés des boutons indiquent clairement l'action de manière concise.
L'intitulé visible peut éventuellement être complété par un title. Il ne peut être remplacé
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 2.5.3(A)
    • 2.4.6(AA)

FM.015 - Distinction des champs obligatoires - Niveau 1

Les champs obligatoires sont différenciés par une astérisque dans leur LABEL, sous la forme "Intitulé * :".
La distinction peut être faite avec la mention (obligatoire) écrit en toute lettre. La propriété "required" doit également être présente sur le champs <label for="numero-serie">Numéro de série *</label>
<input type="text" id="numero-serie" required>
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 3.2.1(A)
    • 3.2.2(A)

Présentation

PR.026 - Contraste de lecture - Niveau 3

Le texte principal de la zone de contenu doit avoir un ratio de contraste minimum de 5,5:1.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Accessibilité
    • Ergonomie

PR.020 - Survol des zones cliquables - Niveau 3

Toutes les zones cliquables présentent un effet de roll-over. Cet effet ne provoque pas de décalage dans l'affichage des textes
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

PR.017 - Taille de police minimum - Niveau 3

La taille minimale du texte doit être lisible quelle que soit sa fonction (une taille inférieure à 12px est souvent illisible).
  • Etape(s):
    • Prototype
    • Rédaction
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

PR.011 - Soulignement - Niveau 3

Le soulignement est réservé aux liens.
  • Etape(s):
    • Prototype
    • Rédaction
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

PR.008 - Cohérence hiérarchique des titres - Niveau 3

L'apparence graphique des titres est cohérente avec leur niveau hiérarchique.
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
  • WCAG 2.1:
    • 1.3.1(A)

Navigation

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

Identification

ID.014 - Utilisation de cookies avec données personnelles - Niveau 2

Si des cookies avec enregistrement de données sont utilisés sur le site, un consentement de l'utilisateur est demandé.
S'il refuse, les fonctionnalités utilisant ces cookies doivent être désactivées
  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • RGPD

ID.005 - Contenu de la page d'accueil - Niveau 3

La page d'accueil permet d'identifier la nature des contenus et services proposés.
  • Etape(s):
    • Prototype
    • Rédaction
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie

Formulaire

FM.014 - Position des boutons d'action - Niveau 3

Les boutons d'actions sont placés en fin de formulaire et sont alignés à gauche ou centrés.
  • Etape(s):
    • Design graphique
    • Prototype
  • Types d'exigence:
    • Ergonomie

Dernière modification le