Blogue

L’effet « couteau suisse » des sites Internet utilisant des composants

Les plateformes multi-composants sont prisées par les développeurs et concepteurs Web d’aujourd’hui. À l’instar d’un « couteau suisse », leur architecture Web évolutive et leurs éléments de conception flexibles semblent s’adapter facilement aux besoins de chacun. Mais est-ce si simple que cela ? Une telle polyvalence a-t-elle un prix ? Ce billet vise à vous faire découvrir les dessous des sites Internet utilisant des composants.

Le garçon le plus heureux de la Terre

Ma mère avait l’air un peu inquiète, mais ça y est, j’avais enfin 10 ans et une promesse est une promesse ! Le commerçant déposa solennellement le couteau suisse rouge flambant neuf dans mes petites mains tremblantes, et il y eut échange d’argent. Une fois dans la voiture, sur le chemin du retour, je sentais le poids de l’objet dans ma poche dont j’imaginais déjà les possibilités infinies dans mes jeux futurs. Ce jour-là, j’étais le petit garçon le plus heureux de la Terre.

J’ai cependant vite déchanté, lorsque je me rendis compte que mon magnifique couteau suisse était probablement l’un des gadgets les moins pratiques jamais inventés par l’Homme. Certes, il est polyvalent. Sous son design élégant se cachent un bijou d’ingénierie et un marketing brillamment étudié. Mais en tant qu’outil…il ne vaut vraiment rien ! La taille du tournevis est rarement la bonne, la scie est bien trop courte, la lame du couteau bien trop ronde et le tire-bouchon est dangereusement peu maniable.

L’excitation naïve d’un petit garçon

Lorsque j’ai commencé à travailler avec des plateformes Internet basées sur des composants, j’ai ressenti la même excitation naïve que j’avais eue alors, enfant. Un ”designer” traduit la marque de mon client en un design élégant et immersif censé fonctionner parfaitement sur tout type d’appareil. Un « développeur de composants » (comme moi) élabore une belle boîte à outils de composants à partir de ce design. Enfin, les « créateurs de contenus », ou les auteurs, n’ont plus qu’à déplacer ces composants sur des pages et à assembler eux-mêmes le site Internet qu’ils ont à l’esprit.

La plupart des composants sont des éléments de page simples et basiques, comme un paragraphe de texte, une image ou un titre. Il existe aussi des composants un peu plus complexes, comme un flux Twitter ou une vidéo YouTube intégrée.  Et enfin, il y a toujours quelques composants conteneurs. Ces derniers, comme leur nom l’indique, fonctionnent comme des conteneurs pour vous permettre de classer d’autres composants en listes, colonnes, carrousels, etc. Vous pouvez, par exemple, déposer des composants image à l’intérieur d’un composant liste pour que les images s’affichent comme par magie sous la forme…d’une liste. Un rêve devenu réalité !

Mutants et dégénérés

Tout comme dans mes souvenirs d’enfance, j’ai rapidement compris que ce rêve pouvait virer au cauchemar. Et c’est ainsi que m’est apparu ce concept du « composant couteau suisse ». Ardemment désiré, il naît sous les traits d’un « gentil » composant, qui se transforme soudainement en une chose machiavélique, créant une frustration chez les créateurs de contenus, provoquant des poussées de stress chez les développeurs de composants et instillant un profond sentiment de malaise chez les ”designers”.

La dégénérescence touche souvent les composants les plus simples, comme le composant texte basique. L’effet déclencheur est presque toujours le même : un créateur de contenus demande une fonctionnalité supplémentaire, comme la possibilité de choisir une couleur ou une police. Et le catalyseur est toujours un développeur de composants, qui ne souhaite qu’une chose : plaire aux créateurs de contenus qui utilisent ses composants.

L’Illusionniste, le Caméléon et le Tyran

Les composants dégénérés, qui agissent en douce, peuvent mettre en pratique leur plan diabolique pendant un certain temps avant que n’apparaissent les premiers symptômes. Puis, en un beau jour ensoleillé, un changement de conception est demandé. Une modification du jeu de couleurs pour adapter le site à une nouvelle image de marque, par exemple. Soudain, les créateurs de contenus signalent la disparition pure et simple de paragraphes de texte…sur des pages aléatoires…sur tout le site Internet…en production ! J’appelle ce phénomène l’effet Houdini.

Celui-ci peut facilement s’expliquer : les créateurs de contenus commencent à utiliser la nouvelle fonctionnalité sur le composant texte, séduits par la flexibilité qu’elle leur procure pour remplacer la couleur par défaut des paragraphes de texte, ici et là, sur tout le site. Ce faisant, ils modifient sans le savoir ces instances du composant et lorsque celui-ci est actualisé, les éléments modifiés restent présents.

Parfois la couleur de fond du composant conteneur dans le nouveau design est la même que la couleur du texte modifiée au niveau de l’instance de ce composant. L’illusion parfaite : le texte semble avoir disparu.

La couleur remplacée peut aussi être différente de la couleur de fond, mais simplement incompatible, d’un point de vue esthétique, avec le nouveau design. Il en va de même pour les polices et autres attributs de texte qui auront été remplacés. Les pages sur lesquelles un créateur de contenus passe des heures à chercher la perfection (à ajuster les couleurs, les polices et autres attributs de texte) sont alors complètement corrompues. Ah, ce bon vieil effet caméléon !

Parfois, un bon composant peut commencer à vraiment mal tourner, juste à cause de ses mauvaises fréquentations. Tous les parents connaissent le phénomène du harceleur, ou du tyran. Prenez un simple composant titre, toujours très poli et fiable lorsqu’il s’agit de le glisser directement sur une page. Mais déplacez-le à l’intérieur d’un composant liste, et il peut devenir totalement hors de contrôle!

Il se transforme soudain en un véritable tyran, bousculant les petits paragraphes sans défense et passant au-dessus des images timides qui n’ont jamais su se défendre. Pourquoi cela ? Parce que le concepteur n’a jamais pensé à la possibilité qu’un composant titre soit utilisé à l’intérieur d’un composant liste.

Par conséquent, dans le design qu’il a conçu, les composants texte et les composants image à l’intérieur d’une liste ne sont pas assez « solides » pour faire le poids face à un composant titre lourd et dominant. Le développeur de composants n’en savait rien ou a fait preuve de complaisance. Il ne s’est pas assuré qu’il soit impossible pour un auteur bien intentionné de déplacer un composant titre à l’intérieur d’un composant liste. C’est un peu comme un père ou une mère qui néglige de surveiller les fréquentations de ses enfants.

Une besogne fastidieuse

Il ne faut pas négliger tout le travail que doit abattre le concepteur lors de la création d’un design pour une plateforme Internet reposant sur des composants. Durant le processus, il pense « composants » en permanence, veillant à en mettre peu et à ce qu’ils soient aussi simples que possible. Il s’efforce de fournir une expérience d’auteur fluide et intuitive, afin de créer une expérience visiteur agréable et immersive sur n’importe quel appareil.

Il doit constamment garder à l’esprit que l’orientation de l’écran peut changer lorsque l’utilisateur fait pivoter l’appareil. Et sans oublier les visiteurs souffrant d’une déficience visuelle et qui ont besoin de lecteurs d’écran adaptés. Il doit même penser à ces pauvres âmes perdues qui utilisent toujours Internet Explorer et d’autres navigateurs exotiques, voire préhistoriques.

Le prix à payer

Tant de préoccupations qui sont gracieusement endossées par le vénérable web designer pour faciliter la vie des développeurs de composants et des créateurs de contenus. Le prix à payer pour une telle extase ?

Si vous êtes créateur de contenus, vous devez réprimer l’envie de contrôler le moindre détail présent sur les pages que vous créez. Ce que vous pourriez considérer comme un manque de souplesse de la part d’un composant est certainement un compromis soigneusement soupesé. En acceptant de travailler dans les limites du design, vous vous épargnerez des heures de bidouillage avec les couleurs, l’alignement du texte, les styles de polices et j’en passe.

Et tout cela pour un résultat qui va certainement vous sembler désespérément médiocre. (S’il vous semble correct, vous avez raté votre vocation et devriez être “web designer”). Contentez-vous de pondre ce contenu accrocheur qui incitera les visiteurs à revenir sur le site et laissez la présentation au ”designer”.

Si vous êtes développeur de composants, vous devrez seulement apprendre à dire non de temps en temps. Une question comme celle-ci : « Pouvez-vous ajouter cette fonction dans ce composant, pour que je puisse mieux contrôler…? » devrait immédiatement vous évoquer des images cauchemardesques où vous rédigez des scripts de nettoyage pour rectifier le tir, quitte à faire une nuit blanche.

Commencez toujours par échanger avec votre ”designer”, entrez dans sa tête et apprenez à regarder un site Internet à travers ses yeux. Veillez à bien distinguer chaque problème, soyez toujours à l’affût du design qui se faufile dans le contenu de votre auteur ou dans votre code. Trouvez un compromis valable, qui peut être aussi simple que de donner aux auteurs la possibilité de choisir entre deux ou trois thèmes (créés pas des concepteurs) au niveau de la page ou du composant conteneur.