La guerre des standards : la revanche des sites (4104 lectures)

200507/12

Nous poursuivons ici les opus précédents.

Cet épisode sera t-il le plus intense de cette grande saga ?
A vous de le lire...
On abordera ici des problèmes éternels de conformité aux standards du web et d'usabilité.

Dans l'ombre, un coupable tisse sa toile

Est-il encore nécessaire de devoir rappeler ce que sont les standards du web ?
Malgré les 21 millions de résultats de Google, il apparaît en effet que le message se perd quelque part dans un tuyau perdu du réseau des réseaux.
Au quotidien, mon intervention sur un centre de formation à l'intégration et à la programmation internet me font constater que les développeurs, les webmasters, quelques soient leurs statuts et leurs ambitions, n'ont pas perçu dans leur ensemble les enjeux des standards.
Ce ne sera pourtant pas faute d'information.

Le mal est plus insidieux, il est là, installé dans les âmes des développeurs, qui ne voient en lui qu'une facilité.

Ce mal, je l'ai nommé Dreamweaver, le logiciel désormais passé chez Adobe, un géant de la PAO, puisque Macromedia a été racheté par Adobe courant 2005.

Désormais, les risques d'écarts avec les recommandations du W3C sont plus que jamais accrus du fait de l'inexistence d'une quelconque concurrence.

Dreamweaver est en effet aujourd'hui le seul logiciel capable de générer du code automatiquement en mode "création" : l'utilisateur "dessine" son site, et le logiciel écrit le code HTML.

Quand conformité rime avec conformisme

Le web est toujours un espace sauvage, où il faut être un l'utilisateur averti pour s'y repérer facilement et rapidement.
Malgré un bon taux de pénétration d'internet dans les foyers français par exemple, malgré une chute progressive et significative d'Internet Explorer, pourtant toujours proposé par défaut dans les packages d'ordinateurs, l'usage du web n'est pas plus simplifié auprès du grand public aujourd'hui, ce grand public ne sachant dans son ensemble toujours pas trouver l'information pertinente rapidement.

Les développeurs le savent bien, les standards n'amènent que des avantages :

• à l'usager
• à la maintenance
• à la pérénnité des documents
• à la rapidité d'affichage
• au référencement
• à la compatibilité multi-navigateur

Il y a quelques années, pas si longtemps que ça d'ailleurs, les sites internet étaient inondés d'originalité graphique. Mais l'effet "Matrix" qui veut que ce monde virtuel soit nécessairement hyper-technologique s'est rapidement estompé.

Aujourd'hui, on observe un trés net retour à plus de conformisme au niveau des sites internet, tous secteurs confondus, hors sites Flash évidemment.
L'utilisation massive de CMS ou système de gestion de publication en ligne contribue nettement à uniformiser le rendu des sites, les publicateurs se concentrant pour le moment sur cette opportunité de n'avoir pas à créer un site mais juste y publier du contenu.

Ainsi, de trés nombreux sites, basés sur des solutions aujourd'hui largement employées (Dotclear, Spip, Wordpress, Textpattern, Typo3, Mambo, Drupal, Wiki ...) se "ressemblent" comme deux gouttes d'eau au niveau de la mise en forme.
Ce n'est pas un mal, l'utilisateur s'habituant ainsi à ne plus perdre son temps à chercher dans un menu ou un site ultra-designés comment il va accéder à l'information de son choix.
On sent bien que le web, à travers des acteurs professionnels ou amateurs, se "standardise", quitte à perdre parfois en apparat.

Pourtant, ne nous y trompons pas, on peut réaliser tous types de design en CSS !

Le Web, c'est pas pour tout le monde

Les spécialistes ont beau répéter que les CSS sont d'une facilité déconcertante, la réalité est souvent trés différente dés lors qu'un intégrateur doit créer une mise en forme à partir d'un design fourni par un graphiste "excentrique".
Là, les choses se compliquent. Il n'est plus aussi évident de devoir se contenter d'une colonne à gauche ou à droite, d'un menu horizontal sous une bannière, et de régler le problème en deux ou trois heures.

Ceux-là, s'ils ont entendu la voix des standards, préfèrent souvent rester fidèles à leurs vieilles habitudes, et surtout à un logiciel, qui une fois cracké (ben oui, les enfants du web sont des canards sauvages qui ne s'acquittent pas tous de leurs licences), leur fera un site sur mesure, sans soucis de devoir hacker de la feuille de style (ça c'est encore légal) pour rendre le site compatible sur tous les navigateurs.

On peut même penser sérieusement qu'Adobe devrait, avec les milliards générés et son appétit vorace, penser à contrer ses malheureux prophètes des standards, qui hurlent dans le vent que les feuilles de styles et une séparation de la structure d'un document et de sa mise en forme sont l'avenir du web.

Parce que pour l'instant, le web n'est pas pour tous, c'est une évidence.
Ni pour les exclus, ni pour les ignorants.
Mais Adobe prépare sa revanche secrètement, savourant la discorde et la grande pagaille qui règne encore sur le développement web, et profitant doucement de l'avènement d'un autre facteur, AJAX.

On risque d'avoir d'ici quelques mois ou quelques années (nous sommes français, donc on suit bêtement le troupeau guidé par le berger Américain qu'on aime tant conspuer), un nouveau virage dans l'approche des sites internets, tant sur leurs interfaces graphiques qu'au niveau des fonctionnalités et usages possibles côtés clients.

Et là, le seul poids lourd du moment qu'est Dreamweaver pourrait bien connaître une renaissance et un succès considérable, en proposant un environnement de création automatisé et riche.
Son public étant déjà acquis à sa cause, les standards du web pourraient alors connaître une période de crise assez sensible.
Aujourd'hui, faire un site dynamique avec Dreamweaver relève plus de la facilité que de la volonté de vouloir mettre en place un service web administrable. Le code produit étant aussi lourd qu'incompréhensible et difficile à maintenir, les solutions alternatives que sont les CMS sont toutes indiquées.
Notons pourtant que Dreamweaver propose plusieurs modèles élaborés avec une structure séparée de la mise en forme, mais ces modèles ne sont presque jamais employés.
Reste l'aspect graphique. Et sur ce point, Dreamweaver est encore trés largement employé parce que l'usage des tableaux (qu'il génère nativement lors du dessin d'une mise en forme) permet une meilleure maintenance au profane, à celui qui ne veut pas perdre de temps à assimiler les "complexes" feuilles de styles. Il n'a pas (encore), avec une structure en tableaux, à se soucier d'un problème de compatibilité avec d'autres navigateurs.

Ce sont pourtant ces mêmes tableaux qui sont au centre de tous les débats depuis bientôt 3 ans.
L'argument de la non-accessibilité n'est pas vendeur, il faut le reconnaître. On aime dire en salon qu'on soutient la misère, mais de là à acheter une baguette et quelques tranches de jambon pour le mendiant qui attend devant le supermarché, peu franchissent le pas. Donc qu'un site ne soit pas "visible" sur un navigateur braille parce qu'il est structuré en tableaux, ce n'est pas aujourd'hui un argument vendeur (c'est déplorable mais c'est comme ça, à l'image d'une société qui exclue sans cesse).

La conformité et l'usabilité ne sont pas encore alliées

Soyons manichéen jusqu'au bout puisqu'il s'agit d'une guerre.

On a d'un côté les pro-standards, ils font du web conforme et le font bien. Enfin, ils en parlent bien, parce qu'on ne voit pas beaucoup les résultats concrets, si ce n'est dans l'usage de CMS XHTML Strict 1.0.
Certains exhibent même fièrement un XHTML 1.1, sans savoir pourquoi ils choisissent cette solution. Ce serait un peu comme avoir la dernière configuration machine du marché pour faire tourner le bloc-note et sa messagerie.

De l'autre côté, les antis. Ils sont plus antis parce qu'ils ne comprennent pas comment faire d'ailleurs, plus que par véritable conviction.

Tant que l'usage de Dreamweaver sera plus simple que de mettre des DIV, des UL, des LI, des Fieldset de partout raccordés avec un coup des class ou un coup des id puis une ou plusieurs CSS derrière, ça devient un peu complexe, là, parce qu'il faut réfléchir.

D'ailleurs, le témoignage de Robert, jeune webmaster, l'atteste :

"Dreamweaver, c'est cool, que c'est le logiciel que tu peux faire un site web avec même en programmant des algorithmes t'imagine pas comment t'es trop fort."

Note : j'ai pris la liberté de corriger quelques fautes d'orthographes...

Bon, la récréation étant finie, mettons de côté les amateurs pour mieux se concentrer sur un usage plus professionnel du web.

Il est convenu par beaucoup que le web doit se concentrer sur le contenu. C'est évident.
Aussi, une entreprise, une association, un réseau devra publier des pages web qui seront lues par d'autres usagers.
Pour publier, il faut écrire puis formater. Autre évidence, mais comment présenter un document relativement long sans penser à le formater ?
Par formatage, on entend de donner une mise en forme au texte afin de rendre plus lisible.
Pour celà, il existe deux solutions :

• Produire des pages statiques directement formatées via les feuilles de styles,
• Produire des pages dynamiques qui vont nécessiter un formatage dynamique.

Dans le premier cas, aucun soucis, mais l'ère des sites statiques touche à sa fin.
Dans le second cas, quelles sont les solutions s'offrant aux publicateurs web ?
Il leurs faut pouvoir utiliser un éditeur de texte afin de formater le texte. Mais sur l'ensemble des CMS existants, la possibilité de formatage est relativement réduite, se limitant souvent à pouvoir mettre certains caractères en emphase, en italique, ou en souligné.
D'autres CMS proposent d'insérer des listes numérotées ou ordonnées, de mettre une portion de texte en retrait, en citation. Ce n'est pas suffisant.

Pour obtenir une richesse équivalente à un éditeur de texte type Word ou Open Office, il faut implémenter des éditeurs Wysiwyg ou développer sa solution personnelle.

Ces éditeurs WYSIWYG sont nombreux, disponibles en Open Source ou en versions commerciales.
Sans les avoir tous tester, je vous propose ici un éditeur trés performant pour la démonstration, TinyMCE.

On va donc tester l'intégration d'un texte saisi au préalable dans un éditeur type Word ou Open Office afin de reproduire le schéma traditionnel de publication en ligne d'une entreprise.
Ces tests seront faits sur deux navigateurs seulement : Firefox (1.5) et Internet Explorer (6). Que les utilisateurs d'Opera ne m'en tiennent pas rigueur.
Le but sera de montrer qu'au-delà de la difficulté et parfois de l'impossibilité de formater correctement ou facilement un texte pré-saisi, on rencontrera fatalement des problèmes de conformité sur le rendu des pages web produites par ces éditeurs, pourtant indispensables.

Les éditeurs WYSIWYG et la conformité aux standards

Le texte est donc déjà écrit. Mais jusqu'à présent, il n'est pas possible de réaliser un copier coller depuis Word vers un éditeur en ligne et de garder la mise en forme du texte. L'utilisateur devra nécessairement reformater tout le contenu du texte en ligne, ce qui est déjà un inconvénient de taille en terme de temps.

L'éditeur TINYMCE, comme vous le constatez sur le lien laissé, ressemble à s'y méprendre à celui de Word, avec une iconographie plus soignée.

L'hypothèse la plus réaliste est donc qu'un texte soit déjà écrit. Le publicateur va donc se contenter de le recopier puis de le formater avec l'éditeur en ligne.

Premier problème avec... Firefox !

Certains seraient amenés à penser que j'en veux en ce moment à Firefox, pourtant mon navigateur par défaut depuis août 2003 (enfin, c'était Mozilla à ce moment là que j'utilisais).

Que ce passe t-il si on se contente de coller un texte directement avec Firefox ?
On obtient une alerte javascript telle que celle-ci :

Et si on souhaite plus d'information, on sera redirigé vers le site de Mozilla, expliquant en anglais uniquement la procédure à suivre afin de pouvoir désactiver ce qu'ils considèrent comme un verrou de sécurité.
A ce niveau, comment imaginer dans un réseau d'entreprise des personnes chargées de publier du contenu internet, capable d'engager une telle procédure, sans compter qu'ils n'auront pas les droits nécessaires ?

Ce n'est quand même pas chercher le petite bête que de mettre le doigt sur quelque chose d'assez curieux, d'autant que le comportement sera le même avec d'autres éditeurs.
L'utilisateur devra alors aller modifier un fichier user.js, situé dans les méandres d'un disque dur, avec tous les risques d'erreur qu'un utilisateur non expert risque de commettre.
Pour ma part, même avec les directives de Mozilla, la modification du dit fichier n'autorise pas plus le coller des textes.
Si je peux raisonnablement me placer à peine au-dessus d'un utilisateur moyen, comment celui-ci va résoudre son problème ?

Sur Internet Explorer, le coller est autorisé. Il était assez utile de rappeler ses fonctionnalités, à l'heure où beaucoup ont déjà brûlé le navigateur battant pavillon Microsoft. Ceux-là même qui brûleront bientôt un autre pavillon, estampillé Google, lorsqu'il sera considéré comme beaucoup trop capitaliste.

Heureusement, il reste une fonctionnalité génialissime pour les utilisateurs de Firefox / Mozilla, le coller depuis Word !

Le problème évoqué précédemment est ainsi oublié. On peut renterrer la hache de guerre.

Que les gagas de Firefox se rassurent, c'est bien Internet Explorer qui ressortira mauvais élève de ce test, car c'est lui qui produira, pourtant à partir des mêmes actions, un code HTML différent que celui produit par Firefox.
Bien sûr, c'est un abus de langage que de dire que le navigateur "produit" du code. C'est évidemment le fichier javascript de l'éditeur WYSIWYG, qui selon le navigateur utilisé, va produire ce code HTML.
Et avec Internet Explorer, le code est souvent obsolète, comme l'insertion de balises font ou l'imbrication de multiples balises en lignes là où une seule est produite (et suffisante) avec Firefox.

TinyMCE n'est pas vraiment un bon exemple, puisque c'est de loin le meilleur éditeur que j'ai pu tester jusqu'ici (merci Jep au passage).
Il n'est pourtant pas parfait, quelque soit le navigateur utilisé.
Mais d'autres éditeurs pourtant renommés, comme Htmlarea, sont vraiment farfelus malgré une interface tout aussi simplissime d'emploi, et à portée du premier venu.

Conclusion

On le voit, le contenu et la qualité du contenu est ce qui doit faire la richesse et d'un site internet, et du web en général.
La conformité aux standards du web, appelés standards du W3C, est indispensable également pour produire des documents portables, compatibles et accessibles.
Cette notion d'accessibilité, j'aime à le rappeler, ne se limite pas qu'aux personnes handicapées d'ailleurs, sinon il faudra bien considérer que ne pas avoir un accès ADSL peut être un handicap pour certains sites.
Pourtant, sauf à confier la gestion du contenu systématiquement à des professionnels, et ainsi augmenter les coûts de maintenance d'un site et les dépendances à un prestataire (ou à un poste salarié), un site se doit nécessairement de pouvoir disposer d'un moyen de formater correctement et professionnellement un document.
Et là, l'usage des éditeurs WYSIWYG, tout aussi simple qu'il soit puisqu'il ne nécessite aucun apprentissage supplémentaire par rapport à un éditeur de bureau (Word ou OpenOffice Writer), va provoquer une non conformité avec les standards s'il est utilisé tel quel sans traitement des chaînes dynamiquement côté serveur.
Ce que les développeurs oublient parfois trop souvent, c'est la nécessaire empathie pour se mettre à la place d'un "usager du web" qui n'a pas les mêmes habitudes ni la même culture informatique qu'eux.

La solution ?
Il semblerait qu'il n'y en ait que trois :

• Que tout le monde utilise Firefox ; le problème est (presque) "réglé". Il faut juste convaincre 80% des utilisateurs...
• Utiliser un éditeur personnalisé, pas nécessairement WYSIWYG, mais qui produira un code strictement identique quelque soit le navigateur utilisé.
• Oserais-je ? Attendre la sortie d'Internet Explorer 7, en espérant qu'il soit le plus parfait possible ?

Pour l'instant, à défaut de pouvoir convaincre un client d'installer Firefox sur tous les postes de travail ou d'attendre encore longtemps une future version d'Internet Explorer implémentant correctement les CSS et le XHTML (c'est en progrèsVoir la page en progrès. Lien externe (nouvelle fenêtre ou nouvel onglet > clic droit), comme disent les geeks), j'implémente une solution personnelle basée sur le BBCode.
Inconvénient : elle nécessite un apprentissage de la part de l'utilisateur/publicateur futur.
Avantage : le code produit est conforme aux standards du W3C quelque soit le navigateur utilisé.