Mise à jour de contenu « en temps réel » et accessibilité : l'exemple de Yahoo! Sport

Victor Brito — Sun, 22 Jun 2008 15:54:00 +0200

Depuis deux semaines, l'actualité sportive est dominée par l'Euro 2008. Pour en suivre les matchs, il n'est pas nécessaire de s'asseoir devant un poste de télévision, que ce soit chez soi, chez des amis ou au café le plus proche : en effet, sur le Web, il est non seulement possible de lire des articles rapportant les résultats, mais aussi de suivre les matchs « en direct », ce que propose notamment Yahoo! Sport.

Or, suivre un match « en direct » sur le Web n'est pas sans poser quelques problèmes d'ordre technique. S'il s'agit d'une retransmission digne de celle de la télévision, il y a le problème du format vidéo à adopter et du support du plug-in nécessaire pour visionner la vidéo si elle est intégrée à la page Web, sans oublier la bande passante mise à l'épreuve par la diffusion en flux continu.

Yahoo! Sport, pour sa part, fait abstraction de la vidéo, qui est remplacée par des commentaires à chaud, sous forme textuelle. Dans ce cas, le problème technique se résume à la mise à jour du contenu « en temps réel » : plus la page est appelée à être rafraîchie, plus le serveur est sollicité et plus son temps de réponse peut varier s'il y a une forte demande (cas d'un site à fort trafic). Ajax, de par le principe même de la requête asynchrone, permet de contourner la difficulté en ne rechargeant que les commentaires et épargnant ainsi la bande passante. Afin que l'utilisateur ne soit pas perturbé par l'ajout de nouveaux commentaires sans action de sa part, un bloc (qui comporte un gif animé symbolisant le chargement d'une page) lui indique en temps réel dans combien de temps (en secondes) la mise à jour automatique s'effectuera (elle s'effectue toutes les 30 secondes).

En revanche, dès qu'on désactive JavaScript, le bloc en question montre toujours le gif animé et la mention MAJ, mais n'indique plus dans combien de temps le rafraîchissement du contenu s'effectuera.

Et pour cause : il n'y a plus de rafraîchissement automatique. Ce qui veut dire que cette opération est effectuée côté serveur : la preuve, le code source ne mentionne aucun élément meta de type refresh, ce qui est déjà une bonne chose du point de vue de l'accessibilité. Mais, mis à part l'utilisation de la fonction d'actualisation implémentée par le navigateur, il n'existe, pour toute alternative à ce que fait Ajax, qu'un lien hypertexte, en dur, qui pointe vers l'ancre où se trouvent les commentaires et qui n'est autre que la mention « MAJ ». Mais, ce lien (et surtout sa fonction) n'est pas facile à repérer du premier coup : moi-même j'ai cru, au départ, qu'il n'y en avait pas ! De plus, il est accompagné d'un attribut title qui fait doublon avec son contenu textuel.

Certes, Ajax permet de soulager le serveur et d'économiser de la bande passante pour la fonction dont il est question sur ce billet ; mais, même si l'on prévient du prochain rechargement partiel de la page, il serait mieux de fournir un lien permettant de désactiver (ou de réactiver) la mise à jour périodique automatique. Même si les commentaires de match publiés sur Yahoo! Sport sont courts, on ne peut deviner, en effet, combien de temps l'utilisateur a besoin pour les lire et suivre l'évolution du match : un utilisateur qui lit lentement sera plus facilement perturbé par le rafraîchissement automatique, sans oublier les utilisateurs se servant d'un lecteur d'écran (synthèse vocale ou plage braille).

Bref, l'exemple de Yahoo! Sport est un véritable cas d'école pour ce qui concerne l'accessibilité d'un contenu du Web mis à jour à intervalles très rapprochés, voire en temps réel.

Blog - Britoweb - Tag - mise à jour périodique

Mise à jour de contenu « en temps réel » et accessibilité : l'exemple de Yahoo! Sport