Le CSS (Cascading Style Sheets) n’est rien de moins que le langage incontournable du développeur front-end… et donc du web designer ! Après, ce n’est que mon humble avis…
Chacun son truc
Et comment penser autrement ? Certes, de plus en plus de plugins WordPress permettent à l’utilisateur de « tunner » son site de manière efficace, maquillant la bête à outrance, et souvent plus qu’une bagnole volée… Les thèmes s’y mettent aussi, ajoutant de plus en plus de fonctionnalités similaires, et maintenant WP passe à Gutenberg.
Mon truc, c’est plutôt le CSS. Une simple feuille de style qui peut, quand elle est maîtrisée, personnaliser l’apparence d’un site à volonté, tout en apportant cette sensation si agréable d’avoir la maîtrise de son code. Et couplé à du javascript ou du JQuery (faudra que je m’y mette un jour), c’est la fête au pays des intégrateurs.
Après, l’outil est costaud : des mois à en bouffer, de différentes manières, dans différentes situations (exercices, site from scrach, WP, Bootstrap, etc.), et on en découvre encore. Mise en page, animations, transitions, pseudo-éléments, le CSS permet un peu tout et n’importe quoi. Il est loin, le temps où balancer un « color: red; » sur Codecademy sentait bon la victoire…
Et comme tout langage, évidemment, il évolue. Le CSS est loin d’être passé de mode, et quand on voit les évolutions entre chaque version, on imagine à peine les possibilités à venir.
Après, loin de moi l’idée de jeter la pierre à ceux qui utilisent des plugins, au contraire (moi-même, d’ailleurs…), bien utilisés ils peuvent être redoutablement efficaces. C’est juste que personnellement, je préfère avoir le plus possible la maîtrise de mon code pour la mise en page générale.
« Beaucoup de bla-bla… Un exemple, peut-être ? »
Mis à part les exercices réalisés dans le cadre de la formation (Armor Code) et de quelques autres en lignes, j’estime avoir commencé à évoluer dans ma connaissance de ce langage pendant mon stage en entreprise. Devant réaliser un WordPress pour un club de tennis avec un thème sur-boosté répondant au doux nom de Divi, j’ai, à ma grande surprise (et à la demande de mon maître de stage), passé deux semaines à faire du CSS… et c’était super cool !
J’y ai découvert de nombreuses fonctionnalités, dont la possibilité d’ajouter les fameux pseudo-éléments.
Le pseudo-élément est un atout indispensable à l’utilisateur de WP. En effet, n’ayant pas toujours la possibilité de rajouter proprement des éléments directement dans la page, la technique du pseudo-éléments permet de créer un élément directement à partir de sa feuille de style.
À l’aide des sélecteurs ::after ou ::before, on peut littéralement matérialiser un élément dans son code. Texte ou bien image (à l’aide d’une url), on peut dans la foulée lui donner toute sorte de caractéristiques, avant de lui donner une position par rapport à un élément parent, et sans être obligé que ce soit son parent direct !
Ça à l’air de rien comme ça, et d’ailleurs ce n’est pas très compliqué, mais une fois maîtrisé, ça facilite grandement la vie.
« Mouais. Pas l’air très compliqué, tout ça… »
Non, et ça ne l’est pas ! C’est juste long, car très dense. Il n’y a qu’à voir ce que font certains sur le web, ou la complexité interne des frameworks, ou encore les joyeux psychos qui réalisent des images entières rien qu’avec du CSS…
Les animations, par exemple, ne sont pas si compliquées que ça, mais juste longues à prendre en main.
Bien des essais avant d’arriver à faire fonctionner ça. D’ailleurs, l’ajout de la propriété « !important » a été un passage obligé pour le bon fonctionnement de l’animation.
Pour conclure, je dirai que rien qu’avec le CSS actuel, il y a déjà beaucoup de boulot, et les futures évolutions ne seront certainement pas en reste. Mais la bonne nouvelle, c’est que quelles que soient les difficultés, arriver à ses fins et toujours aussi motivant !
Pas près de lâcher l’affaire, donc.