Mémo design

Les recommandations ci-dessous sont extraites du guide du concepteur RGAA de la DINUM. Ce guide propose des fiches pour chaque thématique avec des conseils de design, l'explication du besoin pour les utilisateurs et des ressources complémentaires.

Le mémo design

Conception fonctionnelle

Images

  • Éviter les captchas. C’est bloquant pour beaucoup d’usagers et difficile pour tout le monde.
  • Décrire et prévoir un texte de remplacement pour les images complexes (infographie, graphiques, cartes, etc.)

Tableaux

  • Attribuer un titre pertinent à chaque tableau de données
  • Prévoir un résumé pour chaque tableau de données complexe.
  • Éviter les tableaux complexes avec des cellules fusionnées ou des sous-contextes

Formulaires

  • Définir une étiquette pertinente pour chaque champ de formulaire, y compris les listes de choix.
  • Ne pas utiliser placeholder comme étiquette.
  • Définir des intitulés de boutons pertinents.
  • Accoler chaque étiquette au champ qu’elle définit.
  • Regrouper les options des listes de choix si besoin, et attribuez une étiquette pertinence à chaque regroupement.
  • Indiquer les champs obligatoires dans l’étiquette du champ si besoin, à l’aide d’une mention ou d’un symbole dont la légende se trouve avant le formulaire.
  • Indiquer le format de saisie dans l’étiquette des champs obligatoires.
  • Insérer l’erreur de saisie à côté du champ concerné et indiquer un exemple de saisie réelle lorsque nécessaire.

Navigation

  • Prévoir un lien d’accès rapide au contenu.
  • Prévoir un lien d’accès rapide à la navigation principale si nécessaire.
  • Prévoir des liens d’accès rapide pour tous les groupes de liens importants.
  • Prévoir deux systèmes de navigation au moins.
  • Prévoir des liens facilitant la navigation dans les collections de pages.

Consultation

  • Indiquer le poids, le format et la langue de chaque fichier téléchargeable.
  • Créer un glossaire pour les expressions inhabituelles, les expressions idiomatiques ou le jargon.
  • Proposer une alternative aux textes nécessitant un niveau de lecture avancé.

Conception graphique

Couleurs

  • Prévoir une alternative textuelle à l’utilisation signifiante de la couleur sur un texte.
  • S’assurer que le contraste entre la couleur du texte et la couleur de l’arrière-plan est suffisant.
  • Fournir des méthodes de personnalisation de l’interface par l’utilisateur si les contrastes prévus par la charte graphique sont insuffisants.

Présentation

  • S’assurer que l’information n’est pas donnée uniquement par la forme ou la position d’un élément.
  • S’assurer que les liens sont correctement identifiables.
  • S’assurer que l’interlignage est suffisant.
  • S’assurer que la largeur des blocs de texte n’excède pas 80 caractères.
  • Donner la possibilité à l’utilisateur de contrôler la justification des textes.
  • Permettre à l’utilisateur de personnaliser la couleur de texte et la couleur d’arrière-plan lorsque les contrastes prévus par la charte graphique sont insuffisants.

Conception multimédia

Multimédia

  • Faire précéder tous les médias d’un titre.
  • Accompagner chaque vidéo d’une transcription textuelle ou d’une audiodescription synchronisée.
  • Fournir des sous-titres synchronisés pour chaque vidéo.
  • S’assurer que les dialogues sont suffisamment audibles.
  • Accompagner chaque vidéo d’une traduction en langue des signes si possible.
  • Ne pas déclencher de média automatiquement.
  • Fournir un lien clairement identifié permettant d’accéder à l’alternative accessible des médias non temporels.

Suivez notre actualité !

DesignGouv, c’est aussi des événements, des rencontres et des discussions pour faire vivre la culture design au sein des administrations. Rejoignez-nous !

Recevoir notre newsletter

Sur Twitter : @design_gouv