jeudi 31 juillet 2008
Prototype de système de traduction automatique français / Langue des Signes Française (LSF)
Posté par olivier_webyboom le jeudi 31 juillet 2008 - Accessibilité
Dream Orange est le site monté par une équipe issue des labos R&D d'Orange, visant à échanger avec les internautes sur des innovations dans le domaine du web et des télécoms.
Il y est présenté un système logiciel prototype, permettant une traduction automatique de textes en français vers la LSF (Langue des Signes Française). La phrase d'origine est décomposée et reformulée selon la syntaxe propre à la LSF, puis restituée par un avatar en 3D.
Le système est encore perfectible, mais paraît très prometteur. On imagine facilement le potentiel d'une telle application pour l'accessibilité des contenus numériques, en général. Malheureusement il n'est pas donné de précision sur une éventuelle mise à disposition du produit.
Note: pour mieux comprendre les enjeux de ce système, je vous invite à découvrir cette une excellente synthèse sur les spécificités de l'accessibilité pour les personnes sourdes.
lundi 28 juillet 2008
Se faciliter la vie (et la vue) avec les styles utilisateurs
Posté par olivier_webyboom le lundi 28 juillet 2008 - Accessibilité
Un peu de technique s’impose…
Pour surfer sur le web avec un ordinateur, nombre d’internautes utilisent un navigateur dit graphique, les plus populaires actuellement étant Internet Explorer et Firefox.
Lorsque l’on visite une page de site web avec un navigateur graphique, pour faire simple il effectue en gros deux choses :
- D’abord interpréter le code HTML, qui s’occupe du contenu : les textes, les liens, les images, le multimédia, et la façon dont ils sont organisés
- Ensuite interpréter les styles (dits CSS), pour mettre en forme et en couleurs le contenu, c’est-à-dire sa présentation
Les faits sont plus subtils, puisque pour des raisons historiques le HTML est encore trop souvent utilisé, via des « bidouilles », pour faire de la mise en forme. Une idée forte de l’accessibilité des sites internet est de respecter le principe dit de « séparation du contenu et de la présentation ». C’est-à-dire : faire en sorte que le HTML ne fasse que du contenu, et le CSS s’occupe de toute la mise en forme.
Je fais ce que je veux avec mon navigateur
Il existe un principe-clé en CSS : pour un même élément, les styles peuvent être déclarés plusieurs fois, à différents niveaux : dans une feuille de style, au cœur du HTML, ou par le navigateur. Ce sera toujours la dernière déclaration, dans l'ordre de "lecture" du code par le navigateur, qui sera prise en compte. Prenons l’exemple d’une feuille de style qui impose la couleur verte pour tous les textes. Si dans la page, du code HTML « stylé » définit que la couleur de texte doit être rouge, alors elle apparaîtra rouge.
Ce qui nous intéresse ici est la possibilité, pour l’internaute, d’indiquer à son navigateur quel style il souhaite appliquer, via ce qui est généralement désigné par « feuille de style utilisateur » (« user style sheet » en anglais). Si vous avez bien suivi : sur un site conçu avec des CSS, il est possible pour tout un chacun de définir « à volonté » la façon dont il s’affiche à l’écran…
O.K., mais ça sert à quoi d’utile ?
La nature a été très sympa avec moi, au moment de me donner des yeux : acuité visuelle, perception des couleurs, tout marche très bien… cependant des années d'usage immodéré d'écrans d'ordinateur m’ont appris deux choses : l’humilité, et la prudence.
Les moniteurs aux résolutions toujours plus élevées, et l’habitude trop répandue d’essayer de caser un maximum d’infos dans un minimum d’espace, font que de nombreux sites internet utilisent une police de caractères franchement trop petite. De plus, afin de limiter la fatigue, mon réglage de moniteur minimise la luminosité, du coup si des couleurs sont faiblement contrastées, la lisibilité est mise à mal, même avec une bonne vue.
Les concepteurs des sites qui ont fait ces choix ont des raisons qui leur appartiennent. Le gros progrès avec les feuilles de style utilisateur, c’est que l’internaute n’est plus prisonnier de ces choix, et peut appliquer les règles d’affichage qui lui conviennent.
Cet article va vous présenter des exemples d’utilisation de ces feuilles de style utilisateur, ainsi que la manière de les appliquer.
Firefox, mon ami
La plupart des grands navigateurs proposent cette fonctionnalité. Pour ma part je trouve très pratique la combinaison Firefox (en version 2 ou 3, c'est idem), et le module d’extension Stylish. Firefox est mon outil de base pour surfer et développer, et je trouve Stylish simple et pratique, surtout pour définir des styles pour un site en particulier. De plus, elle permet de piocher dans des centaines de styles utilisateurs prêts à l’emploi.
Libre à vous d’adapter les astuces qui suivent à d’autres navigateurs, bien sûr !
Mieux voir l’élément courant
Quand on navigue au clavier, via la touche Tab, avec la plupart des navigateurs l’élément courant (lien, champ de formulaire, cadre…) est entouré d’un fin liseré, en traits pointillés (souvent appelé le « focus »). Ce liseré est en général très discret… trop, en fait, car il est souvent difficile de le retrouver dans une page, au point qu’il faut le faire bouger pour finir par le repérer. Pas très commode…. Certains webdesigners avisés rendent le focus bien visible par CSS, comme le recommandent certains spécialistes. Mais c’est encore trop rare.
Heureusement un style utilisateur prêt à l’emploi permet de rendre le focus beaucoup plus voyant (un épais liseré bleu ciel), quel que soit le site visité. Il s’agit de Bright Focus. Cliquez sur « Load into Stylish », et si tout se passe bien, le style est activé ; naviguez avec la touche de tabulation pour voir le résultat (sinon, vérifiez qu’il est coché dans l’interface de Stylish, puis redémarrez Firefox).
Si vous n’utilisez pas Firefox, vous pourrez toujours voir le code en cliquant sur le bouton « Show code », et vous en inspirer.
Mon Wikipedia à moi
J'adore Wikipedia, à la fois pour les contenus, et le principe qui sous-tend cette encyclopédie en ligne. Mais deux choses me gênent sur ce site...
D'abord je trouve les textes bien trop petits, surtout pour les longs articles. C'est
vrai qu'on peut agrandir le texte, mais devoir le faire à chaque fois
qu'on ouvre une page, c'est pesant quand on explore un sujet, ce qui
souvent conduit à ouvrir nombre d'onglets. C'est vrai aussi, Firefox 3 réduit
la gêne en mémorisant le niveau de zoom pour un site, mais bon, même avec la version 2 on a le droit de vouloir mieux que ça.
Ensuite, les liens en bleu sombre non soulignés m'énervent, car on ne les distingue pratiquement pas du reste du texte. D'autre part, les liens vers des articles "pas encore écrits" sont en rouge, ce qui est une hérésie du point de vue de l'accessibilité (la couleur ne doit pas être le seul moyen de fournir une information).
Qu'à cela ne tienne! Je me suis bricolé une feuille de style "spécial wikipedia", qui augmente la taille de tous les textes et souligne tous les liens, sur tous les sites du domaine wikipedia.org.
Le code CSS (simplissime) utilisé:* {font-size:105%}
a {text-decoration:underline !important}
a.new {font-style:italic !important}
Le résultat est assez laid, mais peu m'importe, au moins je m'économise de la rétine!
Pour quelque chose de bien plus abouti, qui améliore la lisibilité, réorganise les éléments de la page, masque les éléments superflus de la page, et autres commodités, vous pouvez tester le style Wiki clean
and professional.
Les WCAG plus lisibles
Une autre application, assez ironique d'ailleurs, des styles utilisateurs: rendre les WCAG 1.0 (le socle, la source originelle, la bible...) plus lisibles - plus... accessibles, donc-, et polir un peu ce diamant brut, voire brutal. C'est la bonne idée qu'à eue Derek Featherstone, exposée dans son article "Doing it with user style". D'autant plus salvateur si l'on s'y réfère régulièrement! Un bel exemple en tous cas de ce qu'on peut faire pour plier un site à sa volonté (avec un peu de boulot, tout de même...).
Voir la langue des mots
Sous ce titre aux parfums surréalistes, une astuce permettant de détecter visuellement les changements de langue dans une page web. C'est très utile lorsque l'on audite ou conçoit des sites ayant l'ambition d'être accessibles, ce qui implique notamment de spécifier la langue des mots provenant d'une autre langue que celle de la page courante. Sans cette astuce, le contrôle de langue nécessite d'inspecter le code source, à la recherche de mots "pas français", et de vérifier leur attribut lang. Fastidieux, et en général peu efficace. Avec ce style, les mots correctement taggés sautent aux yeux, pour ainsi dire, tandis qu'on repère plus facilement ceux qui ne le sont pas. Un gain de temps loin d'être négligeable sur un audit ou des tests!
A vous!
Le but de cet article est de montrer une application utile et créative d'une fonctionnalité méconnue des navigateurs, et de susciter de bonnes idées sur le même thème. N'hésitez donc pas à partager vos trouvailles via les commentaires sur ce billet!
mardi 15 juillet 2008
L'accessibilité des sites corrigée par les internautes?
Posté par olivier_webyboom le mardi 15 juillet 2008 - Accessibilité
Encore une info pêchée sur le blog de Chris Heilmann (si vous ne l'avez pas encore dans vos fils RSS, celui-là, il serait temps d'y songer!)... Une tendance se dessine actuellement, concernant le "crowdsourcing" ("codage par la foule", littéralement). Celui-ci consiste à permettre à tout un chacun de contribuer concrètement au code de sites internet. Dans le domaine de l'accessibilité, cela se traduit par l'ajout de méta-données (textes alternatifs, balises adaptées, attributs pertinents...) au code de la page, là où elles font défaut.
Deux projets significatifs dans ce domaine ont vu le jour récemment: Social Accessibility Project, chez IBM, et WebVisum.com. Le projet d'IBM vise à équiper les lecteurs d'écran et les navigateurs d'additifs logiciels, qui permettent de signaler un problème aux bénévoles chargés de les traiter, de le résoudre de façon collaborative, et d'alimenter un serveur de données. Celui-ci ajoutera les informations manquantes à la volée, dès la prochaine visite au site incriminé.
WebVisum est une extension de Firefox 3 (inscription au service nécessaire), qui en plus de cette fonction de résolution collaborative, propose de décoder les CAPTCHAs visuels, et différentes fonctionnalités qui facilitent la vie des déficients visuels.
Les deux projets partent des besoins des utilisateurs de lecteurs d'écran principalement, s'y intégrant de façon transparente. Rien n'interdit toutefois d'imaginer qu'on pourra apporter des améliorations qui concernent d'autres besoins spécifiques.
Restent deux points à régler, à mon sens. Assistera-t-on à une nouvelle balkanisation du web, du fait de la coexistence de différentes bases de méta-données, alimentées et utilisées par des moyens techniques différents? En attendant que tout soit unifié, faudra-t-il parcourir la même page avec les différents outils de ce type, pour être sûr d'avoir la totalité de la contribution des différentes communautés d'utilisateurs?
Ensuite, ne risque-t-on pas de dédouaner, dans une certaine mesure, les éditeurs de sites de leur devoir de mise en accessibilité? Pas d'impair: l'idée de base est puissante et productive, et on est d'accord que le service à l'utilisateur prime, quelqu'en soit le moyen et le fournisseur, finalement. Cependant, anticiper les effets pervers permet de mieux les prévenir. Le projet d'IBM positive le problème en espérant que les contributions montreront la voie aux propriétaires de sites, en leur fournissant, clé en mains, les meilleures pratiques telles que les attendent les utilisateurs. Il faudra certainement faire preuve de beaucoup de persuasion et de pédagogie, pour expliquer que ce type d'action ne doit pas remplacer l'incorporation des bonnes pratiques d'accessibilité au processus de conception et de production de tout site internet digne de ce nom.
jeudi 3 juillet 2008
WebAnywhere, lecteur d'écran en ligne gratuit
Posté par olivier_webyboom le jeudi 3 juillet 2008 - Accessibilité
Je viens de retrouver un lien que j'avais temporairement mis de coté...
Il existe un lecteur d'écran en ligne (en version alpha, mais selon les auteurs la version est acceptable): Webanywhere.
Le principe est le suivant: l'utilisateur ouvre la page de WebAnywhere, à partir de laquelle il surfera sur d'autres pages via une frame. WebAnywhere vocalise la page, et réplique le comportement d'un lecteur type Jaws ou Windows-eyes au niveau des contrôles de navigation.
Gros avantage: ça marche sur toute machine avec une connexion haut-débit, un navigateur et le son. C'est gratuit, open-source, et ne nécessite aucune installation particulière (à la différence de FireVox par exemple). C'est donc une solution ultra-portable, utilisable en situation de mobilité, ou pour des raisons simplement économiques.
Je n'ai pas pu tester (pas de son sur le PC d'où est écrit ce billet...........), mais ça paraît être une solution très séduisante! Il y a de grandes chances que ce soit excessivement anglophone, cela dit le caractère open-source du projet le rend ouvert aux adaptations. Donc "y a plus qu'à"...
mercredi 2 juillet 2008
Mashups et accessibilité: des solutions existent!
Posté par olivier_webyboom le mercredi 2 juillet 2008 - Accessibilité
C'est en recherchant des liens relatifs à l'accessibilité des mondes virtuels que je suis tombé sur le centre de ressources sur l'accessibilité d'IBM. Un article en particulier a capté mon attention: Web 2.0 mashup accessibility. Il y est fait le point sur les difficultés particulières à anticiper, dans le cadre des mashups (applications web permettant aux utilisateurs d'agréger des contenus et services disponibles sur Internet, pour éventuellement en créer de nouveaux).
En fin d'article, l'auteur mentionne le projet Fluid, qui démontre par l'exemple la faisabilité d'applications type mashups accessibles. Fluid est "un projet collaboratif à l'échelle mondiale, visant à améliorer l'utilisabilité et l'accessibilité de projets open source communautaires, avec une attention particulière aux logiciels d'éducation pour les universités".
Fluid propose des composants prêts à l'emploi, des méthodologies et des ressources. Parmi celles-ci, une bien appétissante liste de ressources sur le thème de l'accessibilité.
Tous ces articles sont en anglais, donc malheureusement peu accessibles si on ne maîtrise pas cette langue... toutes les bonnes volontés pour les traduire seront donc les bienvenues!
