Aller au menu. Aller au contenu.

Nihil addendum
par al.jes

WYSIWTF

L’article d’aujourd’hui est la traduction 1 de l’article du même nom2 écrit au début du mois par Karen McGrane sur A List Apart. Comme pour la précédente traduction : « Ma capacité de traduction étant ce qu’elle est, je ne peux qu’inviter les anglophones à lire l’article original. Pour les autres, veuillez me pardonner si ce qui suit semble maladroit… »


Argumenter pour la « séparation du contenu et de la présentation » implique une distinction claire entre les deux. La réalité, bien sûr, est que contenu et forme, structure et style, ne peuvent jamais être complètement séparés. Quiconque a jamais écrit un document et joué avec pour voir l’impact de différentes fontes, graisses de titres et espacements sur la façon dont l’écrit fluctue sait que cela est vrai. Quiconque a jamais jeté un œil à du code HTML en essayant de distinguer le texte des balises le sait aussi.

D’un côté, la division du travail entre l’écriture et la présentation peut être vu n’importe quand dans notre Histoire. Qu’elle soit un antique scribe taillant des tablettes de pierre, un moine médiéval copiant des manuscrit enluminés, un imprimeur plaçant des caractères de plomb, nous n’avons jamais supposé que la personne qui produit le document et la personne qui arrive avec les idées doivent être la même.

Et pourtant, nous savons que média et message sont entrelacés si fermement qu’ils ne peuvent être aisément scindés. Les concepteurs graphiques pestent contre l’idée que le look and feel puisse être ajouté comme une couche de peinture à la fin du travail, parce que le design influence la signification. Plus nous sommes compétents en tant que communicants, plus nous réalisons que la séparation du contenu et de la présentation est une imitation de l’ère industrielle, une tentative de standardiser et segmenter des tâches qui sont profondément connectées.

Aujourd’hui, nous essayons de faire appliquer la séparation entre contenu et présentation parce que c’est bon pour le web. C’est ce qui rend les standards du web possible. Cela permet le partage et une réutilisation souple des contenus. C’est le socle de l’accessibilité. C’est ce qui nous permettra de rester sains pendant que l’on essaie d’avoir un même contenu sur des centaines de nouveaux appareils et leurs dimensions.

Quand ils parlent de comment séparer au mieux contenu et présentation, les designers et les développeurs tendent à se focaliser sur le code côté client 3 — ce qui fait sens, puisque c’est ce sur quoi nous avons le plus de contrôle. Mais, comme avec beaucoup des défis qui nous sont donnés par les contenus du web, le vrai problème est situé dans les outils que l’on donne aux créateurs de contenus pour les aider à structurer, gérer et publier leurs contenus. La forme que le contenu prend dépend autant du CMS que du CSS.

Comment les outils de gestion de contenus devraient-ils guider les créateurs de contenus pour qu’ils se focalisent sur le sens et la structure ? Quel est le bon taux de contrôle sur la présentation et les styles dans un CMS ? Et comment ces outils devraient-ils évoluer alors que nous outrepassons la métaphore de la page web et publions avec flexibilité nos contenus vers de nombreuses plateformes ? Voyons trois outils à l’intersection du contenu et de la forme.

Le bouton de prévisualisation

Même les plus rigides des éditeurs de contenus structurés aiment quand même voir à quoi leur travail va ressembler. Les écrivains impriment leurs documents pour édition afin d’avoir un aperçu différent de ce qu’ils voient à l’écran. Les blogueurs pressent instinctivement le bouton de prévisualisation pour voir leur travail comme un visiteur le verrait.

Oups. Les décades de travail à affiner les émulateurs entre programmes de publication assistée par ordinateurs 4 et imprimantes laser impliquent que les écrivains peuvent se sentir confiants en le fait que leur document resteront virtuellement identique, peu importe où ils sont imprimés. Nous avons emporté cette hypothèse sur le web, où ceci est catégoriquement faux. Les différents navigateurs affichent les contenus à leur manière. Leurs utilisateurs peuvent changer la taille et même ajouter leur propre feuille de style personnalisée. Aujourd’hui, le même document s’affichera différemment sur ordinateurs de bureau, tablettes et appareils mobiles. Le bouton de prévisualisation est un mensonge.

Malgré tout nous ne pouvons jeter le bébé avec l’eau du bain. En fait, voir un contenu dans son contexte devient même plus important maintenant que nos contenus vivent au travers les appareils et plateformes. Au lieu de lever les mains au ciel en disant « la prévisualisation est cassée », il est temps d’inventer un meilleur bouton de prévisualisation.

Une compagnie de publication que je connais a bâti sa propre interface d’aperçu, qui montre aux producteurs de contenus un exemple de comment une histoire va apparaître sur le web avec un ordinateur de bureau ou un mobile, ou dans une application dédiée. Est-ce parfait ? Loin de là. Un contenu va apparaître dans bien d’autres contextes que ces trois-là. Est-ce mieux que rien ? Absolument.

Le WYSIWYG

La révolution de la publication assistée par ordinateurs inaugurée par le Macintosh™ autorisa l’utilisateur à voir un document à l’écran dans une forme qui reflète fidèlement la version imprimée. La barre d’outils en haut de l’écran permet à l’utilisateur de d’occuper de la mise en forme — changer la fonte, insérer une image, ajouter des effets typographiques comme des titres ou des puces et bien plus encore.

Dans un effort pour apporter cette facilité d’usage au web, nous autorisons les créateurs de contenus à intégrer mise en page et informations de style directement dans leurs contenus. Malheureusement, le code ajouté par les créateurs de contenus peut être en contradiction avec la feuille de style et il est difficile pour les développeurs de filtrer entre le style et la substance. Quand il devient temps de mettre ces contenus sur d’autres plateformes, l’on se retrouve avec un désordre confondant.

Jusqu’à quel point pouvons-nous donner aux créateurs de contenus le contrôle sur la mise en forme ? C’est une question à laquelle il est difficile de répondre, parce qu’elle va au cœur même de ce qui est stylistique et de ce qui est sémantique. Même quelque-chose d’aussi simple que le gras ou l’italique nous oblige à nous demander si l’on se contente de styliser ou si l’on ajoute du sens (disons, un titre de livre ou un message d’alerte) 5.

Une meilleure modélisation des contenus peut résoudre certains de ces problèmes, en encourageant les créateurs de contenus à « fragmenter » de manière appropriée leurs textes. En bannissant les pâtés de texte avec mise en forme intégrée pour les remplacer par des morceaux de contenus propres, indépendants de toute présentation, nous construisons la distinction entre contenu et forme dès le départ.

Mais imaginer que chaque « fragment » de contenu est un camp dans la base de donnée (avec sa zone de saisie bien à lui) tourne vite à l’absurdité. Cette route mène à la folie. La véritable solution n’est pas nécessairement de « bannir les pâtés », mais de remplacer la barre d’outils WYSIWYG par un balisage sémantique. Plutôt que d’entrer tout un texte dans des zones de saisie distinctes, les auteurs de contenus enveloppent le texte avec sa description. Notre titre de livre n’a pas besoin d’être un camp séparé si on peut l’envelopper avec les bonnes balises.

Définir ce qui va dans une zone de saisie et ce qui va dans un balisage requiert une fine collaboration entre auteurs de contenus, architectes de CMS et intégrateurs. Il est temps que l’on commence à avoir ces conversations.

La modification instantanée

Nous évoluons. Insatisfaits de nous appuyer sur des outils qui sont des vestiges de l’ère de la publication assistée par ordinateurs, nous développons des moyens nouveaux et innovants de mélanger contenus et mise en forme, qui sont spécifiques à la façon dont le web fonctionne. Il n’y a pas de meilleur exemple de cela que la modification instantanée 6.

La modification instantanée permet aux créateurs de contenus de manipuler les contenus directement dans l’interface, sans séparation entre l’écran de modification et l’affichage du contenu. Medium offre une interface d’édition qui est identique à celle d’affichage7 sur ordinateur de bureau et l’édition sur place est implémentée dans le noyau de Drupal 8.

L’une des questions que l’on me pose le plus souvent est « Comment puis-je faire comprendre à mes rédacteurs pourquoi il est si important d’ajouter de la structure et des métadonnées à leurs contenus ? » Ceci, je crois, est l’un des défis fondamentaux que l’on rencontre sur le web, particulièrement maintenant que nous nous nous adaptons à un avenir multi-canaux. La modification instantanée encourage les créateurs de contenus à se concentrer sur la présentation visuelle de l’interface. Pile au moment où nous avons besoin qu’ils pensent à la structure sous-jacente, nous investissons dans des outils qui obscurcissent le « tissu conjonctif ».

Jeff Eaton résume fort bien ce problème dans un article intitulé « Inline Editing and the Cost of Leaky Abstractions » (La Modification instantanée et le coût des abstractions défaillantes) :

Les interfaces d’édition que nous offrons aux utilisateurs leur envoient d’importants messages, qu’on en ait eu l’intention ou non. Ce sont des potentialités, comme les poignées des portes et les touches des téléphones. Si la principale interface d’édition que nous présentons est aussi le design visuel vu par les visiteurs, nous disons : « Cette page est ce que vous gérez ! Les choses que vous y voyez sont la vraie forme de votre contenu ».

La meilleure solution n’est pas de construire des outils qui cachent cette complexité à l’utilisateur, qui leur font penser que le style q’ils ajoutent pour le site pour ordinateur de bureau est la « vraie » version du contenu. Au lieu de cela, notre objectif devrait être de communiquer la complexité appropriée de l’interface, et de guider les utilisateurs pour ajouter la bonne structure et style.

L’ère de la « publication assistée par ordinateurs » est terminée. Idem pour l’époque où nous privilégions l’interface web pour les ordinateurs de bureau par dessus les autres. Les outils que nous créons pour gérer nos contenus sont des vestiges de la révolution de la publication assistée par ordinateurs, où nous avons essayé de permettre autant de manipulation directe des contenus que possible. Dans un monde où nous avons une infinité de rendus possibles pour nos contenus, il est temps d’aller voir plus loin que les outils qui reposent sur des styles visuels pour porter une signification sémantique. Si nous voulons une véritable séparation du contenu et de la forme, cela doit commencer dans le CMS.


  1. Pour satisfaire au contrat de licence : Translated with the permission of A List Apart and the author (traduit avec l’autorisation d’A List Apart et de l’auteur). 

  2. Le titre de l’article est un jeu de mots entre d’une part WYSIWYG et WYSIWYM, soit les termes employés pour décrire les éditeurs de texte fonctionnant selon une logique visuelles et ceux fonctionnant selon une logique sémantique, et d’autre part WTF, interjection pour le moins appuyée. 

  3. (NdT) Par opposition au code côté serveur. 

  4. (NdT) Le terme d’origine est desktop publishing, qui se traduit bien par « publication assistée par ordinateurs », mais il convient dans se contexte de sous-entendre « assistée par ordinateurs de bureau ». 

  5. (NdT) Ce sont là de mauvais exemples : certes, italique et gras sont les deux façon usuelles de mettre en forme l’emphase et la forte emphase, mais il n’empêche que si l’on écrit un texte en caractère italique et que l’on marque l’emphase par l’usage d’un caractère romain, le lecteur comprendra aisément. De plus, le balisage HTML fait la distinction entre italique et gras d’une part et emphase et forte emphase d’autre part — marqués respectivement <i> et <b> d’une part, <em> et <strong> de l’autre. Néanmoins l’idée reste tout à fait valable. 

  6. (NdT) Le terme d’origine est inline editing. Une traduction plus littérale serait « édition en ligne », mais je ne voudrais pas que les gens comprennent cela comme online editing (édition en ligne, au sens de « sur Internet »). 

  7. (NdT) Les liens sont d’origine. 

Publié le 28.05.2013. Lien permanent. Retourner en haut.

©2012 – al.jes, certains droits réservés
Réagissez ! Écrivez-moi : me @ aljes.me