Les solutions web existantes - S5 de Eric Meyer

Pour construire une présentation web avec S5, voici les explications d’Eric Meyer traduites en français.

Évaluation de l’accessibilité de S5

La solution de construire une page (x)HTML garantit l’ accessibilité d’un certain nombre de points comme :

  • La langue de la page
  • La structure de la page (titres, listes d’énumération ordonnées ou non, paragraphes, etc.)
  • Les éléments sémantiques d’une page et leurs alternatives éventuelles (images, liens, abréviations, etc.)

Par contre, si le contenu d’un slide est trop important par rapport à la hauteur disponible du document, alors ce contenu est tronqué en mode diaporama, mais visible en mode linéarisé.

Au clavier, la navigation se fait parfaitement (à condition de connaître les touches « de base » permettant les déplacements dans le document, à savoir :

  • Les touches Flèches gauche et droite pour avancer ou reculer dans le document
  • La barre espace pour avancer dans le document
  • La touche « t » pour avoir le document html entièrement linéarisé (ie. sans style et sans script)

S5 propose une liste déroulante en bas à droite de l’écran en guise de table des chapitres. Elle est construite avec tous les titres des slides mais ne propose pas de bouton de validation lorsqu’une sélection est faite, ce qui peut poser problème en cas de navigation au clavier, puisque le simple fait de se déplacer sur un titre fait passer automatiquement à la diapositive concernée.
A noter également que les symboles « << » et « >> » permettant de passer d’un slide à l’autre ne fonctionne malheureusement qu’au clic de souris.

Attention : Utiliser cette solution avec les lecteurs d’ écran Jaws ou NVDA entraine quelques problèmes de conflits entre les raccourcis clavier des lecteurs d’écrans et les scripts permettant à la page HTML de se comporter en diaporama.

De plus, certaines fonctions comme le fait de pouvoir naviguer de titres en titres sont annihilées par la manipulation du DOM liée au script de S5.

En effet, la navigation par titres est uniquement possible sur une partie du document (le slide affiché à l’écran) et non pas sur l’ensemble du document
(cf. copie d’écran ci-après).

JAWS - Utilisation de la liste de titres avec S5 qui n'est effective que sur la diapositive courante

Note : Les « forks » tels S6, qui utilisent des librairies javascript basées sur jquery connaissent également les mêmes problèmes d’accessibilité.

Exemples d’utilisation de S5 in vivo

Présentations de Denis Boudreau

Présentations de John Foliot


Lire le deuxième chapitre de mon mémoire : Les solutions web existantes - Slidy HTML de Dave Ragget

haut de page

Répondre à cet article

modération a priori

Attention, votre message n’apparaîtra qu’après avoir été relu et approuvé.

Qui êtes-vous ?
Ajoutez votre commentaire ici
  • Ce formulaire accepte les raccourcis SPIP [->url] {{gras}} {italique} <quote> <code> et le code HTML <q> <del> <ins>. Pour créer des paragraphes, laissez simplement des lignes vides.

Suivre les commentaires : RSS 2.0 | Atom