Accessibilité web, W3C, HTML 5, Microformat, HR-XML, XHTML – Les normes à venir

by Posted on



Cet article est un rapide tour d’horizon sur ce qui agite le monde du web en matière d’accessibilité, de normes en devenir qui imposent un renouvellement complet dans la manière d’intégrer ou de développer. On va donc aborder des sujets aussi variés que : la problématique de l’accessibilité sur le web, la balise vidéo prévu en HTML 5 ou des choses à ce jour assez confidentielles comme la notion de Microformat, les formats Europass ou HR-XML pour une homogénéisation des CV !

Bref, quelles sont les normes à venir du web ? O tempora, o mores ! Et pourquoi ne pas se livrer à un peu de prospective…

* Ô temps, ô mœurs ! (Cicéron, Catilinaires,I,1)

L’accessibilité sur le web

Sans préambule, la définition de wiki pour une petite mise en bouche !
La définition de wikipédia

L’accessibilité du Web est la problématique de l’accès aux services et contenus en ligne pour les handicapés et les seniors. Définie par des normes techniques établies par la Web Accessibility Initiative (WAI) du World Wide Web Consortium (W3C), elle nécessite un traitement tout au long du cycle de vie d’un site Web, par l’ensemble de ses acteurs, via des méthodes d’applications, des référentiels métiers et une démarche de suivi. Bien qu’elle soit une composante et un levier d’amélioration de leur qualité globale, le degré d’accessibilité effectif des sites Web reste actuellement très faible.

Plutôt indigeste ! En étant un peu ironique, c’est avec ce genre de définition que l’on dégoûte les professionnel(le)s de la profession de s’intéresser à l’accessibilité tant cela sent le « jargonnage technico-informatico ». Toutefois une fois, la première poussée urticante que peut vous donner cette définition et expurger du jargon, cette définition contient quelques informations essentielles à mes yeux :

Ce qu’il faut retenir de cette définition

  • Une prise de conscience encore balbutiante des préoccupations d’accessibilité par les professionnel(le)s du web. Vous ne le serez plus après la lecture de cette excellent article !
  • La notion de cycle de vie d’un site web : naissance, vie, mort, résurrection ? Alléluia ! Un site doit être en constante évolution de préférence vers une plus grande accessibilité ! Non pas possible ??!
  • Un marché en pleine explosion dans les pays développés (le marché des seniors). Si vous souhaitez cibler ce marché avec vos prestations de service mieux faut être « aware » des questions d’accessibilité. Il en va de même pour la réalisation de site pour le compte d’administrations ou dans le milieu associatif… C’est un peu leur tarte à la crème, l’accessibilité.

Les recommandations à suivre

Au-delà là de notre compréhension, quelles règles puis-je suivre lors de la création d’un site pour répondre aux principaux critères d’accessibilité. Le site pompage.net en fournit une liste qui est à notre avis un bon point de départ. La liste est ci-dessous.

Nous privilégierons pour notre part les 5 points suivants en nous inspirant de cette liste.

La liste hecube

  1. Validation auprès du validator W3C. (http://validator.w3.org/)
  2. Pas de frames. Tant d’un point de vue du référencement que de l’accessibilité, la frame pue !
  3. Remplir les balises alt, title pour les liens, les images, les titres des pages. Très bon pour le référencement de toutes les façons.
  4. Offrir la possibilité d’accroitre la taille du texte via un bouton
  5. Utiliser les outils tel que Firebug 1.4.0 (https://addons.mozilla.org/fr/firefox/addon/1843), Web Developer 1.1.8 (https://addons.mozilla.org/fr/firefox/addon/60) pour faire des tests sur vos pages. Il s’agit aussi d’un conseil pour l’intégration même.

La liste du site pompage.net pour l’accessibilté.

  1. Valider le HTML et les CSS
  2. Pas de cadres (frames), svp
  3. Les outils automatiques d’évaluation d’accessibilité
  4. Les images et le texte alternatif
  5. S’assurer de l’utilisation non intrusive de JavaScript
  6. Augmenter la taille du texte
  7. Évaluer la sémantique du code
  8. Désactiver les CSS
  9. Utiliser Fangs pour simuler un lecteur d’écran

Source : http://www.pompage.net/pompe/evaluer-accessibilite-site-2/

Le liste du blog.kinoa.com

  1. Séparer la mise en forme du contenu.
  2. Prévoir des alternatives aux Scripts.
  3. Proposer des alternatives textes.
  4. Proposer des formats alternatifs en téléchargement.
  5. Eviter d’ouvrir des liens dans une nouvelle fenêtre.
  6. Eviter les frames. Les frames ou cadres sont aujourd’hui de moins en moins utilisées.
  7. Proposer systématiquement un plan du site et un moteur de recherche.
  8. Proposer des titres explicites à vos pages.
  9. Vérifier les contrastes de vos couleurs.
  10. Utiliser les technologies du W3C.

Source : http://blog.kinoa.com/2008/05/26/10-astuces-pour-ameliorer-l-accessibilite-de-votre-site-web/

Des liens utiles sur l’accessibilité

La balise vidéo

Voilà une innovation qui si elle se mets en place et se répand va faire du bruit ! En effet, vous serez en mesure de contourner toutes les solutions aujourd’hui propriétaires qui vous permettent de visualiser de la vidéo ! Bye bye, donc, Windows Media player, Silverlight, Adobe Flash… L’enjeu est donc de taille et on comprend mieux pourquoi dailymotion est sur les rangs pour l’adoption de ce nouveau format par exemple.

Les avantages comparés de <video>...</video>

Cette balise est propre à l’HTML 5, elle permet donc de lancer un fichier vidéo ou une vidéo en streaming. Par ailleurs, vous possédez une collection d’attributsautoplay, controls, end, height, loopend... qui permet par exemple d’insérer des boutons de contrôle…
Vous êtes ici en terrain connu si vous avez des notions d’HTML, c’est une nouvelle balise comme img par exemple.

Si la balise se diffuse et devient un standard dans son utilisation, cela enverra dans les poubelles de l’histoire toutes les solutions existantes du marché. Ce phénomène ne s’est-il pas produit dans les technologies de streaming avec aujourd’hui l’utilisation en quasi monopole de la vidéo .flv

Microformat

Avec cette nouveauté, nous sommes carrément plus dans un possible avenir que dans une réalité concrète. Les Microformats sont des petits modèles de HTML pour représenter des choses communément publiées comme des personnes, des événements, des billets de blog, des critiques et des mots-clés dans les pages web. L’objectif est ambitieux si on lit plus avant notamment concernant la réindextion possible des données presentées de la sorte.
On voit un peu quelle pourrait être la finalité de tout cela dans la définition donnée par “Que sont les Microformats ?”

Les microformats sont un moyen d’ajouter un simple balisage à des items de données lisibles par des humains, tels que des événements, des détails sur un contact ou des endroits, sur des pages web, de telle façon que l’information puisse être extraite par le logiciel et indexée, cherchée, sauvegardée, référencée ou combinée.

Le microformat appliqué à une vcard

La “bouillie” de vcard

 
BEGIN:VCARD
VERSION:2.1
N:Hemedia;Hecube;;;
FN:Contact Hecube
ORG:Hemedia.net Hecube.net;
TITLE:Contact Hecube
EMAIL;INTERNET;HOME:contact@hecube.net
TEL;WORK:33 (0)1 43 71 80 03
ADR;WORK:;;23, villa riberolles;Paris;France;75020;
END:VCARD

Les mêmes informations structurées à l’aide des microformats

<div class="vcard">
 <span class="fn"><span class="given-name">Hecube</span>
 <span class="family-name">Hemedia</span></span>,
 <span class="title">Contact Hecube</span>,
 <div class="org">Hemedia.net Hecube.net</div>
 <div class="adr">
  <div class="street-address">23, villa riberolles</div>
  <span class="locality">Paris</span>,
  <span class="region">France</span>
  <span class="postal-code">1007502000</span>
 </div>
 <div>Tel: <span class="tel">33 (0)1 43 71 80 03</span></div>
 <div>Email:
 <span class="email">contact@hecube.net</span></div>
</div>

Pas en REST…

La philosophie du Microformat revendique clairement une parenté avec celle de REST, pour les familiers du développement en RoR et de l’univers des “web service”.

Un définition de REST par le JDN

L’architecture REST n’est pas un protocole en soi, ni une technologie, mais une “philosophie” de l’utilisation du Web. Le protocole utilisé ici est simplement HTTP avec ses méthodes (GET, POST et les autres…). Cette philosophie estime qu’il n’est, dans bien des cas, pas nécessaire de faire appel aux couches d’abstraction proposées par SOAP et XML-RPC, et que les méthodes de HTTP, combinées avec de bonne URIs, suffisent amplement dans la majorité des cas.

HR-XML

Bien qu’il s’agit d’une initiative dans un secteur particulier celui des ressources humaines, cet exemple est intéressant car il peut à terme tous nous concerner en effet qui n’a pas écrit un CV une fois dans sa vie. L’idée est simple établir un standard, sur la base de XML, le HR-XML. Ce dernier propose une structure de documents XML qui se prête tout particulièrement à un stockage / exploitation de curriculum vitae.

Plusieurs questions apparaissent dès lors :

  • Que devient alors ma mise en page sous Word si magistrale qui fait de mon CV une monstruosité numérique !
  • Quid du droit à l’anonymat numérique, mon CV est en base et donc je suis répertorié et pire “xmlisée” :):)

Plus sérieusement, ce type d’initiative chercher à normaliser un peu mieux l’extrême quantité et profusion d’informations disponibles sur le Web comme le sont les CV, les fiches produits, les tutoriaux. Bref tous les documents pourraient connaître ce type d’indexation et d’ordonnancement pour faciliter leur accessibilité par tous.

Published by Bruno Flaven

By now, Bruno Flaven works as AI Coordinator. He has been a project manager in a wide variety of Internet business applications both in Mobile and in Desktop for 20 years now. You can find more information about his professional life on his personal website (www.flaven.fr) or his linkedin profile: https://www.linkedin.com/in/brunoflaven. He is currently working In France Media Monde (FMM) mostly on mobile applications (iOS and Android). He has also worked as P.O for a Backoffice project made with Symfony. He also made few trainings to facilitate the handling of the tools that he helps to make.

Related Posts