Accessibilité des réponses des bots

L’accessibilité numérique consiste à rendre les services en ligne accessibles aux personnes en situation de handicap. La direction interministérielle du numérique (DINUM) édite le référentiel général d’amélioration de l’accessibilité (RGAA).

Afin de proposer aux gestionnaires de bots de configurer du contenu qui respecte les normes RGAA sans avoir passer par le code source, dydu a intégré à son Bot Management System les normes RGAA appliquées à l’éditeur de contenu (WYSIWYG) dydu. Cela concerne les images, les listes, les pièces jointes, les ancres, les mises en forme de type gras, les iframes, les liens et les tableaux. Vous trouverez plus de détails ci-dessous sur les obligations d'accessibilité de ces éléments et comment les respecter avec le WYSIWYG.

Image

Obligation sur les images

Une image peut parfois être porteuse de sens et aider à comprendre le reste du contenu. Si elle n’apporte aucune information supplémentaire, elle est dite “décorative”.

Les images “informatives” ou “porteuses de sens” doivent posséder un attribut alt, c’est-à-dire une alternative textuelle. Cette alternative doit pouvoir remplacer l’image et apporter le même degré de compréhension.

A contrario les images dites “décoratives” doivent posséder un attribut alt vide.

Comment intégrer une image ?

• Pour intégrer une image, vous devez d'abord la télécharger dans la section galerie.

• Allez dans Contenus > Gallery

• Cliquez sur Ajouter

• Si vous n'avez pas encore de dossier, cliquez sur Créer un nouveau dossier dans Racine.

• Choisissez un nom pour votre dossier et cliquez sur Ajouter.

• Cliquez sur Ajouter > Importer un fichier dans Votre nom de dossier

• Choisissez un fichier, cliquez sur Importer, votre image est maintenant dans le dossier.

• Retournez dans la réponse de votre connaissance, cliquez sur Galerie, sélectionnez votre image.

Elle apprait dans la réponse.

Comment la respecter ?

Une fois votre image ajoutée à votre réponse, cliquez sur l'icône Insérer/modifier une image du WYSIWYG.

Par défaut, une image est considérée comme décorative, sa description (définie dans le champ “Description de l'image” est donc vide). Si votre image est décorative, la case “Decorative image” doit rester cochée et le champ “Description de l'image” doit être laissé vide.

A contrario, si vous considérez que votre image est porteuse d’informations : décochez la case “Decorative image” et ajoutez une description claire et concise dans le champ “Description de l'image”.

Listes

Obligation sur les listes

Les listes (listes à puces ou liste numérotée) et les éléments constitutifs de ces listes doivent être identifiés en tant que tels et donc disposer de balise html spécifiques. Pour ce faire, ils doivent avoir les bonnes balises html.

Comment la respecter ?

Dès lors que vous choisissez une mise en forme de type “Liste numérotée” ou “Liste à puces” les bons éléments html seront ainsi présents correctement. Ne créez pas la liste à partir de chiffres et de tirets “-” suivis d’un espace, cela ne créera qu’une suite de paragraphes sans qualification adéquate.

Liens

Obligation sur les liens

Les liens doivent être identifiables en tant que tels. Lorsque le lien ouvre un nouvel onglet ou une nouvelle fenêtre, cette information doit être perceptible par l’utilisateur avant qu’il ne déclenche l’ouverture du lien. L’utilisateur ne doit pas être perdu dans sa navigation.

Comment la respecter ?

Lorsque vous ajoutez un lien depuis le WYSIWYG (en cliquant sur l’icône Insérer/modifier un lien) vous avez la possibilité de choisir si ce lien s’ouvrira dans l’onglet en cours ou dans une nouvelle fenêtre via le champ “Cible”.

Si le champ “Cible” est “n/a”, alors le lien s’ouvrira dans le même onglet. Si le champ “Cible” est enregistré sur “Nouvelle fenêtre”, alors le lien s’ouvrira dans un nouvel onglet. Dans ce deuxième cas, une icône informant de ce comportement sera affichée automatiquement à côté du lien.

Par ailleurs, lorsque vous insérez un lien, le titre sera affiché au survol, il doit donc être clair et concis. Ce titre doit être complété dans le champ “Titre”.

Pièces jointes

Obligation sur les pièces jointes

Les pièces jointes téléchargables doivent être identifiables en tant que telles. Vous pouvez les ajouter depuis le menu Contenus > Galerie. Ensuite vous pouvez les sélectionner directement dans la Galerie de la réponse.

Les informations concernant le nom, le format et le poids des fichiers doivent être communiqués à l’utilisateur avant que ce dernier n’enclenche le téléchargement.

Comment la respecter ?

Dès lors que vous choisissez d’ajouter une pièce jointe au sein de votre réponse, le titre, le format et le poids de cette pièce jointe seront automatiquement affichés à l’utilisateur final. Cela s'affichera de la manière suivante :

Ancres

Obligation sur les ancres

Les ancres doivent être identifiées dans le code source par un identifiant unique généré automatiquement.

Comment la respecter ?

Les ancres sont utilisées, dans notre cas, par les fonctionnalités de reword ou redirection vers une connaissance.

Dès lors que vous ajoutez un reword ou une redirection vers une connaissance, un identifiant unique lui est associé et est généré dans le code source de la réponse. Veillez à ne pas le supprimer

Mise en forme de type “gras”

Obligation sur la mise en forme “gras”

Les éléments textes mis en forme “gras” doivent être indiqués dans le code par les balises html appelées balises “strong”. Cela permet d’identifier les éléments sur lesquels cette balise est appliquée comme des éléments importants.

Comment la respecter ?

Dès lors que vous choisissez une mise en forme de type “gras” B les bons éléments html seront automatiquement ajoutés.

Iframes

Obligation sur les iFrames

Les iframes (intégration de pages web notamment dans le panneau latéral) doivent comporter un titre.

Comment la respecter ?

Lors de l’ajout d’un iframe au sein du panneau latéral de votre réponse, ajoutez un titre concis et pertinent à votre panneau latéral.

Ce titre sera affiché à l’utilisateur final ainsi que dans le code html.

Tableaux

Obligation sur les tableaux

Les tableaux ne doivent pas être utilisés à des fins de mise en page. Ils doivent respecter une structure html précise. Il existe deux types de tableaux : simple et complexe.

• Un tableau simple est un tableau dans lequel les cellules d'en têtes s’appliquent systématiquement à la totalité des cellules d’une ligne ou d’une colonne.

• Un tableau complexe est un tableau possédant des cellules ou colonnes fusionnées.

A partir du WYSIWYG nous considérons uniquement la création de tableaux simples, avec des lignes et des colonnes.

Comment la respecter ?

Ne créez pas de tableau uniquement pour faire de la mise en page d’éléments.

Lorsque vous créez un tableau via le WYSIWYG, veillez à ajouter les bonnes propriétés aux cellules.

Sélectionnez les cellules de votre tableau que vous désirez mettre en en-tête puis cliquez sur l’icône Tableau et enfin sélectionnez > Cellule > Propriétés de la cellule

Vous accédez aux propriétés de la cellule. Dans le champ “Type de cellule”: sélectionnez “Cellule d'en-tête” :

Puis sélectionnez le scope voulu selon que l’en-tête concerne la colonne ou la rangée.

Si l’en-tête concerne la colonne, sélectionnez la valeur column dans le champ" étendue" ; s’il concerne la ligne sélectionnez la valeur ligne.

Les cellules considérées comme en-tête seront ainsi bien balisées et possèderont les bons attributs html.