Blogue

Depuis que j’ai écrit mon dernier article sur les thèmes que j’utilise sur ce site et dans mon travail avec nos clients… tout a changé à plusieurs reprises pour moi. La plus grande différence entre 2023 et aujourd’hui, est que GeneratePress n’est plus ma solution automatique de prédilection, et ce n’est plus le cas depuis un bon moment déjà. Il y a plusieurs raisons à cela, mais elles tiennent surtout à des changements dans mes méthodes de travail et non à des faiblesses dans l’écosystème de GeneratePress.

Le début de ma plus récente évolution

Je sais que c’est cliché de dire ceci, mais il y a eu quelques évènements majeurs dans l’écosystème de WordPress et dans mon propre travail dans les 3 dernières années. Le plus important pour moi fut d’avoir donné une réelle chance à Bricks Builder vers la fin de 2024 (plus de 3 ans après l’avoir acheté). Quand j’ai commencé à travailler avec Bricks, j’ai découvert les frameworks CSS et des outils comme Automatic.css qui est un framework CSS qui a complètement changé ma façon de travailler.

Bricks et ACSS m’ont propulsé dans une nouvelle phase d’apprentissage durant laquelle j’ai approfondi de façon significative mes connaissances des méthodes modernes de développement web. J’ai commencé à implémenter une méthodologie “class-first” utilisant les principes DRY (Don’t Repeat Yourself) and la nomenclature BEM (Block, Element, Modifier) pour les noms de classes CSS. Le tout en plus de l’utilisation de composants (components) réutilisables.

Quand j’ai découvert la série vidéo “Page Building 101” de Kevin Geary dans laquelle il utilisait Bricks et ACSS pour bâtir des sites utilisant les méthodes de développement modernes, ceci m’a poussé à revoir mes propres façons de faire et les amener à un autre niveau.

Mais en plus, Bricks était beaucoup plus facile à utiliser et plus flexible que GeneratePress et GenerateBlocks ou tout autre thème ou constructeur que j’ai pu utiliser dans le passé pour des choses plus complexes (boucles et grilles, contenus dynamiques, etc.) L’interface utilisateur de Bricks n’est pas parfaite, mais elle me permet de travailler beaucoup plus rapidement et en réduisant de beaucoup le besoin d’utiliser des extensions supplémentaires ou solutions de tierces parties pour des choses comme des animations, des carrousels, l’affichage des données dynamiques et plus comme ces choses sont incluses directement dans Bricks.

En fait, travailler avec des données dynamiques est tellement plus facile et plus puissant avec Bricks que retourner travailler avec Generate Blocks me semblait très limitatif et lourd. Je n’affirme pas ceci à la légère comme j’ai encore beaucoup de respect pour Tom Usborne et les produits Generate qui, très honnêtement, évoluent rapidement depuis quelques mois. Mais les avantages de Bricks en 2024 et 2025 étaient évidents pour moi.

Mais, il y avait des problèmes à utiliser Bricks que je n’avais jamais rencontré avec GeneratePress/Blocks. En particulier, l’édition de contenu par les clients n’est vraiment pas facile avec Bricks à moins d’utiliser une solution de tierce partie très alambiquée et très mal documentée (GutenBricks) ou de planifier d’avance des tonnes de composantes crées dans Bricks avec une interface loin d’être idéale et offrant très peu de flexibilité aux éditeurs de contenus qui ne sont pas des spécialistes pouvant utiliser Bricks (et c’est une très mauvaise idée de laisser un client utiliser Bricks… ;)

J’utilisais donc Bricks surtout pour des sites clients où je savais qu’ils nous laisseraient le soin de faire la gestion de contenu. Mais ceci était un irritant constant et, pendant ce temps, l’écosystème Generate continuait d’évoluer sans rencontrer ces problèmes…

La véritable (r)évolution : Etch – un constructeur de page pour les méthodes de développement web modernes

Les choses ont changé de nouveau pour moi en janvier 2026 quand la première version alpha de Etch a été rendue disponible aux clients de la première heure. J’avais adhéré à la promesse de Etch à la première opportunité en me basant sur mon expérience avec ACSS et Frames ainsi que le contenu des tutoriels de Kevin et la qualité de l’équipe de Digital Gravy (la compagnie derrière Etch, ACSS et Frames). C’était en décembre 2024 bien avant qu’une copie utilisable du plugin soit disponible publiquement, mais le potentiel de la plateforme était déjà très clair pour moi.

Je crois maintenant que la sortie de Etch est la chose la plus importante qui se soit produite dans l’écosystème de WordPress depuis plusieurs années.

Etch est un environnement de développement web visuel de nouvelle génération créé par les mêmes développeurs qu’Automatic.css avec le même souci du détail et en respectant les méthodes modernes de développement web ce qui fait partie d’une vision et d’une philosophie claire depuis le début.

Etch a tout changé pour moi. Ce constructeur est différent parce qu’il a été créé pour les professionnels et pour répondre à une question fondamentalement différente de celle à laquelle répondent tous les autres constructeurs de pages standard: “Comment rendre la conception web facile pour monsieur et madame Tout-le-Monde?” Ceci produit des constructeurs de pages qui tentent de réduire la complexité au maximum mais produisent souvent du code soit très lourd, inaccessible et généralement de qualité médiocre. Ceci produit des sites web lents, difficiles à utiliser et peu accessibles comme la majorité des gens n’ont pas les connaissances requises pour maitriser les rouages de ce métier complexe… peu importe les fables que les créateurs de ces produits ou autres influenceurs technos vous racontent. Créer un site web accessible, optimisé pour les moteurs de recherche et facile d’utilisation est un art qui requiert temps et effort à maitriser. Et je ne parle même pas des aspects visuels ou de design graphique.

À l’opposé, Etch répond à une question très différente : “Comment utiliser un environnement de développement visuel pour innover des façons de faire professionnelles qui respectent le langage et les meilleures pratiques du développement web?” C’est une philosophie fondamentalement différente qui a éliminé les mauvais côtés des constructeurs de pages traditionnels en donnant aux utilisateurs professionnels un accès direct à tout le code en tout temps (HTML, CSS, JavaScript). Le tout en offrant de multiples outils visuels qui simplifient la vie et vous sauvent du temps (barre d’outils CSS, recettes, etc.) Si vous savez comment créer du code accessible et de qualité, Etch offre un environnement flexible qui respecte les méthodologies de développement web modernes.

Etch n’a pas de champs de styles propriétaires et limitants (genre Elementor). Pas d’éléments d’interface sans codage créés pour simplifier la vie des utilisateurs néophytes, mais qui limitent ce que le constructeur peut faire. Vous avez accès immédiat à tout le code HTML, CSS ou JavaScript directement dans l’interface en tout temps. La création de boucles dynamiques, logiques conditionnelle et la gestion de données dynamiques sont aussi très simples et directes, mais sans les limitations d’une interface limitée et rigide. Vous pouvez aussi changer ou ajouter des attributs HTML comme aria- ou data- directement sans avoir à passer par une interface spéciale.

La création et gestion des composants (components) est aussi beaucoup plus flexible, comme la création de propriétés (props) est plus simple et plus claire que dans les autres constructeurs que j’ai utilisés. Les composants supportent aussi des propriétés (props) avancées, comme des répéteurs, classes CSS personnalisés, des objets, etc. Il est aussi possible de créer des logiques conditionnelles pour les props ou les grouper et bien plus.

Une véritable libération des données et une portabilité inégalée

Il y a deux facettes pour comprendre la véritable nature transformatrice des fonctionnalités de libération de données et de portabilité de Etch.

Premièrement, lorsque vous travaillez dans Etch, tous les éléments ou composants que vous ajoutez dans la structure de la page ou du gabarit sont automatiquement générés sous forme de blocs Gutenberg personnalisés et qui sont stockés dans le format natif de WordPress. Le contenu de ces blocs est aussi directement modifiable dans Gutenberg ce qui résout le problème principal que j’avais avec Bricks.

Si vous utilisez des composants (components), ceux-ci sont aussi enregistrés directement en tant que compositions synchronisées dans le format natif de WordPress et les propriétés (props) qui y sont rattachées sont aussi accessibles et modifiables dans Gutenberg. Le tout sans besoin de créer ces composants d’une manière spéciale ou d’utiliser des extensions spécialisées, comme c’est le cas dans Bricks. En utilisant de la logique conditionnelle dans la définition de vos propriétés, vous pouvez aussi décider lesquelles sont accessibles à des rôles utilisateurs spécifiques dans WordPress si ça fait partie de votre besoin.

Aussi, comme le thème qui accompagne Etch est un thème FSE, la fonction de génération automatique en blocks Gutenbergs des éléments créés dans Etch fait en sorte que le contenu est aussi proche du format natif de WordPress que possible. Qui plus est, l’équipe d’Etch a promis de publier éventuellement une extension « pont » gratuite qui garantira qu’un site continue de fonctionner et de s’afficher de la même façon, même si Etch lui-même est retiré.

Deuxièmement, sur le plan de la portabilité, lorsque vous copiez un élément ou un composant dans Etch, ce qui est copié est une définition en format texte JSON de cet élément qui peut être collé directement dans une autre page ou gabarit ou dans un autre site ou sauvegardé en format texte pour utilisation ultérieure ou dans le but de le partager avec d’autres ou l’inclure dans une bibliothèque pour partager ou vendre des composants plus avancés. Plusieurs utilisateurs d’Etch ont déjà créé des sites offrant des bibliothèques de composants et compositions (patterns) de toutes sortes répondant à des besoins de fonctionnalités très variés. Le simple fait de pouvoir copier-coller des éléments, composants ou compositions d’un site à l’autre m’a déjà fait gagner beaucoup de temps.

L’autre avantage convaincant d’Etch pour ma façon de travailler est que, lorsque vous copiez-collez, vous avez le choix (dans les paramètres de l’extension) de préserver ou remplacer le CSS ou le JavaScript rattaché aux éléments copiés qui ont des classes CSS du même nom dans le site de destination. Aucun besoin d’exporter ou réimporter. Ceci m’a permis à l’occasion de créer un composant dans un site, le copier-coller dans un autre où j’ai du le faire évoluer (modifier le CSS, ajouter ou modifier des props, etc.), puis le recopier-coller vers le site original pour mettre le composant original à jour avec les modifications du 2e site. Ceci est unique dans l’écosystème WordPress à ma connaissance.

Je vais donner plus de détails sur ces fonctionnalités dans des articles futurs comme les implications sont beaucoup plus vastes que mes explications ici peuvent le laisser croire.

Une évolution rapide et de la transparence

Ce qui précède ne fait qu’effleurer ce qu’est Etch et tout ce qu’il peut faire. Un autre de ses avantages est son évolution rapide, mais pas seulement ça : une évolution rapide et publique, à l’écoute de ses utilisateurs et où les correctifs et nouvelles fonctionnalités arrivent rapidement toutes les semaines et parfois plus souvent.

Au moment d’écrire cet article, la version la plus récente est 1.6.2 et Etch est maintenant un produit très différent de la version publique initiale de janvier dernier. Il a reçu non seulement des améliorations d’interface, mais aussi une intégration intelligente de l’IA qui est toujours en évolution, des améliorations fonctionnelles de toutes sortes et bien plus, le tout à rythme très rapide.

En attendant que les composants natifs d’Etch soient livrés, une partie du travail d’édition est un peu plus manuel qu’il ne le deviendra dans un futur rapproché, mais, malgré ceci, la bibliothèque de compositions officielles (patterns.etch.com) ainsi que les multiples bibliothèques créées par les utilisateurs avancés d’Etch offrent des solutions qui fonctionnent dès maintenant et ne risquent pas de briser dans le futur. J’ai déjà construit des carousels complexes à l’aide de JavaScript personnalisés (avec l’aide de Claude) ou augmentés par Motion.page pour des animations précises et le tout fonctionne parfaitement.

Avec l’évolution de sa propre IA intégrée, Etch promet de faire gagner encore plus de temps à ses utilisateurs en leur permettant de construire des sites plus sophistiqués plus rapidement sans perdre le plein contrôle du résultat final qui demeure accessible et modifiable en tout temps.

Pour moi, ceci est une véritable révolution!