From de95af529d97f60b6f694ef55cd876eed506e583 Mon Sep 17 00:00:00 2001 From: Guillaume Moizan Date: Fri, 12 Apr 2024 17:16:45 +0200 Subject: [PATCH 1/2] =?UTF-8?q?M=C3=A0J=20texte=20Stack=20technique?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- index.html | 29 ++++++++++++----------------- 1 file changed, 12 insertions(+), 17 deletions(-) diff --git a/index.html b/index.html index fcb77be..cfa9c19 100644 --- a/index.html +++ b/index.html @@ -144,36 +144,31 @@

Stack Technique

- Le HTML structure et porte l'information d'une page web. Il est nativement accessible à condition d'utiliser les - balises en respectant leurs valeurs sémantiques. Exemple : <div> et <span> n'ont pas de valeur sémantique, - elles servent à mettre en forme et grouper des éléments. + L'accessibilité web repose sur le langage HTML auquel peuvent s'ajouter les langages CSS, JavaScript et une touche d'ARIA.

- Chaque composant HTML apporte par défaut des comportements facilitant l'interaction avec l'application. - Sans coût supplémentaire, il devient alors plus facile et moins frustrant de naviguer sur l'application. + Le HTML structure et porte l'information d'une page web. + Ses balises apportent la sémantique : un bouton n'est pas un lien, qui n'est pas une <div>. Chaque composant HTML embarque nativement les comportements d'interaction attendus, de façon accessible : un <button> est déjà actionnable au clavier.

- Exemple : Utiliser une balise <a> pour un lien permet à l'utilisateur·rice de savoir si iel l'a déjà visité. + Le CSS met en forme l'information présente dans le HTML de la page. + L'usage du CSS uniquement ne rendra pas accessible l'information à tout le monde.

- Le CSS permet de mettre en forme l'information déjà présente sur la page via le HTML. - Si une information est portée seulement par le CSS, on risque de ne pas la rendre accessible à tous - les utilisateur·ices. -

-

- Le JavaScript régit les interactions complexes (cartes interactives, notifications…). + Le JavaScript régit les interactions complexes, comme l'affichage de notifications ou une carte interactive. Dans la plupart des cas, il ne sera pas nécessaire. - Il permet de coder des composants au-delà de ce qui est proposé par le HTML. + Il permet de coder des composants au-delà de ce qui est disponible en HTML.

- ARIA (Accessible Rich Internet Applications) ; un ensemble d'attributs pour enrichir le HTML pour : + ARIA (Accessible Rich Internet Applications) propose un ensemble d'attributs qui étendent le HTML. + Il donne plus d'information aux technologies d'assistance :

- Il permet de donner plus d'informations aux technologies d'assistance (lecteur d'écran…). À utiliser avec parcimonie : pas d'attribut ARIA vaut mieux qu'un attribut ARIA mal renseigné.

From 614d63fba96a59aaed60d568161e69ff81853c8d Mon Sep 17 00:00:00 2001 From: Guillaume Moizan Date: Mon, 15 Apr 2024 16:00:28 +0200 Subject: [PATCH 2/2] Retours MR --- index.html | 54 +++++++++++++++++++++++++++++------------------------- 1 file changed, 29 insertions(+), 25 deletions(-) diff --git a/index.html b/index.html index cfa9c19..b0f331b 100644 --- a/index.html +++ b/index.html @@ -146,31 +146,35 @@

Stack Technique

L'accessibilité web repose sur le langage HTML auquel peuvent s'ajouter les langages CSS, JavaScript et une touche d'ARIA.

-

- Le HTML structure et porte l'information d'une page web. - Ses balises apportent la sémantique : un bouton n'est pas un lien, qui n'est pas une <div>. Chaque composant HTML embarque nativement les comportements d'interaction attendus, de façon accessible : un <button> est déjà actionnable au clavier. -

-

- Le CSS met en forme l'information présente dans le HTML de la page. - L'usage du CSS uniquement ne rendra pas accessible l'information à tout le monde. -

-

- Le JavaScript régit les interactions complexes, comme l'affichage de notifications ou une carte interactive. - Dans la plupart des cas, il ne sera pas nécessaire. - Il permet de coder des composants au-delà de ce qui est disponible en HTML. -

-

- ARIA (Accessible Rich Internet Applications) propose un ensemble d'attributs qui étendent le HTML. - Il donne plus d'information aux technologies d'assistance : -

- -

- À utiliser avec parcimonie : pas d'attribut ARIA vaut mieux qu'un attribut ARIA mal renseigné. -

+
    +
  1. + Le HTML structure l'information. + Ses balises apportent la sémantique : un bouton n'est pas un lien, qui n'est pas une <div>. Chaque composant HTML embarque nativement les comportements d'interaction attendus, de façon accessible : un <button> est déjà actionnable au clavier. +
    2. +
  2. + Le CSS met en forme l'information présente dans le HTML de la page. + L'usage du CSS uniquement ne rendra pas accessible l'information à tout le monde. +
    3. +
  3. + Le JavaScript régit les interactions complexes, comme l'affichage de notifications ou une carte interactive. + Dans la plupart des cas, il ne sera pas nécessaire. + Il permet de coder des composants au-delà de ce qui est disponible en HTML. +
    4. +
  4. +

    + ARIA (Accessible Rich Internet Applications) propose un ensemble d'attributs qui étendent le HTML. + Il donne plus d'information aux technologies d'assistance : +

    +
      +
    • en explicitant les liens entre les éléments, par exemple l'image et sa description;
      • +
    • en explicitant l'état d'un élément, par exemple la sélection en cours dans une liste;
      • +
    • en étendant la sémantique, par exemple un onglet fait d'un composant <button> sera enrichi par le role="tab"
      • +
    +

    + À utiliser avec parcimonie : pas d'attribut ARIA vaut mieux qu'un attribut ARIA mal renseigné. +

    +
    5. +
L'accessibilité se repose avant tout sur le HTML, puis le CSS, le Javascript et enfin ARIA