JQuery, Css3, ou le calvaire des développeurs.

Salut à tous chers alsacréatiens !

C'est un combat permanent, pour un webdesigner, de lutter contre toutes les contraintes d'accessibilités du web, tout en essayant d'innover, en utilisant certaines technologies qui ne seront pas forcément accessibles à tous, sur n'importe quelle plateforme.

Bien entendu, on pense directement à Javascript, à jQuery, ce sont les biens connus ...
Mais si c'était les seuls, ce serait bien trop simple Si on veut faire les choses bien, il faut s'adapter aux comportements de chaque navigateur, sous toutes les versions, avec javascript activé ou non, les cookies activés ou non, il faut une compatibilité de lecture pour les malvoyants, la navigation au clavier, compatibilité en fonction de la taille des écrans ( les nouveaux petits joujoux de poches servant [ optionnellement ] à téléphoner, arrivants en masse de nos jours, nous compliquent d'ailleurs bien la tâche .. ), il y' à aussi la compatibilité avec les différentes versions de CSS, et des propriétés de chaque navigateurs ( -moz-xxx, -webkit-xxx etc ... ).
ça, c'est ce qui me vient en tête, comme ça. J'en oublie sûrement beaucoup.

Du coup, l'objectif de ce petit post, c'est de savoir comment vous arrivez à vous sortir de cette grosse mélasse ? Parce que perso, ça me rend fou tout ça !!
Quel est votre secret ? Quels outils utilisez-vous pour tester, virtuellement par exemple, la compatibilité avec tous les navigateurs, toutes les versions, et toutes les tailles d'écrans ?
Existe-t-il un outil qui me permettrait de rendre une feuille de style compatible avec un navigateur ? Par exemple, si j'utilise une propriété -moz-border-radius, ce serait bien qu'un outil puisse me compléter automatiquement les propriétés équivalentes pour les autres navigateurs, comme -webkit-truc ( mouais bon ok .. Je rêve peut être un peu ... Mais il n'y à vraiment pas d'autre moyen que le test et correction au cas par cas ? )
Outre le fait de bosser avec un code valide w3c, des outils comme firebug & developpers tools, qu'est-ce que vous pourriez me recommander, qui pourrait m'aider à valider une bonne accessibilité sur un site.

Ah, et ça c'est complètement autre chose, mais comment je peux faire pour avoir une idée de la consommation ( bande passante, requêtes, etc .. ) d'un site, pour pouvoir déterminer le besoin matériel requis ( mémoire du serveur, CPU, etc.. )

Merci d'avance !

Ps : Désolé ( ou pas ) pour le sondage, j'avais jamais testé en fait et là ça me démangeait ^^

Bonjour,

Amélioration progressive (ou dégradation gracieuse, suivant par où on commence). Pas plus à dire.

Laurie-Anne a écrit :
Bonjour,

Amélioration progressive (ou dégradation gracieuse, suivant par où on commence). Pas plus à dire.

Salut,

excuse-moi, tu peux développer, je ne suis pas sûr d'avoir bien saisi ^^

Bah pour assurer l'accessibilité d'un site avec, notamment du JavaScript, il suffit d'appliquer les principes de l'amélioration progressive (il y a de très bons articles à ce sujet qui ressortent dans les premier résultats de Google).

Le principe de base : avoir une page totalement fonctionnelle sur laquelle on ajoute le couche de JS qui ne perturbe pas le fonctionnement de la page.

Merci pour la précision, j'avoue que ça coule sous le sens ...

Cela soulève neanmoins un débat. On voit de plus en plus de sites/concept sortir de nos jours, qui ne sont accessibles que Javascript activés, et même bourrés de requêtes Ajax. Je peux très facilement nommer Facebook et Twitter par exemple. Ils vont bien sûr à l'encontre de ces règles d'accessibilités, mais au final, les gens se sont adaptés. Ceux qui n'avaient pas javascript l'ont activé ( d'ailleurs, ces réseaux ont très probablement changé le taux d'utilisateurs avec Javascript désactivé ces dernières années ).

La question est donc : L'accessibilité doit-elle toujours être traitée de manière optimale, dans tous les cas ? Doit-on toujours satisfaire toutes les plateformes ? L'ère des navigateurs avec Javascript désactivés ne serait-elle pas révolue ? Ne doit-on pas considérer aujourd'hui le maigre pourcentage d'utilisateur avec Javascript désactivé comme les derniers clanpins du globe, et les inviter à activer Javascript ?
Certains sites/concept sont basés sur le principe même de Javascript,et ne peuvent être imaginés sans. JS en devient donc indispensable, donc tant pis pour ceux qui ne l'ont pas.
Pour résumer, on peut soit choisir de passer des plombes à s'assurer de l'accessibilité/compatibilité de son site, et donc parfois devoir le développer deux fois ( sachant que parfois c'est même impossible, cf twitter etc. ), ou soit décider de restreindre l'accès aux adeptes des vieilles bicoques

Laurie-Anne a écrit :
Le principe de base : avoir une page totalement fonctionnelle sur laquelle on ajoute le couche de JS qui ne perturbe pas le fonctionnement de la page.

Il s'agit de bonnes pratiques de développement et non plus d'une démarche d'accessibilité en tant que telle ... seule l'accessibilité des contenus générés par scripting rentre dans la démarche.

28ToM47 a écrit :
On voit de plus en plus de sites/concept sortir de nos jours, qui ne sont accessibles que Javascript activés, et même bourrés de requêtes Ajax. Je peux très facilement nommer Facebook et Twitter par exemple. Ils vont bien sûr à l'encontre de ces règles d'accessibilités, mais au final, les gens se sont adaptés. Ceux qui n'avaient pas javascript l'ont activé ( d'ailleurs, ces réseaux ont très probablement changé le taux d'utilisateurs avec Javascript désactivé ces dernières années ).

Pas d'accessibilité mais de bonne pratique de développement.

La situation est un peu plus complexe que ça. Il fut un temps où Facebook sans Javascript était une simple page blanche ... ce qui n'est plus le cas actuellement (des fonctionnalités restent défectueuses cela dit).

28ToM47 a écrit :
La question est donc : L'accessibilité doit-elle toujours être traitée de manière optimale, dans tous les cas ? Doit-on toujours satisfaire toutes les plateformes ? L'ère des navigateurs avec Javascript désactivés ne serait-elle pas révolue ? Ne doit-on pas considérer aujourd'hui le maigre pourcentage d'utilisateur avec Javascript désactivé comme les derniers clanpins du globe, et les inviter à activer Javascript ?

L'accessibilité s'extrait des plateformes et des agents utilisateurs : le seul but est que tout à chacun dispose de la même information et des mêmes possibilités.

Pour répondre à tes différentes questions, c'est à toi de faire ces choix. En sachant qu'adopter cette bonne pratique concernant Javascript assure :
- qu'un utilisateur sans (par choix ou par défaut) puisse utiliser le service ;
- qu'un utilisateur ne soit pas bloquer par un script codé avec les moufles ...

28ToM47 a écrit :
Certains sites/concept sont basés sur le principe même de Javascript,et ne peuvent être imaginés sans. JS en devient donc indispensable, donc tant pis pour ceux qui ne l'ont pas.

Je ne vois pas en quoi poster un message ou un tweet nécessiterai impérativement du Javascript ... plusieurs facteurs sont derrières ces usages (ressources en présence, priorités, performances ...).

28ToM47 a écrit :
Pour résumer, on peut soit choisir de passer des plombes à s'assurer de l'accessibilité/compatibilité de son site, et donc parfois devoir le développer deux fois ( sachant que parfois c'est même impossible, cf twitter etc. ), ou soit décider de restreindre l'accès aux adeptes des vieilles bicoques lol

Non, pas de double développement que ce soit pour l'accessibilité (version non voyant ) ou que ce soit pour la compatibilité.
Modifié par yodaswii (23 Jul 2011 - 16:12)

28ToM47 a écrit :
On voit de plus en plus de sites/concept sortir de nos jours, qui ne sont accessibles que Javascript activés, et même bourrés de requêtes Ajax. Je peux très facilement nommer Facebook et Twitter par exemple. Ils vont bien sûr à l'encontre de ces règles d'accessibilités, mais au final, les gens se sont adaptés.

source ?

Sondage auprès de moi-même : j'ai remplacé NoScript par AdBlockPlus et QuickJava, ça doit être ça s'adapter ? (resp. JS désactivé par défaut, disparition des pubs et JS (dés)activable en un clic tout comme Flash et images (ça me sert pour surfer tranquille autant que pour des tests d'accessibilité)

Ce que je reproche (techniquement) à des sites comme Facebook et Twitter c'est pas tellement d'exiger JS pour être utilisables que de gérer absolument n'importe comment le cas où JS est désactivé. Google Images aussi, 100% nimp'

28ToM47 a écrit :
Ceux qui n'avaient pas javascript l'ont activé ( d'ailleurs, ces réseaux ont très probablement changé le taux d'utilisateurs avec Javascript désactivé ces dernières années ).

source ?
Modifié par Felipe (23 Jul 2011 - 14:53)

Juste une précision : ce n'est parce que un site utilise un maximum de javascript qu'il est inaccessible, si on connaît bien les règles de bases de l’accessibilité et ARIA, il peut être tout à fait utilisable.

P.S. : je ne connais pas le degré d'accessibilité de facebook et twitter.

Patidou a écrit :
si on connaît bien les règles de bases de l’accessibilité et ARIA, il peut être tout à fait utilisable.

Si c'était aussi simple ça se saurait . ARIA est très séduisant sur le papier mais je crois qu'il faut voir les utilisateurs de TA pour se rendre compte que ce n'est pas encore tip top .

Oui j'aurais dû préciser : effectivement ce n'est pas simple et ça demande même une étude poussée, mais c'est possible. jQuery UI et jQuery Mobile supporte bien aria par défaut.

Il me semblait que les dernières versions des lecteurs d'écran supportaient déjà pas mal de choses.

J'arrive sans doute un peu tard sur cette discussion, mais il faut dire une chose: ARIA et les pages enrichies au javascript ne sont de loin encore pas optimales pour les lecteurs d'écran, et ce n'est pas la faute des lecteurs d'écran, c'est la faute des développeurs web.

Parmi les sites web de sociétés plus ou moins importantes que je visite régulièrement, j'en connais très très peu qui utilisent javascript correctement. Tellement peu que je pourrais les compter sur les doigts d'une seule main et encore, je ne suis pas persuadé de pouvoir lever tous les doigts.

En ce qui concerne ARIA, ce n'est vraiment pas au point. Je ne peux pas dire autre chose. C'est vraiment pas compliqué de rendre le comportement du curseur virtuel totalement incohérent. IL y a encore beaucoup de choses qui ne sont que partiellement supportées, et dans ce qui est supporté c'est rapidement la panade. A noter que NVDA est un peu en avance sur jaws dans ce domaine.

Les zones rich text non plus ne sont encore vraiment pas au point, malgré leur quelques années d'existance maintenant. La navigation y est toujours autant cahotique par rapport à ce qu'on peut attendre de ces zones, notamment si on compare aux possibilités qu'on a dans word. NE parlons même pas des possibilités d'édition, c'est proprement ingérable.

Maintenant du côté d'AJAX et des contenus dynamiques, pratiquement personne ne le fait correctement. Rapidement, les erreurs courantes :
* Pas d'équivalents clavier pour les éléments réagissant à la souris
* Interférences avec les commandes d'édition classiques du clavier (je hais les scripts qui interceptent espace, entrée, les flèches ou d'autres touches clés)
* Déplacements inattendus ou complètement illogiques du focus clavier dans les formulaires
* Apparition d'éléments dynamiques aux mauvais endroits dans le DOM et évidemment sans focuser la partie concernée
* Bizarrement, même sur les sites pourtant normalement assez respectueux, on oublie les normes et les bonnes pratiques d'accessibilité dans les contenus générés dynamiquement: on ne met plus d'alt sur les images ou on oublie de les mettre à jour, on génère des tableaux avec des lignes incomplètes et sans en-têtes, on utilise des br à la place des listes parce que ça va plus vite, etc. ON croit à tort que le javascript est de toute façon inaccessible, donc comme par hasard on se relâche

Je vais arrêter là parce que je vais m'enflammer, mais les gros comme facebook, twitter et google, pour ne citer qu'eux, c'est vraiment pas fameux. Pour google il n'y a qu'à voir la page d'accueil du moteur de recherche: ils ne se sont pas foulés, au lieu de faire une page d'accueil unique qui va pour tout le monde, ils mettent un lien « pour les lecteurs d'écran cliquez ici pour désactiver la recherche instantanée google ». Ils ne montrent vraiment pas le bon exemple. Google source c'est digne des annés 1990, google docs ça a été un peu accessible tout au début mais maintenant on peut oublier. J'imagine pas la tête de google plus. Pour twitter, l'ancienne version était pas si mal mais la nouvelle c'est n'importe quoi. Et facebook... pour facebook c'est pas grave, c'est pas une grosse perte de toute façon.

Du coup j'ai tout récemment envisagé une solution alternative: tricher en injectant moi-même localement du code javascript correctif dans certaines pages dès leur chargement. Ca marche mais c'est dommage.
Modifié par QuentinC (23 Jul 2011 - 21:02)