WordPress, un CMS aux multiples facettes éditoriales

WordPress est un CMS open source qui propose un écosystème foisonnant, en particulier pour les outils d’édition de contenus.

En effet, il existe un certain nombre de « constructeurs de pages” et de “constructeurs de contenus”, les plus connus étant Elementor, Divi, WP Bakery, ou encore Beaver Builder. Nous pouvons également citer Advanced Custom Fields (ACF), et bien sûr, le nouvel éditeur de WordPress, Gutenberg.

La flexibilité qu’apporte WordPress fait qu’il n’y a pas une seule manière de faire des sites sous WordPress, et que chaque agence web possède ses propres compétences.

Pourquoi Gutenberg?

A Be API, nous avons testé et avons travaillé avec la majorité des constructeurs cités précédemment; et nous avons pu les évaluer en conditions réelles, et comme toujours sur le long terme avec notre offre de maintenance WordPress.

Et aucune d’entre elles ne nous apporté autant de certitudes, de fiabilité, d’évolutivité que Gutenberg, le “content builder” natif de WordPress.

En effet, depuis décembre 2018, mois de sortie officielle de WordPress 5.0 et de cette fonctionnalité, Gutenberg a révolutionné les mises en page anciennement proposées par l’ancien éditeur de WordPress, ou même ACF.

Gutenberg représente pour Be API :

Le bon compromis liberté/simplicité

Nos projets s’adressent à des contributeurs, et non à des webmasters.

L’interface de Gutenberg est bien équilibrée en ce sens et apporte une expérience utilisateur plus agréable pour la contribution.

Le bon niveau de performance

L’outil permet d’obtenir de bonnes notations sur les indicateurs de PageSpeed et Web Core Vitals.

Une accessibilité rendue possible

Chez Be API, nous considérons que tous les projets doivent être accessibles au plus grand nombre.

Conformité RGAA demandée ou non 🙂

Une maintenance apaisée

L’approche technologique de Gutenberg permet d’envisager sereinement le long terme.

Pour découvrir les fonctionnalités en détail, voici un site de démonstration, ainsi que les vidéos de présentation de l’agence.

Design system

Aujourd’hui, un projet web avec WordPress + Gutenberg, ce n’est plus “juste” de créer des templates comme autrefois.

La philosophie d’un outil comme Gutenberg tend vers l’atomic design, avec des blocs qui vont être utilisés dans des contextes et pour des contenus différents ; c’est pour cela que nous travaillons dans une logique de Design system.

Pour chaque projet, nous mettons en place un design system de blocs Gutenberg qui permet ensuite de composer des patterns et des pages. Ces blocs apportent une grande flexibilité à la composition des pages, en permettant d’ajouter (en mode glisser déposer), organiser et mettre en forme du contenu riche facilement.

UX Writing

Alors oui, c’est fabuleux de créer une boîte à outils, mais comment l’utiliser avec ses contenus, toute est la question. Inversement, sans réflexion sur les contenus réels, comment établir la bonne boîte à outils ?

C’est à ces questions que nous tentons de répondre lors de chacun de nos projets faits avec Gutenberg, et pour cela, nos équipes de concepteurs mènent un travail d’UX Writing, pour créer à partir de vos contenus définitifs la boîte à outils correspondante, et pour vous donner des recommandations d’organisation et mise en page de vos contenus.

Ce travail d’UX Writing est mené sur vos contenus clefs, mais il vous est possible de “commander” davantage de pages “UX Writing” durant toute la phase d’exploitation de votre projet.

Une agence WordPress organisée pour Gutenberg

Toute la méthodologie de l’agence est organisée autour de cet éditeur, et toutes les équipes sont formées à cet éditeur afin de proposer des projets le plus proche de l’état de l’art, et le plus respectueux du fonctionnement de Gutenberg.

Notre objectif est de vous proposer un projet pensé pour Gutenberg du début à la fin.


Et notamment la partie conception :

  • Des wireframes intégrant l’ensemble des concepts (blocs, patterns, templates)
  • Des maquettes graphiques compatibles avec les limitations de l’éditeur

Pour plus d’informations, vous pouvez vous référer à l’un de nos articles sur le sujet : Comment concevoir efficacement avec Gutenberg

Un projet-type

Un projet type avec Gutenberg est donc basé sur un Design system de blocs, et ces blocs peuvent être de différents types :

Blocs natifs stylisés

Gutenberg intègre des blocs natifs (70 blocs existants dont 36 pour l’intégration d’embed de services tiers).

Dans le cadre de nos projets nous utilisons le plus possible ces blocs natifs, que nous stylisons ensuite avec la charte graphique du projet

Blocs créés sur mesure

En plus de ces blocs natifs, en fonction des besoins, nous développons également des blocs sur-mesure soit via le framework ReactJS de Gutenberg, soit ponctuellement via le plugin ACF.

Patterns pour faciliter la contribution (syndrome de la page blanche)

Un Pattern est une Composition ou Ensemble de blocs, soit un groupe de blocs, qui ont été combinés ensemble, pour créer une mise en page (un modèle) réutilisable.

Chez Be API, nous créons des patterns personnalisés pour traduire les maquettes graphiques au plus proche de la philosophie Gutenberg.

Ces patterns réutilisables sont facilement disponibles pour nos clients.

Blocs tiers-party (pack ou plugin)

Une fois encore, la richesse de WordPress est de posséder un écosystème de plugins, et de blocs pléthoriques.

Nous utilisons principalement des blocs standalone et évitons les packs afin de faciliter la maintenance et garantir un haut niveau de performance.

Pourquoi nous ne recommandons pas Elementor vs Gutenberg

Argument 1

Elementor est un outil très puissant. Un outil trop puissant, destiné dans les faits à des webmasters ayant des connaissances de HTML/CSS.

C’est un outil qui donnera davantage de satisfaction au professionnel réalisant votre site WordPress, et peu à l’utilisateur final qui aura une autonomie de façade, n’ayant au final pas les savoirs-faires pour tirer parti de Elementor.

Argument 2

Dans un contexte d’usine à sites, ou même d’environnements multiples (production, préproduction, etc), nous considérons qu’Elementor sauvegarde trop d’éléments de mise en page dans la base de données.

De fait, dans un contexte d’usine à sites où il est par exemple possible de dupliquer un site modèle, cela distribue la maintenance WordPress dans autant de sites ce qui rend la maintenance beaucoup plus problématique.