• Qu'est-ce que l'accessibilité ?
• Comment développer du contenu accessible ?

• Comment jouer "accessible" sur PFR ?
• Conclusion

• Foire aux Questions : l'accessibilité sur PFR

• Définition générale
• Pourquoi l’accessibilité est cruciale sur PFR
• Les différents acteurs de l'accessibilité sur PFR

Définition générale

Selon le site du gouvernement français :

"L’accessibilité numérique consiste à rendre les contenus et services numériques compréhensibles et utilisables par les personnes en situation de handicap."

Terme dérivé de l'accessibilité physique, l'accessibilité numérique est le fait de rendre un contenu lisible, compréhensible et utilisable par tous. Cela implique donc de permettre à tous les utilisateurs de percevoir, comprendre, naviguer et interagir avec le contenu du site web. Le site web doit pouvoir être adapté quel que soit leurs outils technologiques, capacités physiques ou mentales et conditions d'utilisation. L'accessibilité web s'inscrit dans une démarche inclusive visant à rendre les outils web accessibles à tous les utilisateurs, quelles que soient leurs différences et leurs motivations.

Les sites internet accessibles permettent aux personnes handicapées d'accéder à leurs contenus et fonctionnalités sans difficulté. Un site accessible permet par exemple de naviguer avec une synthèse vocale ou une plage braille, de personnaliser l’affichage (grossissement des caractères, modification des couleurs, etc.), et de naviguer sans utiliser la souris. Sur un site tel que PFR, où chacun a la possibilité de produire son propre contenu (contexte, RPG, jeux, flood...), il s'agit à la fois d'un travail de la part du développeur du site (notre très cher Zachary Winslow), et aussi de tout utilisateur qui publie du contenu sur le site.

L'accessibilité web repose sur quatre piliers fondamentaux, définis par le Référentiel général d’amélioration de l’accessibilité (RGAA), et qui seront développé dans la partie 2 du guide : le pilier perceptible, le pilier utilisable, le pilier compréhensible et le pilier robuste.

Pourquoi l’accessibilité est cruciale sur PFR

L’accessibilité web est un enjeu fondamental pour tout site internet, et encore plus dans un espace dédié au jeu de rôle par l’écriture, où l’interaction et l’expression sont essentielles. Rendre un site accessible n'est pas seulement une obligation légale mais aussi un devoir moral. Cela permet au site d'être accueillant et de traiter ses utilisateurs avec équité.

Loin d’être un bénéfice limité aux seules personnes en situation de handicap, l’accessibilité améliore l’expérience de jeu pour l’ensemble des joueurs. En rendant PFR plus lisible, plus intuitif et plus ergonomique, on facilite la navigation pour tous qu'on soit sur petit ou grand écran. Cela permet également aux nouveaux joueurs de s'intégrer plus facilement. De même, l’optimisation des temps de chargement, la clarté du texte et une structuration logique des pages profitent à chaque utilisateur, quel que soit son profil. En intégrant des principes d’accessibilité, on garantit également une meilleure compatibilité avec les divers supports et technologies, comme les tablettes et les smartphones, ce qui est aujourd’hui indispensable.

Enfin, l’accessibilité contribue à réduire les frustrations : un site difficile à utiliser peut rapidement décourager les nouveaux joueurs, les amenant à quitter le site prématurément. À l’inverse, un site accessible favorise la fidélisation des membres de la communauté et les interactions entre eux. Sur un site immersif comme PFR, la fluidité des accès aux outils et informations ainsi que celle des interactions est capitale. Favoriser l’accessibilité ne se limite pas à respecter des normes, mais permet de bâtir un espace inclusif, efficace et agréable pour tous, renforçant ainsi la qualité et la pérennité du site.

Les différents acteurs de l'accessibilité sur PFR

Certaines améliorations relèvent de différentes responsabilités sur PFR :

• Le travail des développeurs/codeurs (ici, Zachary Winslow) concerne principalement les aspects techniques et structurels du site (ex : boutons, navigation, accessibilité clavier).
• Le travail des administrateurs (ici, Elina Montmort, Sarah Priddy, Nora Starks et Kristen Loewy) porte sur l’organisation des forums et la structuration des informations pour une meilleure accessibilité.
• Le travail des joueurs eux-mêmes concerne les BBcodes et la manière dont ils formatent leurs messages pour assurer une meilleure lisibilité et accessibilité.

L’accessibilité du site repose sur une collaboration entre toutes ces acteurs afin d’offrir une expérience utilisateur fluide et inclusive.

Avec la contribution d'Ernest Stevens.

L'accessibilité numérique se base sur 4 piliers essentiels qui permettent d'évaluer le niveau de lisibilité et de compréhension d'un site internet. Dans cette partie, on reviendra sur ces 4 piliers pour vous permettre de participer activement à la démarche de rendre PFR accessible à tous. Même sans coder le site, vous pouvez tous participer à l'améliorer à votre échelle !

• Pilier 1 : Le contenu perceptible

• Pilier 2 : Le contenu utilisable
• Pilier 3 : Le contenu compréhensible
• Pilier 4 : Le contenu robuste

Pilier 1 : Le contenu perceptible

Le contenu des pages web (informations et interface) doit être présenté de manière à pouvoir être perçu par tous les joueurs, y compris ceux ayant des difficultés sensorielles ou des handicaps. On va donc s'appuyer sur la perception visuelle et auditive. Par exemple, les images et vidéos doivent avoir une description écrite claire.

• Contrastes faibles et/ou insuffisants

De bons contrastes permettent de lire facilement un texte ou une image en couleur. Certaines déficiences visuelles ou conditions (fatigue, luminosité, taille du texte) ne permettent pas aux utilisateurs d'accéder facilement aux informations.

Solutions possibles (non-exhaustif) :

• Utiliser des couleurs s'éloignant du blanc, des couleurs vives et pastels.
• Utiliser un site vérificateur de contrastes comme Adobe contrast.
  Le site est utilisable en rentrant les codes couleur manuellement ou en important une image ou un screen. Le contraste doit être au minimum de 4.5 pour un texte en taille 100 ou moins sans gras.

  Les couleurs d'arrière-plan du site sont les suivantes :

  • Lieux "froids" (Cachots, Astronomie, Concilium, ect) : #BFBFBF
  • Lieux "chauds" (Poudlard, Chaudron Baveur) : #BFB38F
  • Lieux "neutres" (Pré-Au-Lard, Monde, ect) : #BFBAB8

  Attention : Les balises "Reducio" (texte caché à dérouler) et "Quote" (citation) éclaircissent l'arrière plan.

• Utiliser un site correcteur de contrastes comme Contrast finder.

• Absence de textes alternatifs

Les images et icones ne sont pas lues par les lecteurs d'écran, et cela rend la compréhension des pages plus difficiles pour les joueurs qui les utilisent. Le but ici n'est pas de supprimer entièrement les images de vos messages mais de rendre accessible le contenu de celles qui sont les plus importantes (exemple : devoirs rendus, plans d'un lieu, fiches RP...).

Solutions possibles (non-exhaustif) :

• Proposer des descriptions textuelles en reducio (balise déroulante) ou en revelio (texte caché) pour les images et graphismes.
• Ajouter des mots pour décrire les icones à côté de celles ci en utilisant la balise de couleur "transparent" :

  Code : Tout sélectionner

  [color=transparent]mot[/color]

Attention : Ne pas utiliser la balise "Taille 1" dont le texte n'est pas reconnu par les lecteurs.

• Polices illisibles

Que ce soit parce que les joueurs utilisent une police particulière ou parce qu'ils écrivent trop petit, on peut parfois avoir du mal à lire leurs messages.

Solutions possibles (non-exhaustif) :

• Ne pas alourdir les titres des sujets avec des icônes, polices particulières ou un titre uniquement en majuscules.
• Utiliser une taille de police suffisamment élevée (taille minimale recommandée : 85).
• Utiliser une police d'écriture (style : dafont, fontmeme) avec des lettres décollées et bien formées).

• Contenu non-adaptable ou visuellement agressif

Il est parfois difficile de naviguer sur téléphone, ou de rester longtemps sur une page à cause des différentes animations. On sait par exemple que la neige qui tombe en fond peut être dérangeante : c'est la même chose dans les zones de texte.

Solutions possibles (non-exhaustif) :

• Éviter les animations qui se répètent (gif) ou fournir une option pour les désactiver.
• Privilégier les animations qui s'arrêtent automatiquement, ou dont on peut choisir la durée de boucle.
• Éviter les animations sur des titres ou du texte important.
• Éviter les gifs qui prennent tout l'écran.
• Ajouter des images cliquables qui puissent être ouvertes dans une autre fenêtre pour une meilleure visibilité : exemple sur cette fiche RP.

  Code : Tout sélectionner

  [url=url de l'image][img]url de l'image[/img][/url]

• Modifier sa mise en page ou en proposer une alternative qui soit lisible sur téléphone, et surtout par les lecteurs et autres outils d'assistance.

  • Éviter les tableaux à plus de deux colonnes.
  • Éviter de mettre les images à gauche (cela fait "sortir" le texte sur la droite)

• Proposer le texte sans mise en page à la fin de son sujet sous un reducio.

• Exemples sur PFR

• Les couleurs : Ceci est une couleur lisible, au bon contraste, celle-ci n'est pas une couleur lisible (contraste inférieur à 4.5).
• Les tailles de polices : Cette taille de police est facilement lisible (>85), cette taille de police est trop petite (<85).
• Les styles de polices : Cette police est lisible : lien ; celle-ci ne l'est pas : lien.
• Les légendes d'images : Ce sujet possède des images légendées : Manuel de vol en couleur invisible et les lecteurs peuvent donc fonctionner. Ce message est aussi légendé, cette fois-ci en noir : Manuel de sortilège - Message 2.
• Les noms de sujets : Ces titres de sujets sont difficilement lisibles :
  
  Reducio

  
  
  Ces titres sont lisibles :
  
  Reducio

  
  
  

Rédigé par Cinaed Wallace et Owen Locke.

• Pilier 1 : Le contenu perceptible
• Pilier 2 : Le contenu utilisable

• Pilier 3 : Le contenu compréhensible
• Pilier 4 : Le contenu robuste

Pilier 2 : Le contenu utilisable

Un contenu utilisable est un contenu qui permet à tout utilisateur, quelles que soient ses capacités, de naviguer, d’interagir et d’accomplir des tâches sur le site sans obstacle technique. Cela signifie que chaque fonction du site doit être intuitive et accessible, que ce soit via une souris, un clavier ou un écran tactile.

Ces optimisations relèvent en grande partie du travail des codeurs et administrateurs du site, qui veillent à améliorer l’accessibilité et l’ergonomie de PFR. Il nous semble néanmoins important de les détailler ici afin de mieux comprendre les défis liés à l’accessibilité sur internet et d’identifier les solutions possibles.

• Navigation complexe

L’accès à certaines sections du site nécessite un enchaînement de clics ou d’étapes mal définies. Par exemple, accéder à des sous-sections comme des salles spécifiques de Poudlard ou des fiches de personnages peut être particulièrement fastidieux, surtout pour les nouveaux joueurs qui n’ont pas encore pris leurs repères.

Solutions possibles (non-exhaustif) :

• Regrouper et simplifier les menus

• Réduire le nombre de clics nécessaires pour accéder aux sections essentielles.
• Créer des menus déroulants logiques avec des catégories plus intuitives (ex : « Lieux de Poudlard », « Monde extérieur », « Encyclopédie », etc.).
• Éviter la multiplication des sous-menus imbriqués qui rendent la navigation confuse.

• Ajouter des raccourcis visibles et personnalisables

• Intégrer une barre d’accès rapide pour les pages les plus utilisées (ex : volière, fiche personnage, messages non lus).
• Permettre aux joueurs de marquer certains forums comme favoris pour y accéder directement depuis leur profil ou un menu spécifique.
• Mettre en avant le petit panneau en haut à gauche des pages qui affiche les sous-forums liés au forum où l’on se trouve. Cet outil est très pratique pour naviguer entre deux sous-forums, mais il est encore peu connu.
• Porposer un accès direct aux lieux clés (Encyclopédie, Salles de cours, Volière, Bibliothèque, etc.) qui pourrait être ajouté dans un menu permanent.

• Améliorer la fonction de recherche

• Ajouter un système de tags ou de filtres pour retrouver plus facilement des contenus liés (ex : #Cours, #Encyclopédie, #MaisonSerdaigle).

• Intégrer une aide interactive

• Proposer un tutoriel de navigation pour les nouveaux inscrits avec des indications sur les raccourcis et la structure du site.
• Mettre en place un système de guides interactifs pour expliquer la navigation de manière progressive.

• Créer un index intégré sur PFR sans alourdir l’interface

• Créer une page récapitulative sous forme de liens interactifs plutôt qu’un unique sujet long et statique. Ce format permettrait aux joueurs de retrouver rapidement un lieu spécifique sans trop scroller.

• Boutons mal positionnés ou trop petits

Certains boutons, comme ceux utilisés pour répondre à des messages ou prévisualiser un post, sont petits ou mal espacés, ce qui rend leur utilisation difficile, notamment sur mobile. De plus, un mauvais positionnement peut générer des clics accidentels, ce qui est frustrant.

Solutions possibles (non-exhaustif) :

• Agrandir et espacer les boutons interactifs

• Augmenter la taille des boutons critiques pour une meilleure visibilité et accessibilité.
• Espacer les éléments pour éviter les erreurs de clic, notamment sur les boutons proches les uns des autres comme "Répondre" et "Citer".
• S’assurer que les liens intégrés dans les BBcodes sont suffisamment grands pour être cliquables facilement.
• Vérifier le contraste et l’apparence des liens dans les BBcodes.

• Ajouter des confirmations pour les actions sensibles

• Intégrer une fenêtre de confirmation avant des actions irréversibles (ex : suppression de message, validation d’un achat en boutique).

• Améliorer la visibilité des boutons

• Assurer un contraste suffisant entre les boutons et leur arrière-plan pour éviter qu’ils se fondent dans l’interface.
• Ajouter des icônes explicites en complément du texte pour renforcer la compréhension des actions proposées.

• Tester la disposition des boutons sur mobile

• Vérifier que les boutons restent facilement accessibles sur les petits écrans et ne nécessitent pas de zoom excessif pour être utilisés.
• Regrouper certaines actions dans des menus déroulants mobiles pour éviter la surcharge d’éléments visibles en permanence.

• Accessibilité au clavier

Certaines fonctionnalités ou sections ne sont pas accessibles via la navigation au clavier, ce qui complique l’usage pour les personnes ne pouvant pas utiliser une souris. Par exemple, il est parfois impossible d’accéder à des menus déroulants ou à des champs de texte via la touche Tabulation.

Solutions possibles (non-exhaustif) :

• S’assurer que chaque fonctionnalité est accessible via la touche Tab

• Mettre en place des commandes spécifiques (ex. : "Alt + M" pour accéder directement aux messages non lus, ou "Alt + P" pour ouvrir la fiche personnage).
• Ajouter des balises ARIA

Qu'est-ce qu'une balise ARIA ?

Les balises ARIA (Accessible Rich Internet Applications) sont des attributs HTML spécialement conçus pour améliorer l’accessibilité des sites web en rendant les éléments interactifs lisibles et compréhensibles par les technologies d’assistance (comme les lecteurs d’écran).

Contrairement aux balises alt, qui servent uniquement à décrire des images, les balises ARIA permettent :

• D’ajouter des indications sur la fonction des boutons, menus et formulaires
• De rendre les éléments dynamiques accessibles, notamment les menus déroulants et les fenêtres modales
• D’indiquer les changements d’état d’un élément (ex. : un bouton actif ou désactivé)

Ces balises sont particulièrement utiles pour garantir que toutes les personnes, y compris celles utilisant un lecteur d’écran, puissent naviguer efficacement sur le site.

• Temps limité pour accomplir des tâches

Des délais stricts pour accomplir certaines tâches (comme remplir un formulaire ou répondre à un devoir) peuvent poser problème aux utilisateurs ayant besoin de plus de temps, en raison de troubles cognitifs ou de limitations physiques.

Solutions possibles (non-exhaustif) :

• Permettre une sauvegarde temporaire des réponses avant soumission pour éviter toute perte de données.

• Note finale sur la mise en place des améliorations

L’ensemble des recommandations et solutions présentées dans ce guide vise à rendre PFR plus accessible et agréable pour tous. Certaines de ces améliorations sont déjà en place, d’autres sont en cours de développement, et certaines peuvent nécessiter un temps d’implémentation plus long en raison de leur complexité technique.

L'équipe de développement et d’administration (Zachary, Elina, Sarah, Nora, Kristen) travaillent activement à l’amélioration continue du site, en tenant compte des retours et des besoins exprimés par la communauté. Cependant, certaines optimisations demandent des ajustements techniques importants ou doivent être intégrées progressivement pour garantir un fonctionnement optimal et cohérent avec la structure actuelle de PFR.

Nous vous remercions donc pour votre patience et votre compréhension. Si une suggestion mentionnée dans ce guide n’est pas encore mise en place, cela ne signifie pas qu’elle est ignorée, mais simplement qu’elle nécessite un travail supplémentaire pour être appliquée dans les meilleures conditions.

N’hésitez pas à partager vos retours de manière constructive et bienveillante : chaque retour aide à affiner et à améliorer l’expérience de jeu pour l’ensemble de la communauté !

Rédigé par Ernest Stevens.

• Pilier 1 : Le contenu perceptible
• Pilier 2 : Le contenu utilisable
• Pilier 3 : Le contenu compréhensible

• Pilier 4 : Le contenu robuste

Pilier 3 : Le contenu compréhensible

Un contenu compréhensible est un contenu qui permet à tout utilisateur de lire et interagir avec le site. Il doit pouvoir comprendre le contenu sans confusion qu'importent ses capacités. Cela implique une rédaction claire, une structure logique et l’absence d’ambiguïtés dans les messages et instructions.

Ces améliorations concernent tous les joueurs de Poudlard.fr, qu'ils possèdent un rôle ou pas. L’objectif est de faciliter la communication et d’éviter les incompréhensions qui pourraient être sources de frustration.

• Manque de structuration des textes

Un texte trop dense, sans paragraphes ni organisation visuelle, rend la lecture difficile. Les informations sont alors compliquées à comprendre pour les personnes dyslexiques, neurodivergentes ou celles qui consultent le site sur mobile.

Solutions possibles (non-exhaustif) :

• Utiliser des titres et sous-titres explicites pour organiser les informations
• Utiliser un sommaire au début des sujets ou des posts avec des liens et des ancres
• Introduire des listes à puces pour synthétiser des points importants
• Proposer des récapitulatifs pour les sujets longs
• Aérer le texte avec des paragraphes courts et bien définis
• Utiliser des phrases courtes quitte à les couper en deux
• Mettre en avant les informations importantes (par exemple, en gras)

Exemples sur PFR :

• Sommaire de post + titres et sous titres : Charte de modération de Poudlard.fr
• Liste à puces : L'alimentation sorcière
• Informations importantes en gras : Les transports magiques

• Instructions peu claires ou ambiguës

Les annonces et explications peuvent manquer de précisions, ce qui complique la compréhension des consignes. Les joueurs doivent pouvoir comprendre tous les attendus rapidement. Ils doivent aussi pouvoir les comprendre correctement et sans incertitude.

Solutions possibles (non-exhaustif) :

• Rédiger des instructions en langage simple et direct
• Expliciter toutes les informations clairement même celles qui paraissent logiques
• Donner des exemples concrets pour illustrer une règle ou une action
• Faire une FaQ (foire aux questions) reprenant clairement les questions posées et leur réponse ou modifier le sujet pour éclaircir les points problématiques

Exemples sur PFR :

• Une question typée : "Faites une recherche complète sur le sort" est ambiguë. Une question typée : "Donnez-moi la formule et la gestuelle du sort" est explicite.
• FaQ claire : Le système JoBaRBiLLe
• Exemples concrets : Création et utilisation des PNJ - 3.0

• Usage du jargon et des abréviations

La communauté de Poudlard.fr utilise beaucoup de termes spécifiques au RPG ou au site. Cela peut être un frein pour les nouveaux joueurs ou pour ceux ayant des difficultés de compréhension. La communication ne peut pas se faire efficacement si une des deux parties ne comprend pas le langage utilisé.

Solutions possibles (non-exhaustif) :

• Éviter les abréviations dans les textes informatifs ou les expliciter.
• Inclure des notes pour expliquer les acronymes. On pourra utiliser des ancres ou simplement la balise de la mise en indice₁ ou en exposant².

  Code : Tout sélectionner

  [sub]indice[/sub] [sup]exposant[/sup]

• Éviter les termes spécifiques à PFR dans les textes informatifs.
• Mettre en avant le sujet Le dictionnaire de Poudlard.fr pour les nouveaux joueurs et vos filleuls.

Exemples sur PFR :

• Explication des acronymes : Rescencement des filières et options
• Utilisation d'exposant avec ancre : Les sports magiques
• Les phrases suivantes sont difficilement compréhensibles :
  "Vos PNJs ne se jouent pas HRP" ; "Pour toute info supp demandez à votre DDM ou vos PA"
• Les phrases suivantes sont facilement compréhensibles :
  "Vos PNJs (personnages non joueurs) ne se jouent pas en dehors de vos RPG" ; "Pour toute information supplémentaire, demandez à votre Directeur de Maison ou aux Professeurs affiliés"

• Absence de marqueurs de ton

De nombreuses personnes, neurodivergentes ou non, n'arrivent pas à comprendre les sous-entendus des messages. L'ironie, l'humour et le sarcasme peuvent donc être mal interprétés. Ces difficultés de communication peuvent mener à des conflits. Afin que tous les joueurs puissent avoir une bonne expérience de jeu, les intentions doivent être claires et sans ambiguïté.

Solutions possibles (non-exhaustif) :

• Utiliser des marqueurs de ton pour expliciter l’intention d’un message.
• Écrivez les marqueurs en toute lettre et en français : écrire "/blague" et non pas "/b" ou "/joke". Les marqueurs s'écrivent le plus souvent entre parenthèses ou après un slash /
• Encourager une communication bienveillante, surtout dans les messages hors RPG.
• Ne pas utiliser de sarcasme ou d'ironie durant un conflit.
• Expliciter vos attentions avant votre message si vous avez des doutes : "Mon message peut paraître froid mais mon intention est [...]"

Exemples sur PFR :

• Les phrases suivantes sont ambigües avec ou sans contexte :
  "De toute façon, John on l'aime pas nous" ; "Je veux bien parler avec lui pour régler le conflit mais bon, s'il savait discuter..." ; "Ah bah oui c'est une super idée de pas suivre ta modération !"
  - Les phrases suivantes sont explicites :
  "De toute façon, John on l'aime pas nous (humour)" ; "Je veux bien parler avec lui [...] mais il ne communique pas" ; "C'est pas une bonne idée de pas suivre ta modération !"

Rédigé par Ernest Stevens et Cinaed Wallace.

• Pilier 1 : Le contenu perceptible
• Pilier 2 : Le contenu utilisable
• Pilier 3 : Le contenu compréhensible
• Pilier 4 : Le contenu robuste

Pilier 4 : Le contenu robuste

Un site robuste est un site qui fonctionne correctement sur tous les appareils, qui est compatible avec les technologies d’assistance et qui reste lisible sur différents navigateurs et tailles d’écrans. Cela implique un développement web fiable et des mises à jour régulières pour assurer la compatibilité avec les outils modernes.

• Incompatibilité avec certains navigateurs

Certains éléments (BBCode, boutons, animations, menus déroulants) ne s’affichent pas correctement selon le navigateur utilisé. Ces soucis relèvent, pour la plupart, du code du site : seul le fondateur, Zachary, peut modifier cela. Certaines choses, en revanche, relèvent de la mise en page et peuvent être gérée par les joueurs directement.

Solutions possibles (non-exhaustif) :

• Tester les mises en page sur plusieurs navigateurs (Firefox, Chrome, Safari...).
• Pour les utilisateurs de lecteurs d'écran, nous vous recommandons d'utiliser les navigateurs Chrome, Edge ou Safari, qui présentent davantage de compatibilité avec les outils d'accessibilité.

• Structure du site non standardisée

De manière plus générale, le contenu robuste vise à favoriser le contenu web qui ne contient aucune erreur de code ou balise non conforme (ce qui peut nuire à l'accès du contenu, peut importe l'appareil utilisé). Si ce point relève davantage du codage du site, il existe une nuance qui nous concerne tous en tant que joueurs : la structure du site.

À l'échelle des administrateurs (principalement) et modérateurs, nous pouvons parler de hiérarchie des informations et d'arborescence (l'organisation des différents forums du site, et comment ils se présentent). Un contenu web jugé robuste implique un site internet bien construit, logique et cohérent, de manière à ce que l'utilisateur ne s'y perde pas.

À l'échelle des joueurs, nous pouvons parler de mise en page, où l'art de rédiger des sujets avec une structure unifiée, logique et intuitive.

Solutions possibles (non-exhaustif) :

• Créer une arborescence du site simple et logique
• Créer et maintenir une hiérarchie visuelle claire dans les graphismes du site
• Mettre en valeur les forums, sujets et éléments importants
• Optimiser la structure de page : titres (H1, H2, H3...) pertinents, bonnes balises de navigation
• Rendre visibles et accessibles les éléments de navigations principaux (menu, fil d'Ariane et autres repères) sur toutes les pages du site
• Établir des standards clairs pour la rédaction et la mise en page des sujets, pour une lecture linéaire et cohérente
• Vérifier la cohérence des styles sur toutes les pages du site

Nota bene : Au moment où nous rédigeons cette partie du guide (15 août 2025), nous avons conscience que certaines parties du site nécessitent des changements afin d'optimiser l'expérience utilisateur. Dans le cas où ce guide sorte avant certains autres de nos projets, nous tenons à vous informer qu'une refonte de l'organisation de certains panneau du site (à commencer par l'encyclopédie, mais pas que) est en cours. Nous vous remercions pour votre patience et votre compréhension.

• Problèmes de navigation pour les lecteurs d’écran

Certains éléments présents dans le contenu posté sur le site, comme les icônes, boutons, tableaux ou encore textes en images, ne sont pas toujours lisibles par les technologies d’assistance (comme les lecteurs d'écran).

Ne sont pas du tout détectés par les lecteurs d'écran :

• Les couleurs de texte
• Les icônes PFR

Sont détectés mais peuvent être difficilement compréhensibles :

• Les images mal référencées (exemple : titre non explicite du fichier)
• Les emojis inclus dans le bb code proposé par le site : les emojis classiques sont lus, mais les plus complexes ne sont pas bien décrits
• Certains tableaux sont complexes

Solutions possibles (non-exhaustif) :

• Inclure une description courte d'une image ou retranscrire le contenu textuel d'une image en version texte : les EdT à Poudlard
• Rendre les icônes et boutons textuellement descriptibles (codage du site)
• Incorporer du texte avec les icônes dans un texte qui contiendrait un lien : pas de , mais plutôt Cliquez ici :
• Indiquer en version texte si une image contient un lien : les EdT des examens RP 2049/2050)
• Proposer des versions textes alternatives pour certains tableaux
• Signaler dans son premier post de RPs si l'on emploie une couleur pour ses dialogues, en en précisant le BBcode (code html), afin que l'utilisateur d'un lecteur d'écran en prenne connaissance et puisse l'appliquer

• Problèmes d’affichage sur mobile

Certains tableaux, images ou mises en page ne s’adaptent pas bien aux écrans plus petits comme ceux des smartphones : en résulte un mauvais cadrage, avec une partie des tableaux ou des images dépassant de la page.

Solutions possibles (non-exhaustif) :

• Tester la compatibilité mobile
• Adapter les tableaux et images pour être "responsive"

Qu'est-ce qu'un contenu responsive ?
Il s'agit d'un contenu web qui s'adapte automatiquement au format et à la résolution de l'écran sur lequel il est consulté, qu'il s'agisse d'un smartphone, d'une tablette ou d'un ordinateur.

Avec la contribution d'Ernest Stevens et de Calianor Daenarya.

• Outils pour faciliter l’accessibilité web
• Optimiser son expérience sur Poudlard.fr
• Ressources supplémentaires

Outils pour faciliter l’accessibilité web

• Outils pour faciliter la lecture et la compréhension

Lecteurs de texte (screen readers) :

• NVDA (gratuit)
• JAWS (payant)
• VoiceOver (inclus sur Mac)
• Lecteurs sur smartphone

Applications de synthèse vocale :

• Balabolka
• Natural Reader
• Extension Chrome “Read Aloud”

Outils de simplification de texte :

• Pour simplifier les phrases : Text Compactor, Rewordify (anglais), Scolarius (français)
• Extensions de navigateur pour ajuster la police, les couleurs ou réduire les distractions :
  Dyslexie Font, OpenDyslexic, Dark Reader, Mercury Reader

• Outils pour améliorer la navigation sur le site

• Logiciels d’agrandissement de texte ou de zoom : fonctionnalité native des navigateurs, ZoomText
• Extensions de contraste ou filtres de couleur
• Navigation au clavier : clic droit (ou sa touche clavier équivalente selon le lecteur d'écran) ou "shift+F10" pour faire apparaître certains sous-menus du site
• Focus sur les raccourcis de navigation : le menu et le fil d'Ariane sont toujours disponibles en survolant (ordinateur) ou cliquant (smartphone, tablette) sur le blason placé en haut à gauche de l'écran.

• Outils d’aide à l’écriture

• Logiciels d’agrandissement de texte ou de zoom : fonctionnalité native des navigateurs, ZoomText
• Correcteurs orthographiques et grammaticaux : Antidote (logiciel payant), Scribens (site gratuit), MerciApp (site payant)
• Outils de dictée vocale : Google Docs dictée, Dragon Naturally Speaking
• Les emojis pour exprimer des émotions : disponible en dernière position dans la barre de BBCode

Optimiser son expérience sur Poudlard.fr

• Réglages et astuces d’ergonomie sur PFR

Tu peux régler certaines options pour améliorer ton confort de jeu sur PFR. Pour cela :

1. Passe ta souris sur ton avatar, affiché en haut à droite de l'écran. Un menu se déroule : "profil", "compte", "bourse", etc..
2. Clique sur "compte". Une nouvelle page apparaît, semblable à un formulaire (relatif à ton mail et ton mot de passe).
3. Au-dessus, clique à nouveau sur "compte". Attention, il n'apparaît ni comme un bouton, ni comme un menu explicite. Un nouveau menu se déroule : "compte", "personnage", "avatar", "signature", "préférences", "ignorés".
4. Clique sur "préférences". De là, tu peux activer ou désactiver un certain nombre de choses : l'affichage de la barre de raccourcis en bas de l'écran, l'affichage du nombre de hiboux reçus et notifications non lues, l'activation/la désactivation des animations (hiboux qui sautille, neige qui tombe en hiver), etc.

• Utilisation des balises et du formatage

• Lisibilité du texte : nous vous conseillons de structurer vos textes avec une hiérarchie intuitive (titre, sous-titre, puis texte) et un bb code simple. Il vaut mieux favoriser les paragraphes courts et l'utilisation des listes à puces, et au contraire éviter les textes trop longs et peu aérés, avec du bb code difficile à lire.
• Le bb code proposé sur PFR n'inclue pas de balises alt (descriptions alternatives aux images) de manière directe. En revanche, nous vous conseillons d'utiliser l'option de texte caché (revelio) pour ajouter cette description alternatives aux images (qui ne sont pas forcément lues par les lecteurs d'écran), en-dessous de celles-ci.
• Afin de présenter un texte clair et compréhensible pour tous, nous vous suggérons d'éviter les mots non-francophones et les abréviations à outrance. Privilégiez un langage clair.

• Fonctionnalités propres à PFR

• La navigation sur le site

• Le menu de navigation se trouve à gauche de la page : survolez le blason du forum, en haut à gauche, pour le faire apparaître. Il vous permet de vous déplacer jusqu'à n'importe quel forum du site. Vous pourrez y retrouver votre cheminement à l'aise des forums soulignés.
• Votre profil se trouve à droite de la page : survolez votre avatar, en haut à droite, pour le faire apparaître. Tout ce qui concerne votre compte s'y trouve : paramètres (compte), bourse, malle, bulletin...
• Sur la même ligne de commandes que votre profil, se trouve le menu des messages et RPG. Elle est positionnée en 2ème en partant de la droite, symbolisée par une plume. Là, vous pourrez consulter les messages non lus, vos messages postés, vos RPG, vos brouillons... et même faire des recherches sur le site, ou dans le carnet d'adresse.
• Toujours sur la même ligne de commandes, se trouve le rapeltout. En 3ème position en partant de la droite, et symbolisé par un cercle qui se colore de rouge, vous pouvez alors y voir vos notifications.
• Pour finir et encore sur la même ligne, se trouve la messagerie. Elle est positionnée en 4ème en partant de la droite, symbolisée par une enveloppe. Là, vous pourrez consulter les "hiboux" reçus, et en envoyer.
• Retrouvez ici le "guide ultime de PFR" : une sorte d'index des index. Ce sujet est là pour vous aider à naviguer sereinement sur le site.

• Signaler un problème

• Si vous rencontrez des difficultés en terme de navigation ou d'accessibilité sur le site, vous pouvez consulter/poster dans la FaQ sur l'accessibilité.
• Si vous rencontrez des difficultés avec un autre joueur, vous pouvez contacter le médiateur du site.
• Si vous rencontrez des difficultés avec avec hibou reçu ou un message lu, vous pouvez le rapporter. Pour cela, lorsque vous êtes sur le hibou/message en question, cliquez sur l'icône en forme de point d'exclamation. Un formulaire apparaîtra pour que vous puissiez détailler la nature du problème, et les administrateurs et modérateurs en seront avertis afin de prendre en main la situation.

Ressources supplémentaires

• Associations : APF France Handicap, AccessiWeb
• Conseils pratiques pour l’accessibilité du web : Référentiel Général d’Amélioration de l’Accessibilité, W3C : Introduction à l’accessibilité du web, Standout France : Guide pratique
• FaQ collaborative sur l'accessibilité sur PFR : nous vous rappelons son existence, et son principe : tout utilisateur du site peut y poster ses conseils et astuces ou répondre aux questions qui y sont posées !

En conclusion, l'objectif de rendre le site plus accessible est un objectif commun et surtout, sur la durée. Chaque joueur créant du contenu sur Poudlard.fr peut participer à améliorer l'expérience des joueurs ayant des difficultés. Ce sont les efforts journaliers de tous les joueurs qui participeront à faire de Poudlard.fr un site compréhensible et utilisable par le plus grand nombre.

Il ne s'agit cependant pas de devenir une police de l'accessibilité : vous restez libre de votre façon d'écrire et de coder mais de petits efforts peuvent grandement améliorer l'expérience des joueurs qui vous entourent. Avec ce guide, vous avez pu apprendre à mieux coder vos messages ou encore à vous exprimer avec plus de clarté. N'hésitez pas à vous servir de tout cela ! Un sujet peut être codé sans rogner sur l'accessibilité : ajouter le texte brut sous reducio (balise déroulante) est un effort rapide et qui aidera énormément les joueurs ayant des difficultés.

Avec le temps, chacun apprendra à devenir plus accessible sans avoir à y penser. Le tout est d'y aller petit à petit et de rester patient avec les joueurs utilisant des outils d'aide ou ne pouvant pas en utiliser.

N'hésitez pas non plus à faire remonter des sujets que vous trouvez difficile à comprendre. On ne remarque pas forcément quand notre contenu est difficile à suivre alors s'entraider est important. Si vous ne savez pas comment faire remonter une remarque ou gérer une situation avec un autre joueur, la médiatrice ou le médiateur saura vous accompagner. Une demande de médiation n'est jamais "inutile" car elle permet à vous et aux autres d'échanger sainement.

Si vous êtes vous-même un joueur ayant des difficultés à naviguer sur le site, les modérateurs et admins sont à votre disposition pour vous aider. Partager votre expérience ou vos difficultés nous permettra d'améliorer l'accessibilité du site. Cela permettra également de mettre des choses en place pour vous faciliter la vie.

Liens utiles :

• Groupe "Médiateur" dans le carnet d'adresse : Lien
• Page "Équipe" pour contacter les modérateurs : Lien
• Sujet "Les différents rôles de PFR et les interlocuteurs à privilégier" : Lien

Rédigé par Cinaed Wallace.