Les pages d'erreur contiennent la nature de l'erreur, un moteur de recherche, un lien vers la page d'accueil, vers le plan du site et vers le formulaire de contact.
Page 404 et autres erreurs
Etape(s):
Prototype
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.1.1(A)
3.3.3(AA)
CT.012 - Utilisation d'abréviation -
Niveau 3
La première mention d'une abréviation ou d'un acronyme au sein d'une page donne l'intitulé complet suivi du sigle.
Etape(s):
Prototype
Rédaction
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.1.4(AAA)
CT.018 - Utilisation d'onglet -
Niveau 3
Les contenus proposés dans des onglets ne sont pas destinés à être comparés entre eux.
Etape(s):
Prototype
Types d'exigence:
Ergonomie
CT.021 - Lien-email -
Niveau 3
Le texte d'un lien 'mailto' correspond à l'adresse mail pointée (l'adresse mail est visible).
Etape(s):
Prototype
Types d'exigence:
Ergonomie
CT.027 - Homogénéité des liens vers les documents -
Niveau 2
Chaque document téléchargeable possède un texte de lien unique et identique (ou très similaire) dans toutes les pages dans lesquelles il est proposé
Etape(s):
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.2.4(AA)
Formulaire
FM.001 - Taille du champs -
Niveau 3
Taille du champ de saisie est adaptée selon le type d'information.
Etape(s):
Prototype
Final
Types d'exigence:
Ergonomie
FM.007 - Types de liste à choix -
Niveau 3
Lorsque l'utilisateur doit voir l'ensemble des choix possibles les champs INPUT RADIO ou CHECKBOX sont utilisés plutôt que les listes SELECT.
Etape(s):
Prototype
Types d'exigence:
Ergonomie
FM.010 - Cohérence des formulaires -
Niveau 2
Les libellés des boutons d'action et les labels de champs sont cohérents à travers toutes les pages du site.
Etape(s):
Prototype
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.2.4(AA)
Contenu
CT.002 - Structuration des rubriques transversales -
Niveau 3
Les rubriques transversales font référence à un type d'objet identique (fiche standardisée avec une structure identique) pouvant renvoyer à une ou plusieurs rubriques thématiques du site.
Etape(s):
Arborescence
Prototype
Final
Types d'exigence:
Ergonomie
Identification
ID.001 - Nom de domaine -
Niveau 3
Le nom de domaine respecte le formalisme nom.public.lu.
Etape(s):
Arborescence
Types d'exigence:
Ergonomie
Contenu
CT.008 - Page "Aspects légaux" -
Niveau 3
La rubrique "Aspects légaux" propose des informations adaptées au site concernant les questions de responsabilité, de copyright, de crédit photos, de cookies et de protection des données.
Etape(s):
Prototype
Final
Types d'exigence:
Ergonomie
CT.011 - Arborescence orientée utilisateur -
Niveau 3
L'architecture du contenu est construite sur base des besoins des utilisateurs et non sur l'organigramme de l'institution.
Les cibles ont été définies pour le site ainsi que leur usecase associé.
Etape(s):
Arborescence
Prototype
Types d'exigence:
Ergonomie
Identification
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
Contenu
CT.017 - Pictogramme et lien illustré -
Niveau 1
Quand un lien textuel est associé à une image (pictogramme ou illustration), le lien est placé sur le texte et l'image.
Si l'image est décorative, le lien peut porter sur l'image grâce au css uniquement.
Etape(s):
Prototype
Final
Types d'exigence:
Ergonomie
WCAG 2.1:
1.1.1(A)
2.4.4(A)
CT.020 - Page contact -
Niveau 3
La page contact contient le nom, l'adresse postale, le mail et idéalement le téléphone de l'éditeur du site .
Etape(s):
Final
Types d'exigence:
Ergonomie
CT.026 - Légitimité du document -
Niveau 3
Les documents téléchargeables sont destinés à être stockés par l'utilisateur.
Il est préférable de fournir les informations dans les pages du site et limiter les contenus fournis sous forme de document téléchargeable.
Etape(s):
Final
Types d'exigence:
Ergonomie
Référencement
Formulaire
FM.006 - Choix explicites -
Niveau 3
Les champs SELECT, RADIO et CHECKBOX présentent des choix explicites (pas d'abréviations).
Etape(s):
Prototype
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.1.4(AAA)
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)
Identification
ID.006 - Format de l'adresse de contact -
Niveau 3
L'adresse de contact du produit respecte le formalisme "info@nomdedomaine" ou "support@nomdedomaine" lorsqu'un support "Helpdesk" est proposé à l'utilisateur.
Etape(s):
Prototype
Types d'exigence:
Ergonomie
Contenu
CT.006 - Centralisation des formulaires -
Niveau 3
La rubrique "Formulaires" centralise tous les formulaires (téléchargeables, remplissables en ligne ou autres) présents sur le site et ayant un rapport direct avec l'objet du site en question.
Etape(s):
Arborescence
Types d'exigence:
Ergonomie
CT.015 - Date de dernière mise à jour -
Niveau 3
Pour chaque page, la date de dernière mise à jour est affichée.
Etape(s):
Prototype
Types d'exigence:
Ergonomie
Référencement
CT.024 - Format des liens de téléchargement -
Niveau 1
Pour chaque élément proposé en téléchargement, le type, le poids du fichier et, si besoin la langue, est indiqué dans le texte de lien en respectant le formalisme suivant : Titre de l'élément - lang (type, poids en Ko, Mo ou Go) - nouvelle fenêtre
Etape(s):
Prototype
Rédaction
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
2.4.4(A)
Formulaire
FM.004 - Groupement de champs -
Niveau 1
Les champs sont visuellement regroupés (fieldset) et possèdent une légende, si cela facilite la compréhension.
2 champs ne peuvent avoir un même label sauf si un fielfset permet de les distinguer (exemple d'utilisation nécessaire : adresse de livraison / facturation)
Etape(s):
Prototype
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
1.3.1(A)
3.3.2(A)
FM.013 - Validation de formulaire -
Niveau 1
Le formulaire peut être validé à l'aide de la touche entrée.
Le formulaire est validable lorsque l'utilisateur est dans le dernier champs du formulaire.
Etape(s):
Prototype
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
2.1.1(A)
FM.019 - Conservation des informations saisies -
Niveau 3
En cas d'erreur, toutes les informations saisies par l'utilisateur (correctes et erronées) sont conservées et modifiables.
Etape(s):
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.3.6(AAA)
FM.022 - Aide contextuelle masquée -
Niveau 3
Lorsqu'une aide contextuelle masquée est proposée, elle apparait dans un encart à proximité du champs tout en permettant la saisie.
L'encart d'aide s'ouvre au clic.
Etape(s):
Prototype
Types d'exigence:
Ergonomie
Identification
ID.004 - Format des URLs -
Niveau 3
Les URLs du sites sont : - significatives - rédigées dans la même langue que la page - ne contiennent pas de caractères spéciaux, majuscules, de soulignés ou d’espace - utilisent le tiret comme séparateur de mots
Etape(s):
Final
Types d'exigence:
Ergonomie
Référencement
Contenu
CT.001 - Structure d'information exclusive -
Niveau 3
Les informations sont placées de manière exclusive dans l'arborescence du site
Etape(s):
Arborescence
Rédaction
Types d'exigence:
Ergonomie
Référencement
Accessibilité
CT.007 - Page "A propos du site" -
Niveau 3
La rubrique "A propos du site" donne des informations sur l'objet, l'éditeur et la qualité du site.
Etape(s):
Prototype
Final
Types d'exigence:
Ergonomie
CT.010 - Structure en pyramide inversée -
Niveau 3
La structure des pages et des rubriques respecte le principe de la pyramide inversée.
Ce principe consiste à donner un résumé de la page dans le premier paragraphe puis approfondir le sujet
Etape(s):
Arborescence
Types d'exigence:
Ergonomie
CT.016 - Scroll horizontal -
Niveau 2
Le site s'affiche sans scroll horizontal, sauf contenu spécifique et avec argumentation.
Le scroll est utilisé uniquement si une vue linéaire ne peut être utilisée. Les tableaux de données complexes et les graphiques sont des exceptions. Par contre, une image illustrative ne peut provoquer un scroll.
Etape(s):
Prototype
Final
Types d'exigence:
Ergonomie
Référencement
Accessibilité
WCAG 2.1:
1.4.10(AA)
CT.025 - Format des documents téléchargeables -
Niveau 3
Les documents téléchargeables sont de préférence proposés au format PDF (largement répandus)
Etape(s):
Rédaction
Final
Types d'exigence:
Ergonomie
Formulaire
FM.005 - Groupement de réponse -
Niveau 1
Les groupes d'options des champs SELECT sont balisés avec des éléments OPTGROUP dotés d'un libellé via l'attribut LABEL.
Etape(s):
Prototype
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
1.3.1(A)
Contenu
CT.004 - Centralisation des publications -
Niveau 3
La rubrique "Publications" centralise toutes les publications (documents dédiés à l'impression tels que des rapports, brochures, etc.) présentes sur le site.
Etape(s):
Arborescence
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
Contenu
CT.013 - Utilisation de titres explicites -
Niveau 3
Les pages sont organisées à l'aide de titres explicites et concis qui identifient l'information apportée par chaque section.
L'arborescence ne contient pas d'acronyme ou d'abréviation.
Etape(s):
Arborescence
Prototype
Rédaction
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.1.4(AAA)
Identification
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
Contenu
CT.022 - Indication du pays -
Niveau 3
Le pays est spécifié dans toutes les adresses postales proposées sur le site
EX: 2 beim Schlass L-8058 Bertrange ou 2 beim Schlass 8058 Bertrange (Luxembourg)
Etape(s):
Rédaction
Types d'exigence:
Ergonomie
CT.028 - Contenu des versions linguistiques -
Niveau 3
La structure et les informations d'une page disponible en plusieurs langues ne varient pas d'une version à l'autre.
Etape(s):
Prototype
Rédaction
Final
Types d'exigence:
Ergonomie
Formulaire
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)
FM.008 - Listes à choix uniques -
Niveau 1
Les champs INPUT RADIO sont utilisés pour des listes à choix uniques.
Si les boutons radio sont simulés, ils doivent satisfaire aux mêmes contraintes d'usage que les boutons radio natifs en HTML
Etape(s):
Final
Prototype
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
4.1.2(A)
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.017 - Messages d'erreur explicites -
Niveau 1
Les messages d'erreurs indiquent la nature de l'erreur ainsi que les moyens de correction de l'erreur directement après le champ et reliés.
<label for="document"> Ajouter un document à votre dossier </label> <input type="file" id="document" name="document" aria-invalid="true" aria-describedby="formats erreur" /> <p id="erreur">Format de fichier incorrect.</p> <p id="formats">Formats acceptés : pdf ou doc.</p>
Etape(s):
Final
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
3.1.1(A)
3.3.3(AA)
Identification
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
ID.008 - Cohérence avec les applications tierces -
Niveau 3
Les applications tierces sont cohérentes avec le site (url, interaction et charte graphique).
Etape(s):
Prototype
Types d'exigence:
Ergonomie
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
Contenu
CT.005 - Centralisation des législations -
Niveau 3
La rubrique "Législation" centralise toutes les normes légales (lois, règlements, arrêtés, etc.).
Etape(s):
Arborescence
Types d'exigence:
Ergonomie
CT.014 - Poids des pages -
Niveau 3
Le poids des pages n'excède pas 600Ko, sauf exception argumentée
Dans le cas de page complexe, un mécanisme évite les sauts de chargement (exemple: chargement progressif avec espace réservé).
Etape(s):
Prototype
Types d'exigence:
Ergonomie
Référencement
CT.023 - Format des numéros de téléphone -
Niveau 3
L'indicatif téléphonique du pays est précisé devant le(s) numéro(s) de téléphone et de fax proposé(s) sur le site web suivant le formalisme suivant (+352).
Etape(s):
Rédaction
Types d'exigence:
Ergonomie
Formulaire
FM.003 - Position du label -
Niveau 1
Les labels sont visibles et placés au dessus de leur champs
Pour les formulaires à champs unique, il peut être rendu visible en dupliquant le label au niveau du placeholder.
Etape(s):
Final
Prototype
Types d'exigence:
Accessibilité
Ergonomie
WCAG 2.1:
2.5.3(A)
FM.009 - Listes à choix multiples -
Niveau 3
Les champs INPUT CHECKBOX sont utilisés pour des listes à choix multiples (0,1 ou plusieurs choix possibles)
Etape(s):
Prototype
Types d'exigence:
Ergonomie
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.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.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)
Identification
ID.003 - Protocole HTTPS -
Niveau 3
Le site est uniquement consultable en https.
Etape(s):
Final
Types d'exigence:
Ergonomie
Référencement
ID.009 - Alias de communication -
Niveau 3
Lorsqu'un alias de communication (p.ex. guichet.lu) est défini il renvoie vers le nom de domaine officiel (p.ex guichet.public.lu)
Etape(s):
Final
Types d'exigence:
Ergonomie
Référencement
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.