Un an avec Gutenberg

Il semble que c'était hier que Gutenberg est devenu une partie officielle de WordPress mais, croyez-le ou non, cela fait déjà plus d'un an ! L'année 2019 a sans aucun doute été l'année de Gutenberg dans WordPress. Aimez-le ou détestez-le, il ne va nulle part de si tôt et, en fait, c'est maintenant un nouveau standard dans notre CMS bien-aimé visant à offrir une meilleure expérience utilisateur.

Dans l'article d'aujourd'hui, je voudrais passer rapidement en revue tout ce que l' éditeur de blocs WordPress a réalisé au cours des derniers mois. En particulier, j'aimerais discuter de ce qui le rend spécial, pourquoi certaines personnes l'aiment et d'autres le détestent, et ce que cela signifiait pour nous, développeurs. Faisons ça !

Lancement de Gutenberg

Dans State of the Word de 2016, Matt a déclaré que l'éditeur WordPress était l'une des choses sur lesquelles nous devrions nous concentrer, car il nécessitait beaucoup de travail pour être amélioré. A cette époque, les premières rumeurs autour d'un "éditeur basé sur des blocs" avec lequel "unifier les widgets" et "améliorer les shortcodes " sont apparues. Était-ce le premier coup d'œil sur ce qui allait devenir Gutenberg ?

Un an plus tard, dans le State of the Word 2017, Matt présentait officiellement Gutenberg, un projet dont le développement avait déjà pris 11 mois et il en restait encore quelques-uns à faire. Le projet a introduit le concept de « blocs » comme une solution élégante pour la création et la gestion de contenu . Gutenberg était encore trop vert pour faire partie du noyau de WordPress, il est donc resté en tant que plugin pendant quelques mois encore.

Enfin, après deux ans de gestation, il était temps de présenter le petit nouveau à la société et fin 2018 Gutenberg a finalement intégré WordPress Core . À mon avis (et celui de nombreux autres professionnels du secteur), cela ressemblait à une décision hâtive - nous avions l'impression que le plugin n'était pas encore prêt pour le grand public mais, hélas, il était là. L'intégration de Gutenberg dans la nouvelle version de WordPress a été pleine de controverse et beaucoup de gens l'ont détestée.

Pour éviter des maux majeurs, l'équipe de développement de WordPress a également préparé un plugin parallèle avec lequel désactiver complètement Gutenberg et ainsi continuer à utiliser l'éditeur classique… mais le développement de Gutenberg ne s'est pas arrêté là, bien sûr !

Premiers pas

Comme indiqué plus haut, le lancement officiel de Gutenberg a été un peu rude, d'autant plus qu'il a eu de nombreux détracteurs et qu'il y avait de nombreux détails à peaufiner. Cela ressemblait vraiment à une décision précipitée. Vous savez, WordCamp US 2018 approchait à grands pas et "nous avons déjà besoin que Gutenberg y soit", et c'est ce qu'ils ont fait.

Quoi qu'il en soit, la réalité était ce qu'elle était et, en janvier 2019, nous avions tous ce nouvel éditeur dans notre tableau de bord WordPress. Cela signifiait que les utilisateurs et les développeurs devaient s'adapter à cette nouvelle réalité… et plus tôt nous le ferions, mieux ce serait !

Le principal problème auquel nous avons tous été confrontés au cours des premières semaines était son UX sous-performant. Je me souviens que l'éditeur était complètement inutilisable si vous l'utilisiez avec Yoast, apparemment en raison d'un problème avec l'API d'annotation Gutenberg. Les blocs se déplaçaient de manière étrange, les raccourcis clavier étaient différents et imprévisibles, l'éditeur était lent sur les ordinateurs plus anciens…

Mais, malgré les erreurs et les problèmes initiaux, le rythme effréné de développement du plugin a rendu possible ce qui semblait presque impossible : réparer et améliorer rapidement l'expérience utilisateur que l'on avait en utilisant Gutenberg. Quelque chose qui, si je suis tout à fait honnête avec vous, était vraiment nécessaire, car l'éditeur classique était assez obsolète :

Évolution

L'évolution de Gutenberg durant sa première année de vie publique a été vraiment incroyable. Les mises à jour se sont succédées et les développeurs ont peaufiné chaque détail de Gutenberg jusqu'à ce qu'il devienne une interface plus conviviale et plus efficace. Quand on regarde les chiffres et, en particulier, le taux d'adoption de Gutenberg, il semble que nous soyons sur la bonne voie. Au moment de la rédaction de cet article, deux installations de WordPress sur trois utilisent la version 5.x, ce qui signifie que Gutenberg est nativement disponible pour les deux tiers de tous les utilisateurs de WordPress.

Mais, à vrai dire, rappelez-vous que l'on peut désactiver complètement Gutenberg en installant simplement le plugin Classic Editor. À l'heure actuelle, ce plugin compte plus de 5 millions d'installations actives et plus de 700 notes cinq étoiles accompagnées de commentaires tels que "l'ancien est de l'or", "le plugin le plus important à avoir" ou "le plugin que j'utilise sur tous mes sites Web". Alors est-il possible que Gutenberg soit un fiasco ?

Eh bien, à mon avis, non. Si vous regardez la tendance actuelle des installations actives correspondant au plugin Classic Editor, vous verrez qu'il ralentit. Cela signifie qu'au fil du temps, de moins en moins de personnes utilisent ce plugin. Une explication possible à cela est le fait que Gutenberg est déjà "assez bon" et, par conséquent, il n'est pas nécessaire d'utiliser l'ancienne version de l'éditeur. Et c'est sans aucun doute une très bonne nouvelle.

Bibliothèques de blocs

L'une des conséquences de l'intégration officielle de Gutenberg dans WordPress a été la prolifération de nouveaux blocs avec lesquels créer du contenu. De toute évidence, les développeurs ont identifié un problème et ont décidé d'améliorer l'expérience globale.

Au cours des derniers mois, nous avons vu comment des plugins sont apparus dans le seul but d'élargir la gamme de blocs disponibles pour Gutenberg. Ainsi, par exemple, nous avons des plugins comme Atomic Blocks qui ajoutent de nouveaux blocs, ainsi que des plugins comme Stackable ou EditorsKit qui incluent de nouveaux styles et offrent des options d'édition supplémentaires aux blocs déjà existants.

Avantages de Gutenberg

L'une des grandes critiques qui ont toujours existé dans WordPress était l'effet de verrouillage inframous. Fondamentalement, cet effet décrit la dépendance qui apparaît avec certains thèmes ou plugins lorsque vous commencez à les utiliser. Une fois que vous avez créé du contenu avec l'un de ces projets verrouillés, vous ne pouvez pas vous en débarrasser facilement ou vous perdrez ledit contenu.

La plupart des exemples de cet effet peuvent être trouvés avec les constructeurs de pages. Lorsque nous n'avions que l'éditeur WordPress classique, de nombreux développeurs de thèmes ont identifié un autre besoin : les utilisateurs voulaient pouvoir mettre en page des pages à l'aide d'un éditeur visuel qui leur permettait de glisser-déposer des blocs de contenu pour construire leurs pages facilement. Malheureusement, créer une page avec un tel constructeur de page signifiait que vous seriez bloqué avec ce constructeur de page pour toujours - si vous ne vouliez plus utiliser le constructeur de page, vous deviez d'abord recréer votre page ou risquer de perdre ce.

Gutenberg a été une révolution à cet égard. Désormais, grâce à l'introduction officielle du concept de « bloc », les constructeurs de pages ont enfin à leur portée un mécanisme standard pour définir l'apparence d'une page. Ils doivent simplement tirer parti des nouvelles interfaces fournies par Gutenberg. Bien sûr, le processus de standardisation des constructeurs de pages actuels vers les blocs WordPress sera lent, mais je ne doute pas que cela finira par arriver.

Améliorations continues

Gutenberg s'améliore de plus en plus à chaque nouvelle version, car de nouvelles fonctionnalités et plusieurs améliorations sont incluses dans chaque version. Par exemple, il y a quelques semaines, une nouvelle version du plugin Gutenberg (déjà 7.1) est apparue avec de petites améliorations d'utilisabilité pour les utilisateurs, comme un dialogue de bienvenue pour "rencontrer" Gutenberg ou des améliorations dans la sélection de contenu multi-blocs.

Mais il y a une amélioration que j'aime particulièrement, et ce sont les mouvements dans l'éditeur. Veuillez jeter un coup d'œil à cet article de Matias Ventura où vous avez une explication très détaillée de "comment le mouvement nous aide à comprendre le changement".

Ce que Gutenberg signifiait pour nous (chez Nelio)

L'arrivée de Gutenberg a également apporté des mises à jour intéressantes dans notre entreprise. Essentiellement, si nous voulions développer nos produits et les rendre compatibles avec Gutenberg, nous devions recycler et apprendre une toute nouvelle pile de développement.

Comme Toni vous l'a dit il y a quelques semaines, au cours des deux dernières années, nous avons étudié et appris React et Redux. À la suite de cette étape d'apprentissage, nous avons lancé plusieurs plugins spécifiques pour Gutenberg, tels que Nelio Maps, Nelio Translate ou Nelio Compare Images. Nous avons également consacré une bonne partie de notre temps et de nos ressources à la modernisation de Nelio A/B Testing, et nous entreprenons actuellement la même tâche avec Nelio Content.

Nous avons même appliqué certaines de nos compétences nouvellement acquises pour contribuer à WordPress et proposé plusieurs pull requests :

• Correction d'un bug avec les dates
• Correction d'un bug avec les arguments de requête et les fragments d'URL dans JS
• Proposition pour travailler avec les attributs Number et Boolean dans l'API Block
• Correction d'un bug avec les entités HTML (non) échappées

Personne n'aime les changements. Lorsque vous vous habituez à un ensemble d'outils ou de technologies, vous ne voulez probablement pas les abandonner pour apprendre quelque chose de nouveau. Les gens sont réticents à ce que les choses changent… mais, si je suis honnête, le changement nous a bien servi. Nous sommes très fiers de tout ce que nous avons appris en cours de route et des choses que nous pouvons faire aujourd'hui grâce à Gutenberg.

Et toi? Vous aimez Gutenberg ? Comment cela a-t-il changé votre vie ? Faites-nous savoir dans la section commentaire ci-dessous.

Image sélectionnée de freestocks.org sur Unsplash.