Faut-il choisir Elementor ou Gutenberg pour créer son site web WordPress ?
L’originalité et l’élégance sont deux éléments qui participent grandement au succès d’une plateforme web. Aujourd’hui, pour obtenir un site web WordPress personnalisé, original et élégant, il est difficile de passer à côté des éditeurs ou constructeurs de pages. Il s’agit d’outils pouvant vous permettre d’éditer facilement et visuellement les différentes pages de votre site Internet sans forcément avoir à entrer dans le code. Parmi les éditeurs de pages pour le CMS WordPress qui existent, il y en a deux en particulier qui se démarquent : Elementor et Gutenberg. Ils ont chacun leurs forces et leurs inconvénients. Beaucoup de développeurs, malgré leurs expériences, ont encore du mal à choisir le constructeur le plus adapté pour leurs projets de sites web. Nous avons minutieusement analysé les deux outils et vous présentons notre avis dans cet article.
Elementor et Gutenberg : présentation des deux éditeurs de pages
Le choix d’un constructeur de pages WordPress dépend de plusieurs paramètres. Mais avant de choisir, il convient de bien étudier chaque éditeur. Elementor et Gutenberg sont des outils qui peuvent vous servir à créer des pages web personnalisées en fonction des besoins et des effets recherchés.
Qu’est-ce que Gutenberg ?
Il y a quelques années, WordPress proposait par défaut un éditeur de site classique qui permettait de créer des articles et des pages simplement. Malgré la souplesse de cet éditeur classique, un autre constructeur lui a ravi la vedette et l’a d’ailleurs totalement remplacé. Il s’agit de Gutenberg, l’éditeur par défaut que WordPress propose aux développeurs aujourd’hui. Gutenberg a officiellement été introduit en 2018 et semble avoir des avantages qui ne sont pas présents dans l’éditeur WordPress classique. D’ailleurs, on reprochait à ce dernier de ne pas avoir de fonctionnalité de glisser-déposer. La principale caractéristique de Gutenberg est donc le drag-and-drop.
Auparavant, les développeurs qui ne souhaitaient pas utiliser le « classic editor » de WordPress étaient obligés d’installer des extensions de construction de pages :
– Visual Composer ;
– Divi ;
– Elementor ; etc.
Ces extensions étaient des solutions évidentes pour remplacer l’éditeur classique. Il était donc urgent pour les propriétaires de WordPress de proposer par défaut aux développeurs un éditeur de pages intégrant la fonctionnalité « glisser-déposer ». C’est ainsi qu’a été greffé au CMS le constructeur Gutenberg.
D’un point de vue fonctionnel, l’éditeur propose une riche bibliothèque composée de blocs d’éléments que vous pouvez glisser et déposer sur vos pages et articles. Gutenberg contient par défaut plus de 100 blocs de contenus. Les développeurs expérimentés peuvent créer des blocs dynamiques ou statiques et mettre à jour le contenu de l’éditeur. En outre, la plupart des thèmes WordPress fonctionnent parfaitement avec ce constructeur. C’est un outil qui peut suffire pour concevoir des sites web de qualité avec des designs saisissants.
Elementor : c’est quoi ?
Le constructeur de pages Elementor est l’un des plus utilisés par les développeurs WordPress aujourd’hui. Il s’agit d’un éditeur tiers de construction de pages introduit en 2016 qui a rapidement séduit de nombreux concepteurs WordPress. C’est un outil qui a une interface de conception exhaustive sur le plan visuel. Elementor met à la disposition des développeurs plusieurs modèles de pages élégants que l’on peut importer en fonction des usages. Par ailleurs, tous les modules de contenu du constructeur peuvent être glissés et déposés sur les pages. Cependant, Contrairement à Gutenberg, Elementor a bloqué l’accès à certains modules et à certains outils. Ces derniers ne peuvent être utilisés qu’après avoir acheté la licence de la version Pro d’Elementor.
L’un des principaux éléments qui font la différence entre Elementor et Gutenberg, c’est la nomenclature des contenus. Ce que l’on appelle « blocs » dans l’éditeur Gutenberg s’appelle « widgets » dans Elementor. De plus, le constructeur peut se vanter d’avoir plus d’une centaine de widgets de contenus :
– En-tête ;
– Article ;
– Image ;
– Vidéo ;
– Barre de progression ;
– Témoignage ; etc.
Il y a même des widgets pouvant vous permettre de créer des intégrations entre votre site WordPress et les logiciels tiers tels que Facebook, Stripe, Sound Cloud,… Vous pouvez également intégrer des widgets WooCommerce et de marketing, des formulaires ou encore des popup à vos pages. Elementor est vraisemblablement l’un des constructeurs les plus complets que vous pouvez trouver actuellement sur le marché. C’est donc à raison que beaucoup de concepteurs de sites WordPress le préfèrent à Gutenberg. Mais concrètement, qu’est-ce qui peut motiver les développeurs à choisir entre Elementor et Gutenberg ?
Que faut-il choisir entre Elementor et Gutenberg pour réaliser un site WordPress ?
Pour comparer les deux éditeurs de pages WordPress, nous allons tenir compte de plusieurs points :
– Fonctionnalités ;
– Performances et impact de l’éditeur sur la vitesse ;
– Interface d’utilisation ;
– Support client ;
– Comptabilité avec des plugins et des thèmes WordPress ; etc.
Elementor et Gutenberg : les fonctionnalités clés
Dans cette rubrique, nous vous présenterons ce que nous considérons comme les principales fonctionnalités d’un véritable éditeur de pages. Nous comparerons ensuite, en fonction de chaque fonctionnalité clé, les constructeurs Elementor et Gutenberg.
Codage et fonctionnalités de glisser-déposer avec Elementor et Gutenberg
Un constructeur de page WordPress moderne devrait fonctionner par glisser-déposer ou par cliquer-déposer. Mais le véritable problème avec la plupart des éditeurs de pages, c’est qu’ils remplissent l’interface utilisateur avec des outils de création visuelle. De ce fait, ils ne proposent pas des fonctionnalités plus avancées avec édition de code. Les développeurs professionnels préfèrent avoir la possibilité d’ajouter leurs propres codes pour personnaliser les pages qu’ils créent. Utiliser un constructeur de pages qui mélange les deux (édition visuelle et code) est donc un excellent compromis. Les débutants peuvent créer des pages web en utilisant uniquement l’interface en glisser-déposer. Quant aux utilisateurs avancés, ils peuvent, en plus de l’édition visuelle, modifier les codes CSS et HTML.
Gutenberg propose aux utilisateurs un système de glisser-déposer assez simple, intuitif et sans décalage. Pour rechercher un bloc avec ce constructeur, il suffit de saisir l’intitulé dans le champ de recherche et il apparaîtra. Vous pourrez alors le glisser (ou le cliquer) et le déposer (ou l’insérer) dans les contenus. Lorsqu’un bloc est intégré, l’éditer par défaut de WordPress propose des réglages pour le personnaliser. Pour faire déplacer ou glisser les blocs se trouvant déjà dans un contenu, vous devez d’abord les sélectionner et cliquer sur une icône de déplacement. Une précision lors du clic est indispensable. Dans d’autres constructeurs, Elementor notamment, cette démarche n’est pas nécessaire.
En outre, lorsqu’il s’agit de coder, Gutenberg rend son bloc d’édition de code facile à trouver. Cependant, beaucoup de développeurs ont remarqué qu’il y a des problèmes avec les blocs HTML qui rendent inefficaces leurs codes. En définitive, lorsque l’on considère le volet « codage et fonctionnalité glisser-déposer », entre Elementor et Gutenberg, il est difficile de choisir. Toutefois, Elementor peut s’avérer plus avantageux que le constructeur de pages par défaut de WordPress.
Les modèles des constructeurs de pages Elementor et Gutenberg
Les templates que les constructeurs de pages proposent ont pour but de permettre aux développeurs de construire rapidement des sites. En d’autres termes, les modèles vous permettront de construire vos plateformes web à partir d’un existant et non à partir de zéro. De nombreux éditeurs de pages proposent des templates préconstruits. Il y a des modèles préconçus de sites complets, de pages, de sections de pages, d’articles, de pieds de pages, d’entêtes, etc. Toutefois, le constructeur Gutenberg manque cruellement de modèles préconçus. Vous trouverez peut-être des modèles utiles de section dans l’onglet « Compositions » de Gutenberg. Mais c’est à peu près tout ce que vous y trouverez.
Le constructeur de pages Gutenberg ne propose donc pas nativement une grande variété de templates. Néanmoins, il existe des extensions tierces qui étendent les fonctionnalités de Gutenberg et qui comportent une multitude de modèles préconstruits. Il s’agit par exemple de :
– Twentig ;
– Gutentor ;
– Otter Blocks.
Quant à Elementor, il est alimenté par une myriade de modèles de départ. C’est d’ailleurs l’un des constructeurs qui proposent beaucoup de templates de qualité nativement. Cependant, la plupart des modèles que vous trouverez dans la bibliothèque d’Elementor sont payants. Si vous n’avez pas des besoins stylistiques particuliers, vous pouvez tout à fait vous contenter de l’un des templates gratuits disponibles. Mais pour des besoins avancés et thématiques, généralement, vous devrez acheter un modèle payant. Même si presque tous les templates que ce constructeur de page propose nécessitent un abonnement premium, entre Elementor et Gutenberg, on préférera le premier. En effet, l’offre d’Elementor en termes de templates est bien meilleure que celle de Gutenberg.
Les fonctions de style d’Elementor et Gutenberg
Dans le panneau de blocs situé à droite de l’interface utilisateur de Gutenberg, certaines fonctions de style sont disponibles. Il suffit de sélectionner le bloc que vous souhaitez modifier et les fonctions stylistiques apparaîtront. Par rapport à Elementor, Gutenberg propose aux développeurs des réglages de style assez basiques. Vous trouverez cependant tous les éléments essentiels. Par exemple, vous pourrez modifier les dimensions et les bordures des images. Vous pourrez aussi régler les couleurs des paragraphes, changer la typographiques des contenus textuels et ajouter une marge à vos blocs de contenus.
Les réglages de style dans le constructeur de pages WordPress Elementor sont contenus dans trois différents onglets. Lorsque vous sélectionnez un widget, vous pouvez soit ajuster les réglages dans l’onglet « Styles ». Dans cette partie, vous avez la possibilité de faire la plupart des modifications stylistiques. Néanmoins, Elementor vous propose aussi de passer aux zones avancées avec des filtres CSS, des masques, des animations de survol et même des effets de transformation.
Le logiciel Elementor dispose d’une plus grande base d’outils de styles que le constructeur Gutenberg. Mais il n’est pas toujours facile à prendre en main. Alors, pour ceux qui souhaitent se sentir à l’aise avec les fonctionnalités de style, Gutenberg est l’éditeur de page le plus indiqué.
Widgets ou blocs de contenus : Elementor et Gutenberg
On retrouve un peu plus de 90 blocs de contenu dans le constructeur de pages Gutenberg. En revanche, Elementor, de son côté, en propose plus de 100. Il y a donc une énorme différence entre Elementor et Gutenberg en termes de quantité de blocs ou de widgets. Avec Gutenberg, vous disposerez de tous les éléments importants tels que les blocs d’images, de paragraphes et de boutons. Vous aurez aussi droit à des éléments uniques comme la « Boucle de requête », « Speaker Deck », « Temps de lecture », etc.
Elementor semble plus organisé que Gutenberg. Il classe en effet ses widgets de contenus par catégories. Ainsi, vous pouvez par exemple trouver des catégories suivantes :
– Basique ;
– Général ;
– Pro ;
– Site ;
– WordPress ;
– WooCommerce.
Même si certaines catégories peuvent ne pas contenir des widgets utiles, au moins elles sont organisées. Vous trouverez donc facilement un widget dont vous avez besoin.
Intégration d’un support WooCommerce
La possibilité d’intégrer des blocs ou des widgets WooCommerce est un facteur essentiel pour comparer Elementor et Gutenberg. En effet, avec les widgets ou blocs WooCommerce, vous pouvez transformer n’importe quel site WordPress en véritable boutique e-commerce. Une fois que vous installez l’extension sur votre site, Gutenberg fait apparaître une pléiade de blocs pour vous permettre de concevoir facilement votre boutique en ligne. Il y a des blocs de produits, des blocs de recherche de produits, des blocs de panier d’achat, des blocs de filtres de produits, etc. Nous avons globalement dénombré 26 blocs Gutenberg relatifs à WooCommerce.
Elementor aussi fonctionne bien avec WooCommerce. Mais, à la différence de Gutenberg, le support WooCommerce a un prix sur Elementor. Un abonnement à la version Pro du constructeur de pages s’avère indispensable pour débloquer les widgets ainsi que les templates WooCommerce. Mais Elementor Pro est assez abordable et vous pouvez utiliser les outils de style pour personnaliser votre boutique. Encore une fois, le support WooCommerce d’Elementor est, à notre sens, meilleur que celui de Gutenberg. Il est plus flexible et plus puissant. Il propose même des widgets originaux de « vente croisée« .
Les autres éléments de comparaison
L’interface utilisateur de Gutenberg est assez facile à prendre en main. Vous n’avez pas besoin d’installer une extension tierce pour pouvoir l’utiliser, car il est intégré automatiquement dans le tableau de bord de WordPress. La rapidité avec laquelle vous pouvez créer des pages avec Gutenberg est l’une des principales choses que vous apprécierez. Elementor est aussi relativement facile à prendre en main. Son interface utilisateur ne s’affiche pas automatiquement lorsque vous voulez créer ou modifier une page. Si vous avez installé le plugin, vous devez en effet cliquer sur le bouton « Modifier avec Elementor » pour que l’interface du constructeur apparaisse. Globalement, l’interface de Gutenberg semble plus facile à maîtriser. Mais Elementor est plus fluide, plus amusant et plus puissant.
Par ailleurs, en termes de performances et de vitesse, Gutenberg est plus avantageux pour un site WordPress. Toutefois, en utilisant des outils appropriés d’optimisation et un hébergeur rapide, vous ne remarquerez aucune différence entre un site qui utilise Gutenberg et un site qui utilise Elementor.
Pour finir, le support client d’Elementor est d’emblée plus réactif que celui de Gutenberg. En outre, de nombreux thèmes et plugins sont compatibles à Elementor aujourd’hui. Désormais, avant de choisir entre Elementor et Gutenberg pour votre site, définissez d’abord tous vos besoins et vos objectifs. Et vous, lequel de ces deux constructeurs de pages utilisez-vous pour vos sites web ?
