8000 <Display> utilisé dans <Header> · Issue #345 · codegouvfr/react-dsfr · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

<Display> utilisé dans <Header> #345

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
martinratinaud opened this issue Nov 22, 2024 · 8 comments
Open

<Display> utilisé dans <Header> #345

martinratinaud opened this issue Nov 22, 2024 · 8 comments

Comments

@martinratinaud
Copy link

Bonjour, sur FCU nous utilisons le DSFR et après un audit SEO, nous nous sommes rendu compte que le 1er H1 sur notre page d'accueil affiche "Paramètres d'affichages"

Ceci vient de la modale Display qui est intégrée dans le Header

Plusieurs problèmes se posent ici

  • nous n'avons pas de mode sombre donc pas besoin de cette modale mais il n'est pas possible de l'enlever
  • la modale est directement dans le code source de la page alors qu'elle n'est sensée s'afficher au clic

Une possible solution serait

  • un flag "withDisplay" qui enlève cette modale

Pour la modale, cela me parait être une discussion plus circonstanciée à mener dans laquelle mon avis serait de ne pas intégrer le code dans le code source étant donné qu'il n'est pas affiché

Merci

@garronej
Copy link
Collaborator

Bonjour @martinratinaud,

Il y a un certain nombre de remarques ici qui ne sont pas spécifiquement liées à react-dsfr, mais qui concernent le DSFR dans son ensemble. Ce serait peut-être pertinent de faire remonter ces points au SIG : https://github.com/GouvernementFR/dsfr.

Nous n'avons pas de mode sombre.

Une option pourrait être ajoutée pour désactiver le composant Display, si cela pose des problèmes pour le SEO.

Cela dit, je comprends qu'il puisse y avoir un enjeu en termes d'opportunité pour proposer un mode sombre dans certains cas mais le DSFR propose des composants et un système de couleurs qui sont conçus pour permettre l'intégration d'un mode sombre sans coût de développement supplémentaire. Je ne suis pas certain de comprendre pourquoi cette possibilité devrais être désactivée.

De manière plus personnelle, je trouve que les sites sans mode sombre peuvent être un peu difficiles à lire, et j'essaie de passer le moins de temps possible dessus. Il est possible que je ne sois pas le seul dans cette situation, et ne pas proposer de mode sombre pourrait avoir un impact sur votre rétention.

@martinratinaud
Copy link
Author

Bonjour @garronej et merci pour la réponse

La prise en compte d'un mode sombre, au delà du DSFR, est couteuse, meme si les composants du DSFR le gèrent bien.

En effet, sur une codebase existante avec un vécu de 3 ans, une intégration incrémentale du DSFR doit pouvoir être possible et cela passe par choisir si un mode sombre est envisageable ou non.

C'est d'ailleurs en passant au DSFR que nous nous sommes rendus compte de tous les impacts visuels qu'il y avait (sur les cartes mapview et plein d'autres) et que nos utilisateurs et donneurs d'ordre nous ont fait remarquer que certains textes n'étaient aps visible (noir sur noir ou blanc sur blanc). Le cout pour tout mettre à jour et maintenir ensuite la code base a été rejeté, nous avons donc supprimé le mode sombre.

Merci

ddecrulle added a commit that referenced this issue Nov 22, 2024
martinratinaud added a commit to betagouv/france-chaleur-urbaine that referenced this issue Nov 22, 2024
martinratinaud added a commit to betagouv/france-chaleur-urbaine that referenced this issue Nov 22, 2024
@garronej
Copy link
Collaborator

Oui d’accord, je comprends que dans le cas d’une migration incrémentale, cela peut être un peu compliqué.
Mais je précise quand même, parce que la plupart du temps, les difficultés que rencontrent les gens pour supporter le mode sombre sont liées au fait qu’ils hardcodent les couleurs, alors qu’il existe un outil pour avoir des couleurs dynamiques :
https://components.react-dsfr.codegouv.studio/?path=/docs/%F0%9F%8E%A8-color-helper--page

Je vais essayer de faire en sorte que le composant display ne soit pas systématiquement inclus.

@m-maillot
Copy link
Contributor

Hello !
On a le même soucis sur le Code du travail numérique. On a notre experte accessibilité, qui a proposé de passer le h1 en <div role="heading" aria-level="1"> .
Cela permet de garder l'accessibilité du site et de ne pas impacter le SEO qui ne va pas détecter ces balises comme des h1.

Qu'en pensez vous ?

@m-maillot
Copy link
Contributor

J'ajoute que cela concerne aussi les modales qui pourrait être concernés. En fait, il y a toujours un clash entre le SEO et l'accessibilité. On essaie de faire avec les deux mondes mais l'astuce du div en role heading est une très bonne alternative pour concilier les deux mondes. Il faudrait pouvoir l'intégrer à la demande sur une modale. Surtout que l'utilisation du H1 dans la modale sur DSFR reste à discuter d'après leur doc.

Dans la doc, il parle de contenu annexe qui pourrait être ouvert dans une autre page. Dans le cas des paramètres d'affichage, je ne pense pas que l'on rentre dans ce cas de figure.

@ddecrulle
Copy link
Collaborator

En attente d'un retour GouvernementFR/dsfr#1062

@keryanS
Copy link
keryanS commented Dec 17, 2024

Bonjour,

Une réponse à été faite dans le ticket GouvernementFR/dsfr#1062

@garronej
Copy link
Collaborator

Thanks for the answer @keryanS!

@ddecrulle so I think we should maybe consider mounting the display component in the footer so it's at the bottom of the page. Or use some portals

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants
0