Checklist Renow 4.3

Présentation

• PR.030 - Mise en page pour l'impression - Niveau 3

  Une mise en page pour l'impression est créée à l'aide de CSS. Le nom du site, le titre de la page, le corps de la page sont présents.

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

• 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)

• PR.012 - Utilisation de mots-clés - Niveau 1

  Les expressions importantes et les mots-clés sont mis en évidence en gras.

  Pour l'accessibilité, la mise en évidence se fait à l'aide de balises appropriées (strong)

  • Etape(s):
    • Prototype
    • Final
    • Rédaction
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 1.3.1(A)

• 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)

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

Présentation

• PR.022 - Survol des liens - Niveau 3

  L'effet de roll-over des liens de contenu non-soulignés font apparaître un soulignement.

  • Etape(s):
    • Prototype
    • Final
  • Types d'exigence:
    • Ergonomie
    • Accessibilité
  • WCAG 2.1:
    • 2.4.7 (AA)

• PR.019 - Apparition d'alertes - Niveau 1

  Lorsqu'une alerte (ou un message d'erreur) apparait, l'utilisateur doit le comprendre immédiatement : visible à l'écran et accompagné d'un rôle approprié.

  Ce critère est applicable dans les formulaires ou dans les alertes. Il faudra utiliser les attributs role= alert ou aria-alertdialog.

  • Etape(s):
    • Prototype
    • Final
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 3.3.1(A)
    • 4.1.3(AA)

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

• ID.001 - Nom de domaine - Niveau 3

  Le nom de domaine respecte le formalisme nom.public.lu.

  • Etape(s):
    • Arborescence
  • Types d'exigence:
    • Ergonomie

Présentation

• PR.016 - Compatibilité navigateur - Niveau 2

  Le site est compatible sur les principaux navigateurs web (Firefox, Chrome, IE, Edge, Safari)

  Nous préconisons un affichage optimal pour les navigateurs cités jusqu'à 2 versions précédentes. Pour les versions antérieures, une dégradation dite “gracieuse” est mise en place et permettra un affichage non optimisé des pages du site.

  • Etape(s):
    • Prototype
    • Final
  • Types d'exigence:
    • Ergonomie
    • Référencement

• PR.001 - Catégorisation du menu - Niveau 3

  Les éléments de navigation thématiques, transversales et de support ne sont pas mélangés.

  • Etape(s):
    • Arborescence
    • Prototype
    • Final
  • 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

Présentation

• PR.024 - Onglet actif - Niveau 1

  L'onglet actif est relié à la portée de son contenu.

  Grâce à 2 mécanismes (visuellement et avec l'attribut aria-selected)

  • Etape(s):
    • Final
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 1.4.1(A)
    • 4.1.2(A)

• PR.015 - Utilisation des liens externes - Niveau 1

  Les liens externes (renvoyant vers un autre site) et les éléments téléchargeables s'ouvrent dans une nouvelle fenêtre. L'indication d'ouverture dans une nouvelle fenêtre est précisée dans l'attribut TITLE (intitulé - nouvelle fenêtre).

  L'information s'affiche au survole du lien. Pour l'accessibilité, l'ouverture dans une nouvelle fenêtre est essentielle.

  • Etape(s):
    • Final
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 2.4.4(A)

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.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.003 - Protocole HTTPS - Niveau 3

  Le site est uniquement consultable en https.

  • Etape(s):
    • Final
  • Types d'exigence:
    • Ergonomie
    • Référencement

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)

• PR.014 - Espacement des textes - Niveau 2

  L'utilisateur a la possibilité de modifier les espacements de texte: hauteur de ligne, espace entre les lettres, les mots, et les paragraphes. Cela ne doit pas provoquer de perte de contenus ou de fonctionnalités.

  • Etape(s):
    • Prototype
    • Final
  • Types d'exigence:
    • Accessibilité
    • Ergonomie
  • WCAG 2.1:
    • 1.4.12(AA)

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.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.002 - Favicone - Niveau 3

  Le site possède une favicon pertinente.

  • Etape(s):
    • Prototype
    • Final
    • Design graphique
  • Types d'exigence:
    • Ergonomie
    • Référencement

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)

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