Mais sans expérience, l’aventure n’est pas aussi facile qu’on le pense, et les mauvais choix se font inconsciemment. Alors heureusement, la communauté a construit de nombreuses extensions (plugins) qui brisent cette barrière avec le manque de connaissances. Elementor est un des acteurs qui fait le plus de bruit dans la communauté WordPress (et celui qui réalise le plus de marketing par la même occasion).
Il faut l’admettre, écrire un article avec une consonance négative n’est pas une partie de plaisir, mais il nous semble important de rétablir la vérité sur certains aspects qui peuvent être bloquants pour votre croissance.
Utiliser un builder pour construire un site web est un chemin parsemé d'embûches. Créatif, flexible et évolutif, c’est la promesse que l’on nous vend bien souvent. Mais que se cache-t-il derrière ces builders ?
Si vous avez déjà utilisé un builder, vous avez probablement comme nous utilisé plusieurs constructeurs de pages avant d’en trouver un qui vous convient. Et même celui retenu vous apporte rarement une entière satisfaction. Il y a de fortes chances d’avoir la sensation d’être limité, de ne pas arriver à vos fins ou de créer des erreurs critiques sans le savoir.
Elementor arrive à faire la différence, et a convaincu des millions d’utilisateurs. Si vous lisez cet article, vous l’utilisez sûrement au quotidien pour gérer un ou plusieurs sites. Mais, est-ce vraiment le bon choix ?
Alors, rentrons dans le vif du sujet, commençons par ce que vous obtenez en démarrant avec Elementor, et poursuivons par ce que vous ne savez probablement pas en utilisant Elementor.
Sur le papier, Elementor pour WordPress semble être une solution de taille pour construire un site, et lancer une activité digitale.
Comparable à d’autres éditeurs comme Wix ou encore Squarespace, l’expérience est semblable avec Elementor. Vous pouvez démarrer avec un thème déjà préconçu, ou avec une page blanche.
Vous pouvez brancher Elementor sur n’importe quel thème WordPress, magique non ? Vous obtenez un tout nouvel éditeur, plus intuitif que le natif de WordPress.
Vous éditez vos pages directement sur le front-end. Vous avez un aperçu en temps réel de l’évolution de votre page, et vous avez la main pour modifier le design de vos sections.
En effet, il existe d’autres builders qui vous apporteront les mêmes avantages que ceux cités dans la sous-partie précédente.
Mais vous n’aurez pas autant de possibilités avec le plan gratuit, autant de thèmes disponibles, ni accès au même support que la communauté Elementor a développé au fil des années.
Sans avoir besoin d’être un designer, il est facile d’approuver le travail que fait Elementor pour simplifier la possibilité de créer un site professionnel.
Vous aurez probablement le même site que des milliers d’autres. Avec vos couleurs et vos photos, il sera déjà un peu plus singulier et vous aurez gagné beaucoup de temps pour concevoir votre site, avec un budget très faible.
Si le choix d’un thème ne vous convient pas, vous pourrez utiliser les « blocks ». Ils correspondent à de simples sections que vous pouvez copier très facilement dans votre page.
Certains sont gratuits, d’autres sont payants. Le choix est assez vaste dans la partie offerte, mais vous serez vite limité si vous avez des besoins qui sortent d’un cadre « standard ».
Pour être efficace et éviter de reproduire des parties existantes dans le site, vous pouvez enregistrer des sections dans votre espace Elementor.
Vous pouvez notamment exporter vos templates et les utiliser sur d’autres sites WordPress qui utilisent Elementor. C’est une fonctionnalité intéressante lorsque vous gérez plusieurs sites, et que vous avez pris le temps de construire des sections uniques.
Oui, c’est vrai que l’éditeur vous donne la main sur tous les éléments présents sur une page. Vous pouvez éditer presque tous les détails qui composent votre page, que ce soit les blocs de contenu, les widgets, les images, les colonnes, les div, etc.
Dans l’éditeur avancé, vous pouvez être précis. Vous pouvez utiliser des pixels, des pourcentages (même si nous recommandons des rem), fixez des éléments sur la page, modifiez les espaces entre les colonnes, ajoutez des effets au survol, etc.
Bref, vous avez la main.
Utile et pratique, obtenez un rendu de vos pages sur le mobile, et la tablette. Depuis cet espace, vous pourrez modifier les mêmes éléments que la vue desktop, mais assignez des valeurs uniquement pour la taille d’un appareil.
Mais le responsive ne se fait pas tout seul, si vous partez d’une page blanche, vous devrez modifier tous les éléments sur chaque appareil afin d’être certain que tout s’affiche correctement à l’écran.
Nous vous recommandons d’utiliser des rem, et des pourcentages pour gagner du temps lors de l’adaptation sur le mobile. Les valeurs fixes en pixel risquent de vous donner des nausées lorsque vous aurez des dizaines de pages à gérer.
Parfois, deux ou trois retours en arrière ne suffisent pas pour rétablir les modifications « tentées » sur une section. Sans Elementor, c’est parfois un désastre puisque vous n’avez pas la possibilité d’annuler vos modifications.
Avec le panel « Historique », vous visualisez tous vos changements et vous avez la main pour restaurer l’intégralité de votre ancienne page (au risque d’autres changements qui étaient eux valides).
Une fois tous ces points énoncés, c’est plutôt tentant. Mais ces avantages ne sont que la partie visible de l’iceberg. Il est temps de vous lister presque tous les effets secondaires de ces fonctionnalités.
Aucun outil n’est parfait. Tous les outils que l’on utilise au quotidien ont des inconvénients et nécessitent parfois des ajustements par rapport à nos besoins. Alors, soyons honnêtes, et disons ce qu’il faut savoir sur ces builders, et plus précisément Elementor.
Lorsque vous utilisez un builder comme Elementor, vous ne pouvez pas modifier vos pages sans passer par leur éditeur. Lorsque vous construisez avec l’éditeur, vous êtes coincés dans cet espace, et vous n’avez pas la possibilité de revenir en arrière vers un autre builder. La seule solution est de tout refaire. La plupart des builders ne permettent pas non plus d’exporter le code, ce qui signifie qu’aucune correction n’est possible dans les fichiers HTML.
Perdre la possibilité d’accéder au code, revient à perdre la capacité à être réactif rapidement en cas de souci.
Lorsque l’on conçoit un site, la meilleure pratique consiste à rédiger un code cohérent, réutilisable, et efficient. Avec Elementor, vous obtenez tout l’inverse puisque le builder vous permet d’ajouter du style dans tous les sens sur tous les éléments et cela génère un nombre de classes incalculables.
Pour rappel, lorsque vous indiquez qu’un titre doit être plus gros, vous utilisez une classe. Si vous souhaitez mettre la sous-description dans une autre couleur, c’est une autre classe, et ainsi de suite.
Tous les changements que vous réalisez dans l’éditeur Elementor viendront alourdir votre code, et donc le poids de la page.
Si le branding est un sujet clé pour vous, vous foncez dans un mur avec Elementor, ou même un autre builder WordPress. Lorsque vous souhaitez modifier un élément sur tout votre site, cela est un cauchemar.
Vous pouvez réaliser des changements de manière illimitée sur chaque page, mais vous ne pourrez pas configurer un style global sans un plan payant. Encore une fois, vous sortez du plan gratuit pour contrer ce problème.
Récemment, nous avons migré un site conçu avec Elementor vers Webflow, le constat est affligeant.
{{table-compare-webflow-style="/cta"}}
Elementor n’est pas optimisé pour les moteurs de recherche. Il est plus difficile de se positionner dans les premières pages (SERP) avec ce builder. Elementor n’est pas conçu pour optimiser en général votre site WordPress. Vous devrez connecter d’autres outils SEO pour parvenir à vos fins.
Lorsque vous utilisez Elementor pour construire des pages, vous n’utilisez pas le potentiel maximal de WordPress pour le SEO. En effet, Elementor génère ses propres markup HTML, cela interfère directement avec les tags natifs de WordPress.
Sans le savoir, Elementor ajoutera massivement du code dans vos pages. Pour afficher un simple bloc de texte, Elementor va ajouter entre 6 et 10 div, alors que le strict nécessaire est une seule div. Cela a un impact direct sur le temps de chargement puisque votre code est plus lourd, donc moins performant.
Inutile de faire un rappel de l’impact du temps de chargement sur le SEO. Depuis la mise à jour des Core Web Vitals, Google favorise encore plus les sites qui sont ultra-rapides, et qui respectent ses critères.
Si le SEO est un vrai sujet pour vous, et un canal d’avenir pour votre activité, vous devriez rester loin de l’extension Elementor.
Il existe d’autres builders, et CMS qui apportent de bien meilleures performances pour le SEO. Notre grand favori, et celui que nous utilisons pour presque tous nos clients, est Webflow.
{{post-webflow-cms="/cta"}}
Il existe des modules dans Elementor qui ne sont pas optimisés pour le référencement naturel. Et sans une expertise précise dans ce domaine, il est tout à fait normal de passer à côté de cette information.
Mais pourquoi ?
Google utilise les DOM (Document Object Model) pour comprendre le contenu d’une page. C’est ce qui permet aux scripts d’examiner et d’interpréter ce qui est présent dans la page.
Et le souci vient du fait que Elementor affiche le DOM dans le code seulement après une interaction (clic sur une icône par exemple) sur certains modules. Comme cela n’est pas dans le code initialement, Google ne le trouve pas, et donc il n'indexe pas cette partie.
Imaginez un instant, vous utilisez un module comme le générateur de pop-up pour votre menu principal. Cela serait une très grosse erreur pour le SEO, puisque l’on sait que le menu principal et le footer ont un impact positif sur les pages, alors méfiez-vous des modules Elementor.
Un sujet encore plus discutable est que Elementor diffuse des tutoriels sur son blog ou son help center pour réaliser certaines actions avec les modules. À première vue, c’est bien. Mais en réalité, ils n’expliquent à aucun moment l’impact négatif sur le SEO de ces actions.
Ce qui est pour un(e) débutant(e) sur cette partie, impossible à vérifier. L’équipe devrait avertir ses utilisateurs de l’impact de certaines pratiques sur un site. Dans le cas contraire, c’est une faute grave de leur part.
Le souci avec certains builders comme Elementor ou bien Divi, est qu’ils n’ont pas été conçus pour être ultras performants.
La partie cachée de ces builders, c'est qu’ils ajoutent automatiquement tout un tas de code qui est inutile dans le code HTML. Les thèmes et les plugins le font déjà naturellement, ce qui veut dire qu’avec un builder comme Elementor, vous allez multiplier votre code par 5 ou 10 potentiellement.
Sans le savoir, quand vous utilisez Elementor, vous obtenez cela :
Et tout cela aura un impact considérable sur le temps de chargement et la qualité du code de vos pages.
Un petit rappel sur l’importance du temps de chargement :
Il faut savoir que tout n’est pas de la faute des builders, cela vient aussi des utilisateurs. Puisqu’ils ont la main pour ajouter de nombreux widgets, et peuvent effectuer des modifications sur presque tous les éléments.
Ils vont, sans le savoir, ajouter du contenu riche un peu partout, modifier le style à outrance parfois, et de ce fait, la page sera naturellement lente. Et cela sans compter l’oubli de recherche d’images optimisées et de vidéos allégées pour le web.
Le plus grave dans tout cela, c’est que même si vous êtes conscient de l’impact de vos actions, vous n’aurez pas la main pour corriger cela. Alors oui, vous pouvez ajouter du code HTML librement dans votre page, mais vous ne pouvez pas éditer celui qui est présent grâce à leur éditeur WYSIWYG.
La manière de comprendre cela est très simple, dès lors que vous ajoutez un élément dans votre page, vous ajoutez en temps normal quelques lignes de codes. Et chaque ligne supplémentaire aura un impact négatif sur le poids du code.
Elementor priorise l’interface pour l’édition en front-end, et ne donne pas la possibilité de nettoyer le code HTML. Alors malheureusement, pour ajouter un simple champ texte, vous allez parfois ajouter sans le savoir 10 div, alors que vous n’en avez besoin que d’une seule en réalité.
Si l’on prend une page entière qui contient une vidéo, des dizaines d’images, des animations, des titres, des textes et des éléments dynamiques, vous aurez des milliers de lignes de code, ce qui est très problématique.
Nous avons eu l’opportunité de migrer un site Elementor sur Webflow en 2022. Le constat est flagrant, voici les résultats.
{{table-compare-webflow-perf="/cta"}}
Le temps de chargement du site en question est passé de 8 secondes à moins d’une seconde, avec plus d’animation et le même design. Et cela avec un responsive plus cohérent entre chaque page par la même occasion.
Cela fait des années que Elementor est disponible sur le marché. Et rien n’a vraiment démontré au fil des années que l’extension allait prendre un tournant dans sa manière de fonctionner.
C’est même le contraire, au fil du temps, l’extension évolue et ils continuent sans cesse d’ajouter des fonctionnalités qui viennent alourdir le fonctionnement des sites. L’utilisateur lambda n’a pas besoin de ces fonctionnalités, et pourtant, elles se chargent quand même et alourdissent les pages.
En faisant des recherches sur Elementor, nous avons trouvé de nombreux sites qui prennent plus de 10 secondes à se charger intégralement. Ce souci concerne presque tous les sites conçus avec Elementor, si aucune optimisation n’a été faite.
C’est vrai qu’il existe des solutions pour optimiser le chargement d’un site WordPress conçu avec Elementor. Mais à quel prix ?
Cela dit, on peut tout de même vous donner des pistes d’améliorations à réaliser si vous êtes arrivé jusqu'ici pour cela :
On a volontairement fait au plus simple puisque ce n’est pas le sujet de cet article, mais qu’en pensez-vous ?
Une petite question, est-ce votre métier au quotidien de construire un site internet ? Si la réponse est non, ce n’est pas à vous de faire cela. Et vous n’avez aucun intérêt à apprendre tout cela à part perdre du temps, et de l’argent.
Ah oui, on a oublié de vous dire quelque chose. Une fois que vous aurez optimisé tous ces points, vous rencontrerez un autre problème : utiliser moins d’extensions sur WordPress pour conserver de bonnes performances.
C’est le serpent qui se mord la queue. Il faut installer des extensions pour optimiser les performances, mais quand vous installez des plugins, vous dégradez les performances. Malin.
Si vous utilisez WordPress pour gérer votre site, il est inutile de rappeler l’impact d’une mise à jour ni les risques que vous prenez chaque fois que vous cliquez sur les boutons pour monter d’une version.
Lorsque l’équipe qui maintient Elementor déploie de nouvelles versions avec des changements majeurs, ils générèrent sans le savoir des bugs qui ont un impact plus que néfaste sur les instances de leurs utilisateurs. Et malheureusement quand cela arrive, vous n’avez pas toujours le bon backup sous la main pour remettre votre site en état de marche rapidement.
C’est facilement lisible sur le web, la communauté félicite les nouveautés, mais elle critique vivement le manque de précaution par l’équipe qui gère Elementor.
Lorsque vous avez des millions d’installations actives comme c’est leur cas, il est obligatoire de tester tous les impacts possibles avant de déployer la version pour le grand public.
Alors oui, vous pouvez mettre en place un filet de sécurité pour éviter d’avoir des problèmes « critiques ». Voici, quelques bonnes pratiques :
Pour les deux premiers points, vous devez avoir suffisamment de compétences techniques pour effectuer ces tâches. Ce n’est rien de très complexe, mais si vous n’êtes pas à l’aise avec des accès FTP par exemple, vous risquez d’y perdre des cheveux.
Nous n’avons pas l’habitude d’utiliser Elementor au quotidien, donc nous ne pouvons pas en dire beaucoup plus à ce sujet. Mais, après avoir effectué quelques recherches, on constate rapidement que le support est parfois insuffisant.
Et ce point est à mettre en parenthèse puisqu’en effet, si vous déployez une mise à jour qui empêche le bon fonctionnement des sites, tous les utilisateurs concernés contacteront le support, et ils ne seront plus capables de gérer aussi rapidement les demandes entrantes.
Ils ont connu de nombreux problèmes dans le passé, et les commentaires sont souvent en lien avec ces mauvaises périodes. Il faut dire qu’avec plus de 5 millions d’installations, il faut être capable de mettre en place un support qui est plus qu’efficace pour maintenir tous les utilisateurs au même niveau de satisfaction.
Si le support est une option indéniable pour vous, il sera nécessaire de prendre un plan professionnel pour obtenir des retours plus rapidement.
Aussi rapide qu’il soit, l’éditeur n’est pas toujours aussi fiable qu’efficace. Elementor n’est pas le meilleur élève sur ce point, et vous n’aurez pas besoin de passer des heures dessus pour vous rendre compte qu’il bug par moment.
Si vous avez un souci, vous devrez probablement faire un rechargement forcé de votre page ou quitter l’éditeur pour revenir ensuite. Cela n’arrive pas tous les jours, mais le blocage peut être plus complexe qu'une simple commande + R.
On vous a compilé une petite liste des principaux problèmes que la communauté observe assez fréquemment :
Ce n’est pas le sujet de cet article, mais pour corriger chacun de ces soucis, vous avez plusieurs options possibles :
Pour un débutant qui démarre avec WordPress, la courbe d’apprentissage n'est pas si évidente que cela. Comme tous les outils que l’on commence à utiliser, il est important de prendre le temps de les maîtriser.
Le souci avec cette courbe d’apprentissage est qu’au-delà de mettre du temps pour comprendre comment bien utiliser l’extension, vous pouvez sans le savoir créer de nombreuses erreurs qui seront néfastes pour votre référencement naturel, la cohérence du site ou bien sa performance.
Pour éviter cela, vous pouvez regarder des tutoriels sur YouTube. Acheter une formation en ligne sur Elementor, ou bien engager un freelance pour vous aider à démarrer le projet. En espérant que cette même personne soit à l’aise pour le faire le plus proprement possible, autrement cela vous coûtera plus cher de tout refaire par la suite avec un professionnel expérimenté.
Bien que le nombre de builders disponibles soit considérable, 3 acteurs dominent ce marché sur WordPress : Elementor Builder, Beaver Builder et Divi Builder.
Il est vrai que ces builders sont les meilleurs du marché en matière de fonctionnalités, mais aucun n’est mieux l’un que l’autre par rapport à tous les problèmes évoqués précédemment. La seule différence entre ces éditeurs se fera principalement sur l’interface utilisateur, et sur le prix. Elementor est le plus compétitif, c’est probablement pour cette raison que c’est le plus utilisé aussi.
Si vous êtes à la recherche de performance, que le SEO est un sujet important pour vous, et que vous vous souciez de la gestion de votre site, ces builders ne vous apporteront pas une entière satisfaction.
Comme vous pouvez le constater, cet article met en avant de nombreux défauts et inconvénients concernant les sites qui utilisent Elementor.
Mais si Elementor a autant d'utilisateurs à travers le monde, c’est parce que les sites web n’ont pas tous les mêmes enjeux. En effet, lorsque l’objectif du site est d’être une jolie vitrine, simple pour présenter l’entreprise avec aucun réel enjeu de développement digital, alors Elementor est une solution adaptée pour toutes les raisons citées précédemment.
Cependant, si vous êtes concerné par la qualité technique de votre site, ainsi que le développement de votre entreprise via les canaux digitaux (SEO, Search Ads, Social Ads, etc.), vous devriez rester assez loin de ces builders qui ne vous feront que perdre du temps et de l’argent sur le long terme.
La réelle opportunité pour obtenir de la vélocité et de la performance se trouve dans des solutions plus personnalisées et sur mesure. Nous recommandons vivement que vous vous intéressiez aux sujets des Headless CMS, et de Webflow (notre favori, c’est le CMS que nous utilisons pour gérer le site de notre agence Angulaire).
Avec ces solutions, vous aurez face à vous des professionnels qui savent écrire un code proprement, avec des pratiques SEO conformes aux attentes des moteurs de recherche afin de développer une structure performance-first. Tout cela, en plaçant votre objectif business au premier plan.
Faites-vous une faveur, laissez vos concurrents faire cette erreur.
Chez Angulaire, nous vous proposons d'obtenir gratuitement le score technique de votre site internet. Vous aurez accès à de simples informations sur les performances de celui-ci, et suffisamment de précision pour juger de la qualité de son code.
Connaître le score de votre site est important pour plusieurs raisons. Il vous permet, entre autres, de comprendre quelles sont vos limites, d’obtenir les axes d’amélioration pour améliorer les performances de votre site web, mais aussi d’évaluer votre futur potentiel.
Comme vous pouvez l'imaginer, si l'on parle autant de performance, on se doit d'être un bon élève. Ainsi, le score technique de cette page est de 99 sur 100, un score de 99 sur 100 pour la qualité de son code, et un onload timing (chargement de toutes les ressources) qui est de 340 millisecondes.
Connaître le score de votre site est la première étape nécessaire pour évaluer la qualité globale de votre site en matière de performance, sécurité, de référencement naturel, mais aussi pour l’expérience utilisateur.
Cependant, ces informations ne vous suffiront pas pour prendre des décisions plus importantes sur le long terme. Il est parfois nécessaire de réaliser un audit SEO pour mieux comprendre votre environnement et ainsi agir en conséquence.
Il vous aidera à identifier les points forts et les points faibles de votre actuelle stratégie SEO. Vous obtiendrez ainsi des axes pour améliorer votre positionnement dans les résultats de recherche.
Au cours des années passées, nous avons plus de 250 audits, nous avons développé notre propre méthode pour comprendre et agir en fonction de vos ressources.
Vous l’aurez compris si vous avez lu cet article ou même plusieurs autres articles sur notre blog. Nous sommes de fervents défenseurs de Webflow puisqu’il s’agit du 1er CMS qui nous apporte autant de satisfaction depuis le début.
C’est devenu notre référence pour créer de petits sites, de plus importants sites, mais aussi pour des projets internes. Lorsque la techno se complique, nous le couplons avec du Next.js dans Vercel, et nous arrivons ainsi à faire des merveilles. Mais Webflow ne répond pas non plus à toutes les attentes, nous pourrons vous accompagner pour savoir si ce CMS est fait pour vous ou non.
Cependant, si vous cherchez à stimuler votre croissance, à faire du SEO pour gagner des positions dans Google, et de l’acquisition plus généralement, le CMS est fait pour vous. Avec ses fonctionnalités avancées, sa flexibilité, et sa facilité d'utilisation, il offre une solution complète qui permet d’être efficace et ultra-performant.
Si vous souhaitez en savoir plus sur les raisons d’utiliser Webflow, nous avons rédigé un article assez conséquent sur la thématique.