Qu’est-ce que le Mobile-First ?
Le mobile-first est une stratégie de conception web qui consiste à créer d’abord la version mobile d’un site, avant d’adapter celle-ci aux écrans plus grands comme les tablettes et les ordinateurs.
Cette approche est l’inverse de la méthode traditionnelle (appelée desktop-first), où l’on conçoit pour les ordinateurs, puis on réduit ou cache des éléments pour les mobiles.
Pourquoi adopter une approche mobile-first ?
- Meilleure performance mobile : Les sites sont plus rapides et légers sur mobile. Pourquoi ? Tout simplement car le code CSS est lu d’abord pour les mobiles. Il y a moins de lignes à parcourir.
- Expérience utilisateur optimisée : L’interface est pensée en priorité pour les petits écrans. Évidemment, ce point est toujours soumis au secteur du site web et à ses visiteurs.
- SEO amélioré : Google utilise l’indexation mobile-first, ce qui signifie qu’il analyse d’abord la version mobile de votre site.
- Accessibilité accrue : Un design simple et épuré est souvent plus inclusif.
Exemples HTML et CSS : Une approche mobile-first
Voici un exemple simple de code mobile-first en HTML et CSS. L’idée est de commencer par des styles adaptés au mobile, puis d’utiliser des media queries pour adapter l’affichage sur des écrans plus larges.
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Exemple Mobile-First</title>
<style>
body {
font-family: Arial, sans-serif;
padding: 20px;
background-color: #f9f9f9;
}
.container {
display: flex;
flex-direction: column;
gap: 10px;
}
.box {
background: #0073e6;
color: white;
padding: 20px;
text-align: center;
border-radius: 5px;
}
/* Desktop (à partir de 768px) */
@media (min-width: 768px) {
.container {
flex-direction: row;
}
.box {
flex: 1;
}
}
</style>
</head>
<body>
<div class="container">
<div class="box">Bloc 1</div>
<div class="box">Bloc 2</div>
<div class="box">Bloc 3</div>
</div>
</body>
</html>
Analyse du code mobile-first :
- Par défaut, les blocs sont empilés verticalement (idéal pour le mobile) : Flex-direction : column.
- Sur les écrans plus larges (min-width: 768px), ils s’affichent côte à côte en ligne. On passe sur un flex-direction : row
- C’est une structure mobile-first car les styles de base s’appliquent au mobile, et les adaptations viennent après.
Ce bout de code très sommaire représente donc bien l’idée du « mobile-first ». Ici, cela représente quelques lignes seulement. Mais sur un design complet, cela représente bien plus de lignes optimisées.
Mobile-First avec Elementor, Bricks et Divi : Est-ce possible ?
Oui…. et non ! Par défaut, les constructeurs sont plutot desktop-first. S’il est possible de modifier les paramètres pour passer en mobile-first, en réalité, on est plus sur du responsive que du véritable mobile-first.
Mobile-first avec Elementor
Mobile-first ? Partiellement.
- Elementor applique une logique desktop-first, mais permet une personnalisation par appareil (mobile, tablette, desktop).
- Chaque élément peut être ajusté selon la taille de l’écran (taille de texte, marge, padding, disposition, etc.).
- Astuce SEO mobile-first : commencez par désactiver les éléments inutiles sur desktop, et configurez le contenu prioritairement sur mobile.
Exemple :
Dans Elementor :
- Créez une section > Activez la vue mobile > Concevez la mise en page.
- Ensuite, adaptez-la à la vue tablette et desktop avec les contrôles responsives.
Mobile-first avec Bricks Builder
Mobile-first ? Oui, presque natif.
- Bricks suit une logique mobile-first dans sa gestion des CSS.
- Les styles sont d’abord définis pour le mobile, puis étendus aux écrans plus larges avec des breakpoints personnalisables.
- Vous pouvez également écrire vos propres media queries dans le panneau CSS de Bricks.
Exemple :
- Créez vos composants en mode mobile.
- Utilisez les breakpoints dans l’ordre croissant (mobile → tablette → desktop).
Mobile-first avec Divi
Mobile-first ? Desktop-first par défaut, mais personnalisable.
- Divi est historiquement un constructeur desktop-first, mais il offre des options par appareil.
- Dans chaque module, vous pouvez cliquer sur l’icône responsive pour définir des valeurs différentes selon le type d’écran.
Exemple :
- Concevez la version mobile en premier, puis ajustez pour les autres vues en utilisant les contrôles conditionnels.
Bonnes pratiques pour une stratégie mobile-first
- Commencez par l’essentiel : Le contenu mobile doit être clair, lisible et rapide à charger.
- Optimisez les images : Utilisez des formats modernes (WebP) et des tailles adaptées au mobile. Retrouvez notre article sur l’optimisation des images sur WordPress.
- Testez sur de vrais appareils : Les émulateurs ne reflètent pas toujours la réalité.
- Utilisez des unités flexibles : Préférez les
em,%ouvw/vhauxpx. - Priorisez la vitesse : Google favorise les sites mobiles rapides.
Conclusion
Adopter une approche mobile-first n’est pas seulement une tendance, c’est une nécessité dans un monde où le mobile est devenu le principal canal d’accès au web. Que vous soyez développeur ou utilisateur de constructeurs comme Elementor, Bricks ou Divi, cette philosophie peut être appliquée efficacement.
Commencez par penser aux besoins de vos visiteurs sur mobile, puis adaptez pour le reste. C’est à la fois une bonne stratégie UX, SEO et business.
Bonus SEO : Pour renforcer votre stratégie mobile-first, combinez-la avec :
- un thème léger,
- une optimisation de la base de données
- un bon plugin de cache,
- une gestion des polices optimisée,
- des audits réguliers via Google PageSpeed Insights.
Les DNS, c’est quoi ?
DNS = Domain Name System. Ce sont les « entrées » d’un nom de domaine qui vont définir principalement :
- l’adresse du ou des sites internet (type A)
- les mails (type MX)
- des informations complémentaires comme les fameux champs SPF ou DKIM
- etc.
Ces « entrées » vont permettre de relier le nom de domaine à des informations. Ils servent un peu de « panneau d’indications ». Il est quand meme plus facile de taper dans son navigateur une url d’un site web ou d’envoyer un mail à [email protected] plutot que de taper des adresses IP avec des destinations spécifiques. Mais évidemment, ces informations, il faut bien les stocker quelque part. Et voila la vocation des entrées DNS !
Ensuite chaque entrée se compose 3 champs :
- host : ca peut être le domaine (on met souvent @ à la place) ou un sous-domaine. Par exemple www.esperluat.com est un sous-domaine du nom de domaine esperluat.com
- TTL : Time To Live : c’est le temps en secondes de « vie » d’une entrée. C’est à dire que tout changement sera pas pris en compte avant XX secondes
- valeur : la valeur associée
Comme ça, ca parait « relativement » simple. Et en fait ça l’est une fois que l’on sait comment cela fonctionne !
Ces informations sont évidemment publiques pour que toute personne en tapant un nom de domaine ou en envoyant un mail puisse avoir les bonnes informations en retour.
DNS : entrée de type A : une IP (v4 ou v6)
L’entrée A est faite pour « connecter » un nom de domaine vers une IP (ipv4 ou ipv6 mais là n’est pas le sujet). Elle permet de faire « pointer » un nom vers l’IP du serveur. Par exemple :
esperluat.com. 1508 IN A 147.135.223.165
- Il s’agit bien d’une entrée de type « A »
- le host : c’est esperluat.com
- le ttl : 0
- la valeur : 147.135.223.165
Traduction : le nom de domaine esperluat.com (la valeur) « pointe vers l’IP » (entrée de type A) 147.135.223.165
Dans notre cas, il s’agit du site web qui est sur l’IP 147.135.223.165. Mais on peut par exemple créer un serveur FTP pour entreposer des fichiers, et le mettre sur un autre serveur. Dans ce cas, on pourrait créer un sous-domaine en ftp.esperluat.com et le faire « pointer » vers une autre IP si le serveur n’est pas le même que celui du site web. C’est pour ça qu’historiquement le www est un sous-domaine pour indiquer que c’est le site web mais cela n’a rien d’obligatoire. On peut par exemple créer des sous-domaines différents pour chaque service et les faire « pointer » vers des IPs différentes :
- www.esperluat.com –> site internet avec l’ip XX.XX.XX
- mail.esperluat.com –> serveur mail avec l’IP XX XX XX
- ftp.esperluat.com –> serveur de fichiers avec l’IP XX.XX.XX
- etc
Chaque sous domaine est associé à une IP pour des services bien distincts (même si évidemment, on peut aussi avoir les mails ET le site web sur un seul et même serveur).
DNS : entrées CNAME pour créer des « alias » (à ne pas confondre avec une redirection)
Les cname permettre de créer des alias. C’est pratique pour éviter de créer plusieurs sous-domaines vers la même IP par exemple. Si on change de serveur, cela évite de modifier toutes les entrées. Par exemple :
Traduction : le sous-domaine www.esperluat.com est un « alias » de esperluat.com. Il va « pointer » sur la même IP. Si je change l’IP du domaine esperluat.com, le www. suivra automatiquement.
Attention, cela ne signifie pas que le www.esperluat.com redirige vers esperluat.com. Cela signifie que les deux ont la même résolution d’IP. Les contenus seront donc identiques si je vais sur l’un ou sur l’autre.
Rediriger esperluat.com vers www.esperluat.com pour éviter le « duplicate content » s’opère au niveau du serveur, pas au niveau du nom de domaine.
DNS : entrée MX pour les emails
Les entrées de type MX permettent de définir quel « serveur » doit traiter les emails. Que votre boite mail soit gérée sur les services g-suite, microsoft ou tout autre fournisseur, il faut bien indiquer quel serveur mail est en charge. C’est donc le travail des entrées de type MX. On peut mettre plusieurs serveurs MX pour utiliser des serveurs de secours. On parle alors de « priorité » entre les serveurs.
esperluat.com. 3600 IN MX 1 mail.esperluat.com.
Traduction : les mails du nom de domaine esperluat.com sont gérés par le serveur mail sur mail.esperluat.com. le 1 signifie qu’il est en priorité 1 (mais en même temps, il n’y a pas d’autre, donc on aurait pu mettre 10, cela n’aurait rien changé)
Vous voyez que dans ce cas, on a un sous-domaine qui est défini pour les emails. Mais on aurait pu avoir une cible du type « aspmx.l.google.com. » qui aurait indiqué que les mails sont gérés par Google Suite.
DNS : entrées TXT pour ajouter du « texte »
Comme son nom l’indique, l’entrée TXT permet d’ajouter du « texte ». À quoi les entrées TXT peuvent-elles bien servir ? Et bien à ajouter des informations destinées à soumettre des validations, principalement.
Par exemple, pour ajouter un domaine dans la search console de Google, il peut générer un contenu aléatoire, et demander de l’ajouter en entrée TXT. Cela permet de valider que l’on est bien le propriétaire du nom de domaine. C’est un exemple parmi tant d’autres, mais il permet aussi de mettre des informations comme les SPF ou les DKIM.
Les entrées spécifiques : les SPF (sender Policy Framework)
Cette entrée est très importante pour la bonne réception des mails. Quand ils n’arrivent pas à destination, dans 99% des cas, c’est parce que votre SPF n’est pas ou mal renseigné ! Gmail refuse depuis environ 2 ans tout mail qui n’est pas authentifié correctement avec le SPF. En gros, le SPF donne l’information de « qui » peut envoyer des mails depuis votre nom de domaine.
Traduction : pour le domaine esperluat.com, sont autorisés à envoyer des mails :
- a : l’IP du nom de domaine (en principe, le site web qui est sur le nom de domaine principale + le www)
- mx : le serveur mail (c’est préférable :) )
- ptr : tous les sous domaines de esperluat.com
On peut avoir d’autre informations telles que des IPs (si vous envoyer des mails depuis des serveurs d’application spécifiques ou des mx supplémentaire. Par exemple, si votre site est configuré pour utiliser BREVO pour envoyer des mails, BREVO va vous demander de modifier les SPF de votre nom de domaine pour autoriser la plateforme à envoyer des mails en votre nom.
- le ~all signifie au destinataire que si la règle ne passe pas, il doit augmenter le score de SPAM alors que -all signifie au destinataire qu’il doit refuser le mail. Il est donc un peu moins agressif.
Encore une fois, l’entrée SPF est la plus importante pour bien s’assurer que les mails sont légitimes. En suivant bien l’entrée DKIM, qui elle est une clef et vient en complément.
Les entrées specifiques : les DKIM (DomainKeys Identified Mail)
On peut les créer soit via les entrées TXT, soit via le type d’entrée DKIM, le résultat est le même. Qu’est-ce que le DKIM et à quoi ca sert ? C’est une clef publique qui va de pair avec une clef privée, et qui sert à certifier que le mail a été émis par le bon serveur.
En gros, le fonctionnement : le serveur qui émet le mail « cache » dans le mail une clef (suite de caractères) correspondante avec la clef que l’on configure dans nos DNS. Il y a donc 2 parties : une dans le mail et l’autre dans les informations DNS. Le destinataire vérifie la concordance des 2. Pourquoi ? pour s’assurer que le mail est authentique ! Je peux par exemple envoyer un mail depuis [email protected] mais si mon mail n’a pas la bonne clef, le destinataire va évidemment reconnaitre que je ne suis pas un emetteur certifié de toto.com.
On peut avoir plusieurs clefs DKIM pour un nom de domaine : si le serveur web et le serveur mail certifient les envois de mail avec une clef DKIM, on peut utiliser les sous-domaines pour les distinguer puisque ce sont 2 serveurs différents.
Traduction : le site internet envoie des mails certifiés avec une clef correspondante à la clef publique MIGf……. que l’on retrouve dans l’enregistrement du sous domaine default._domainkey.esperluat.com.
Si vous choisissez de passer par une plateforme d’envoi de mail, elle va vous demander de configurer les DKIM pour certifier que les mails qui passent par leur plateforme sont bien légitimes. Maintenant, vous savez ce que c’est !
Conclusion
Les DNS sont des informations à ne pas négliger lorsque vous avez une présence en ligne. Si vous avez un woocommerce ou toute autre boutique en ligne, alors il est indispensable de configurer correctement vos SPF et DKIM pour vous assurer une bonne déliverabilité de vos e-mails.
Pensez également à vérifier vos noms de domaines avec et sans www, on voit encore beaucoup de site dont les deux ne sont pas bien configurés.
En vrac quelques outils :
- https://www.mail-tester.com/ : permet de tester si vos mails sont correctement configurés
- https://mxtoolbox.com/SuperTool.aspx : le couteau suisse des vérifications des entrées de nom de domaine
- https://www.geolocation.com/fr/index : pas en rapport direct avec les DNS mais permet de savoir d’ou vient une IP
Dans cet article, nous vous donnons 10 raisons majeures d’utiliser WordPress en 2025, que vous souhaitiez créer un site personnel ou propulser une entreprise en ligne.
1. WordPress est le moteur nº1 des sites internet
WordPress a bâti sa réputation sur son accessibilité. En tant que plateforme open-source, il est entièrement gratuit à télécharger, utiliser et modifier. Ce modèle permet à des millions d’utilisateurs à travers le monde de créer des sites sans débourser un centime.
En 2025, cet avantage est plus pertinent que jamais, surtout dans un contexte où les budgets sont parfois restreints. Contrairement à d’autres solutions coûteuses, WordPress offre une base solide sans frais initiaux, tout en donnant accès à des milliers de ressources gratuites comme des thèmes et des plugins.
2. Une flexibilité sans limites
Avec WordPress, vous pouvez créer n’importe quel type de site web :
- Un blog personnel, pour partager vos idées et passions.
- Un site d’entreprise, pour présenter vos services et attirer des clients.
- Une boutique en ligne, grâce au plugin WooCommerce.
- Un site d’apprentissage en ligne (LMS), parfait pour vendre des formations.
- Un portfolio créatif, pour les artistes, photographes ou designers.
En 2025, WordPress s’adapte encore mieux à vos besoins grâce à des thèmes ultra-flexibles et des extensions qui permettent de personnaliser chaque aspect de votre site. De nombreux constructeurs permettent aujourd’hui de construire un site entièrement sans passer par des thèmes pré établis. WordPress le permet également depuis les dernieres version, mais il faut bien avouer que cela n’est pas encore très intuitif.
3. Créer sa boutique en ligne avec Woocommerce
Avec le plugin WooCommerce, WordPress est devenu un leader dans le domaine du commerce en ligne. WooCommerce permet de créer une boutique en ligne entièrement personnalisable, avec des fonctionnalités avancées :
- Gestion des produits, des stocks et des commandes.
- Intégration de multiples passerelles de paiement (PayPal, Stripe, etc.).
- Calcul automatique des frais de livraison et taxes.
- Ajout de fonctionnalités via des extensions WooCommerce (abonnements, marketplaces, etc.).
En 2025, WooCommerce reste l’une des solutions e-commerce les plus puissantes et économiques. Par exemple, nous avons réalisé une marketplace complète basée sur Woocommerce. Nous avons ensuite développé sur-mesure de nombreux modules pour la cliente.
4. WordPress : une compatibilité optimale avec le SEO moderne
Le référencement naturel (SEO) est essentiel pour assurer la visibilité d’un site web. WordPress a toujours été conçu pour respecter les bonnes pratiques SEO. En 2025, les outils WordPress sont encore plus performants pour :
- Optimiser les balises meta et les URL.
- Créer un sitemap XML.
- Améliorer la vitesse de chargement des pages (critère clé pour le SEO).
- Adapter votre site aux exigences du mobile-first indexing de Google.
Avec des plugins comme Yoast SEO ou Rank Math, WordPress reste l’une des meilleures plateformes pour se positionner en haut des résultats des moteurs de recherche.
5. Optimiser son site avec WordPress
Si une bonne optimisation SEO se fait à 80% via son contenu, elle se fait également via la construction du site. Nous avions fait des articles à ce sujet sur les images et la base de données. WordPress permet via de nombreuses extensions des optimisations bien plus poussées que sur d’autres constructeurs de site internet.
WordPress permet également de structurer facilement ses pages avec les balises Hn, les balises titres ou encore alt des images.
6. Créer son site avec WordPress à coût limité
Créer un site WordPress est une solution économique pour tous les budgets. Vous pouvez démarrer avec :
- Un thème gratuit ou premium (entre 30 et 100 €).
- Un hébergement partagé abordable (à partir de 5 €/mois).
- Des plugins gratuits pour ajouter des fonctionnalités essentielles.
Pour les entreprises qui souhaitent évoluer, WordPress offre des options avancées (thèmes sur mesure, plugins premium, serveurs dédiés). Cela permet d’accompagner la croissance de votre activité sans devoir tout reconstruire.
Sans rentrer dans les détails, là ou une extension prestashop coute entre 100 et 150€, une extension Woocommerce sera entre 50 et 100€. Si on compare un abonnement Wix et la construction d’un site WordPress, là encore, un abonnement Wix coutera bien plus cher et bien plus rapidemment qu’un site WordPress.
7. Votre site WordPress vous appartient !
L’un des grands avantages de WordPress par rapport aux solutions en ligne comme Wix ou Shopify est que vous êtes le propriétaire à 100% de votre site web et de son contenu. Avec WordPress, le site est hébergé sur le serveur de votre choix, ce qui signifie que vous avez un contrôle total sur vos fichiers, votre base de données et vos données utilisateurs. Contrairement aux plateformes « tout-en-un », où vous êtes souvent soumis aux conditions d’utilisation de la plateforme (et pouvez perdre l’accès à votre site si vous ne respectez pas leurs règles), WordPress vous offre une liberté totale. En cas de changement d’hébergeur ou de besoin de migration, vous pouvez emporter votre site avec vous sans aucune restriction. Cette indépendance fait de WordPress un choix stratégique pour les utilisateurs qui souhaitent construire un actif numérique pérenne et ne pas dépendre d’une plateforme tierce.
Nous avions fait un article plus poussé à ce sujet sur la propriété d’un site WordPress
8. Une communauté active et innovante
L’une des forces de WordPress réside dans sa communauté mondiale. Développeurs, designers, blogueurs, et amateurs contribuent à l’évolution constante de la plateforme en créant des thèmes, des plugins ou des tutoriels.
En 2025, cette communauté est toujours aussi active. Vous pouvez facilement trouver de l’aide via :
- Des forums de support.
- Des événements comme les WordCamps.
- Des groupes locaux ou en ligne pour échanger avec d’autres utilisateurs.
Cette dynamique garantit que WordPress reste à jour avec les dernières tendances et innovations technologiques.
9. Une sécurité renforcée pour protéger vos sites WordPress
La sécurité est une préoccupation majeure pour les sites internet modernes. WordPress, bien qu’open-source, propose en 2025 des mises à jour régulières pour combler les failles et protéger votre site contre les cyberattaques.
De plus, vous pouvez renforcer cette sécurité grâce à des plugins comme Wordfence, Sucuri, ou encore Solid Security. En suivant quelques bonnes pratiques (mises à jour régulières, utilisation de mots de passe forts, etc.), votre site sera parfaitement sécurisé.
10. Une préparation pour l’avenir grâce à Gutenberg et l’IA
Le nouvel éditeur Gutenberg, introduit en 2018, a transformé la façon de créer du contenu sur WordPress. En 2025, cet éditeur a encore évolué, offrant une expérience de création encore plus intuitive grâce à des blocs de contenu personnalisables.
De plus, WordPress intègre de plus en plus de fonctionnalités basées sur l’intelligence artificielle, comme :
- Des assistants pour la rédaction et l’optimisation SEO.
- Des outils d’analyse pour mieux comprendre votre audience.
- Des suggestions automatiques de design ou de contenu.
Ces innovations garantissent que WordPress reste une plateforme tournée vers l’avenir.
Conclusion : Pourquoi WordPress reste incontournable en 2025
WordPress a su s’imposer comme la solution de référence pour la création de sites web grâce à sa flexibilité, sa communauté et ses performances. En 2025, il reste une plateforme incontournable pour les particuliers, les entrepreneurs et les grandes entreprises.
Que vous souhaitiez créer un blog, une boutique en ligne ou un site professionnel, WordPress est le choix idéal pour répondre aux besoins numériques d’aujourd’hui… et de demain.
Prêt à vous lancer ? Faites de WordPress la base de votre succès en ligne !
]]>Partie 1 : les fichiers de WordPress
C’est la première partie de notre site internet : ses fichiers. Par défaut la structure de WordPress est comme suit :
Lorsque l’on « arrive » sur le site web, c’est le fichier « index.php » qui est appelé en premier. Ensuite, lui-même va « appeler » d’autres fichiers et récupérer les informations à afficher sur le site depuis la base de données. Pour résumer, les fichiers « php » sont du code « exécuté » pour afficher le site, les fichiers « css » sont les styles (couleurs, polices etc) et les fichiers « js » sont des fonctions ajoutant des « effets ».
En fin de compte, tous ces fichiers WordPress sont exactement comme des documents word ou excel sur votre ordinateur. On peut les copier, déplacer, renommer comme bon nous semble. Ceci dit, je vous déconseille de renommer des fichiers WordPress, sous peine de mettre votre site en PLS. La seule occasion de le faire serait pour désactiver un plugin récalcitrant. Mais ça, c’est pour un autre sujet.
Mais vous allez me dire : « ok mais ces fichiers, où sont-ils ? ». Et bien ils sont sur votre hébergeur, ou injustement bien souvent appelé « le FTP ». Vous y avez accés et vous pouvez les récupérer.
Partie 2 : la base de données WordPress
Là, c’est plus délicat. La base de données contient toutes les informations de votre site WordPress :
- son nom
- son slogan
- ses images
- ses pages, textes
- etc
Si les fichiers sont l’ossature, la base de données sont les muscles. Les fichiers seuls ne servent à rien et la base de données seule non plus. Il faut aussi éviter de mettre les mains dedans sans savoir ce que l’on modifie sous peine de là encore, mettre en PLS votre WordPress.
Une base de données, c’est comme un gros classeur excel. Il y a des tables, des colonnes et des lignes. Et là encore vous y avez accès via le « phpmyadmin » pour la gérer.
Mais vous pouvez également exporter votre base de données pour la conserver dans un fichier ! Vous commencez à comprendre le principe…
Comment sauvegarder et/ou migrer son site WordPress
Si vous avez lu les deux paragraphes précédents, je vous ai dit qu’au final, vous pouvez récupérer les fichiers WordPress et la base de données. Donc avec ça on peut faire quoi ?
- Vous pouvez sauvegarder votre WordPress. Pourquoi ? Pour avoir une copie de secours en cas de hack est en général la bonne réponse. Mais vous pouvez aussi garder des copies en cas de mise à jour qui aurait fait tout planter.
- Vous pouvez changer d’hébergeur. Votre prestataire ou hébergeur ne vous convient pas ? Copiez et changez de place votre site.
Et comment faire :
- les fichiers : on se connecte à l’hébergeur via FTP et on copie les fichiers
- la base de données : on se connecte au phpmyadmin et on télécharge le fichier de la base de données.
- option alternative : on utilise un plugin comme duplicator, updraft ou n’importe lequel des plugins de sauvegarde WordPress.
- Si on veut migrer le site, il suffit de remettre les fichiers sur le nouveau FTP et de ré importer la base de données dans le nouvel espace.
Prestashop, magento, Wix, Shopify ? propriétaire ou non ?
Avec WordPress, vous êtes donc bien propriétaire de votre site internet. Vous l’hébergez où vous le souhaitez, vous pouvez le déplacer, le modifier et même le casser ! Mais alors y-a-t-il des systèmes similaires, ou à l’inverse, pour lesquels vous n’êtes pas propriétaire ? La question est purement rhétorique et la réponse n’est pas exhaustive.
Les sites « dont vous êtes le propriétaire »
Comme WordPress, on peut citer Prestashop, Joomla, ou encore Drupal. Il y a des fichiers, et une base de données. Les licences sont « open-source » c’est à dire que tout le monde y a accès. C’est d’ailleurs là où le bât blesse. Le code de WordPress est observé à la loupe et des failles sont régulièrement découvertes et exploitées. D’où l’importance de mettre à jour régulièrement votre site WordPress.
Le gros avantage est que vous modifiez le code selon vos besoins. Vous pouvez optimiser le contenus et construire votre site entièrement sur-mesure. Vous pouvez également le mettre sur un hébergement optimisé qui supportera de gros volumes de visite.
Les sites « dont vous n’êtes pas propriétaire »
Wix et shopify sont deux autres modèles. Le code n’est pas accessible et vous ne pourrez pas déplacer et/ou copier votre site. L’avantage ? Cela vous simplifie la gestion. L’inconvénient ? Vous ne faites pas ce que vous voulez. Vous serez dépendant des outils disponibles (ou non) et la performance de l’hébergement non évolutive.
Et les licences de plugins ou thèmes WordPress ?
En effet, s’il est possible de réaliser entièrement un site WordPress avec des plugins et thèmes gratuits, vous pouvez opter pour des offres dites « premium ». Vous vous acquittez d’une licence d’une cinquantaine d’euros ou plus, vous récupérez le fichier zip et vous l’installez. Mais alors suis-je encore propriétaire de mon site si j’ai des licences payantes ? Oui car en réalité la licence concerne l’accès aux fichiers. Vous n’avez pas le droit de revendre la licence pour donner l’accés aux fichiers à d’autres personnes, mais les fichiers sont bel et bien les vôtres. Par exemple, rien ne vous empêche de modifier les fichiers CSS d’un plugin ou d’un thème.
Pour conclure, avec WordPress, vous êtes bel et bien propriétaire de votre site, de ses fichiers et de sa base de données ! (mais attention à ne pas confondre avec https://wordpress.org/ qui lui, ne vous donne accès à rien !)
]]>Nous avons vu que pour optimiser un site WordPress, il faut éviter de charger la base de données. Hors, selon comment sont faits les plugins, le nombre de requêtes varie considérablement. D’un point de vue de la performance, moins il y a de requêtes et plus le plugin sera optimisé. Nous allons utiliser un cas de figure classique : passer son site en multi-langue, quelles conséquences sur les performances WordPress ?
Le comparatif de plugins multi-langue : WPML vs Polylang
Notre comparatif de performances WordPress se base sur 2 plugins multilangue bien connus : WPML et Polylang.
Le plugin Premium de traduction : WPML
WPML n’exite pas en version gratuite, et est très complet par défaut. Il permet d’aller très loin dans les traductions en proposant des traductions automatiques, une interface propre à WPML, un gestion de traducteurs etc etc. C’est un véritable couteau suisse de la traduction. Mais à quel prix ? C’est ce que nous allons vérifier.
Le plugin gratuit de traduction : Polylang
Polylang a 2 versions : gratuite et payante. La version payante permet notemment de gérer les boutiques Woocommerce. Pour notre test, nous allons volontairement utiliser la version gratuite.
Le test de requêtes et de performances WordPress
La première étape consiste à créer un site WordPress vide pour voir le nombre de requêtes générées par défaut. Ensuite nous installerons successivement les 2 plugins avec entre-temps une réinstallation de WordPress pour s’assurer de repartir de 0. Le système de base de données est le plus courant : MySQL (ou MariaDB).
Nous allons ensuite vérifier le nombre de requêtes sur le tableau de bord WordPress. Un test plus complet serait de faire des tests sur les pages de blog, la page d’accueil du site et le tableau de bord, plusieurs fois et avec plusieurs articles. Mais pour ne pas vous noyer dans les chiffres (et nous simplifier la vie), nous allons rester sur le tableau de bord WordPress.
Etape 1 : combien de requêtes MySQL génère WordPress ?
Après avoir installé un WordPress vierge, on installe et on active le plugin « Query Monitor » afin de voir combien de requêtes génère WordPress.
Voila le résultat en appelant le tableau de bord (wp-admin/index.php)
Nous avons donc par défaut 38 reqêtes en base de données. On peut également voir un temps de réponse de 0.3s et 33Mo en memoire. Ces deux chiffres ne sont pas ceux qui nous interressent principalement, mais il sera interressant de les comparer ensuite.
Etape 2 : installation de Polylang (version gratuite)
De la même manière que l’extension query monitore, on installe le plugin de traduction Polylang.
configuration :
- 2 langues, francais et anglais
- traduction des médias activée
La configuration est très simple, et cela se note sur le nombre de requêtes. On retourne sur le tableau de bord :
Polylang n’a ajouté que 5 requêtes. Nous sommes passé de 38 à 43 requêtes. L’utilisation mémoire a à peine augmenté, de même que le temps de génération de la page.
Le plugin n’alourdit que très peu WordPress.
Etape 3 : installation de WPML
On réinstalle un wordpress vierge, puis on installe query monitor et wpml. WPML étant un plugin premium, il ne s’installe pas depuis la bibliothèque mais bien via l’installeur « Téléverser une extension »
Ensuite on passe à la configuration :
- Ajout d’une langue : anglais
- Configuration de la langue par repertoire (/en)
- Ajout de la clef de licence
- Ajout du plugin « StringTranslation » qui s’avère être nécessaire dans de nombreux cas
On retourne sur le tableau de bord et là :
WPML fait passer le nombre de requêtes de 38 à 92, soit plus du double ! On peut aussi voir que logiquement, le temps de réponse ainsi que l’utilisation mémoire ont augmenté.
Conclusions du test de requêtes MySQL sur WordPress
| Nombre de requêtes | Utilisation Mémoire | Temps de génération | |
| WordPress Seul | 38 | 33Mo | 0.35s |
| Avec Polylang | 43 | 35.8Mo | 0.38s |
| Avec WPML | 92 | 46Mo | 0.52s |
Que veut dire ce tableau comapratif de performances ? Faut-il dénigrer WPML et foncer tête baissée sur Polylang pour votre WordPress ? Non (enfin si, mais ca dépend).
Tout d’abord, il faut nuancer. Ce « test » compare 2 plugins qui, s’ils permettent la traduction, ne sont pas vraiment comparables en l’état. Polylang se contente de « relier » 2 posts pour faire la correspondance entre français et anglais, dans notre cas. WPML de son coté a toute une interface de gestion des traductions, une option de traduction automatique, un système de traduction de chaines très abouti, et même une gestion de traducteurs. En gros, si Renault est l’option de traduction, Polylang serait une twingo et WPML l’espace. Logiquement, le Renault espace consomme plus que la twingo !
Donc si l’usage de ces deux plugins fait toute la différence, le but de cet article n’était pas de justifier l’usage de l’un ou de l’autre mais bien de constater l’importance du choix du plugin et de son impact sur votre site.
On voit clairement que WPML est plus lourd que Polylang. Alors, si les 2 plugins répondent à votre besoin de traduction, autant choisir le plus léger ! Et cela prévaut pour tous les plugins WordPress. Il est important de bien les choisir, les tester et s’assurer que chaque plugin ajouté n’impactera pas négativement votre site à cause des requêtes en base de données !
]]>1. Comment détecter que mon site WordPress est lent et pourquoi l’optimiser ?
C’est simple, si vos visiteurs vous disent : le site est lent, ou si les résultats de google pageSpeed sont mitigés, alors il faut faire quelque chose.
Pourquoi ? Est-ce un facteur clef du SEO ? Non, ce n’est pas un facteur clef, mais cela pourrait le devenir et si ce n’est pas un facteur clef, c’est un facteur « indirect ». Si le site est trop lent, les visiteurs ne restent pas, le taux de rebond augmente et cela influence dans tous les cas le score Google, et surtout, votre business. Sur un site e-commerce, un site WordPress lent est évidemment une perte de revenus.
2. Pourquoi mon site WordPress est lent ? Que faut-il optimiser ?
AAAAAAHHHHHH voila une bonne question ! Avant de se lancer à corps perdu dans l’optimisation, il faut essayer de voir (et comprendre) ce qui peut être optimisé.
Optimisez vos requêtes en base de données
La première chose à savoir est que la première cause d’un site lent est à cause de … sa base de données ! Et oui, un site farci de requêtes ira forcément moins vite. Le premier outil de diagnostique est donc notre ami : Query Monitor
Il va permettre de vérifier quelles sont les requêtes gourmandes et/ou en trop. Par exemple, si vous avez installé WPML, vous verrez que le plugin est ultra complet, mais aussi très groumand en requêtes. Il fera ralentir le site. Si vous avez des besoins spécifiques, testez plusieurs plugins avec query monitor activé et regardez le nombre de requêtes lancées. Vous aurez probablement quelques surprises !
Sur les grands sites, les tables (surtout postmeta) deviennent très importantes. Il devient alors utile d’ajouter des « index ». Ce plugin aidera également à « fluidifier » votre base de données : Index WP MySQL For Speed.
Optimisez l’usage de vos plugins
Cela rejoint le point précédent, mais on ne le répetera jamais assez : il faut limiter l’usage des plugins WordPress. Certains ont des points communs, d’autres ajoutent des surcouches non nécessaires en javascript, css etc.
Vérifiez bien si tous vos plugins sont nécessaires : une ligne de code peut parfois suffire à ajouter une fonction dont vous avez besoin sans passer par un plugin !
Optimisez les ressources statiques de votre WordPress
« Oui, je veux bien, mais c’est quoi ?! »Les ressources statiques sont les fichiers que WordPress va vous envoyez lorsque vous appelez une page. Voici les 3 principaux :
- les fichiers de style : .css
- les fichiers javascript : .js
- les images : .jpg
Pour faire simple, il faut les alléger le plus possible. Attention, pour les CSS et les JS, il ne faut pas nécessairement les combiner. D’une part, cela engendre bien souvent des conflits de règles, mais en plus conserver plusieurs fichiers permet de les telecharger en même temps, ce qui, au final, est préférable à télécharger un seul fichier plus volumineux. Plus les fichiers sont légers, plus le téléchargement est rapide et plus la page va vite s’afficher. CQFD.
Pour les images, on va y revenir plus loin, mais le mieux est de les optimiser AVANT de les uploader (voir l’article « Faut-il optimiser les images sur WordPress« ). Sinon certains plugins font très bien le boulot.
Ajoutez du cache à votre WordPress !
Le cache est une version « statique » de votre site par oposition à sa version « dynamique ». Voici le fonctionnement :
- si WordPress n’a pas encore de cache généré, le premier visiteur va le générer en visitant le site. Lui aura la version « moins rapide » du site puisque chaque page demandée va aller faire des requêtes à la base de données pour renvoyer les contenus (images / textes / etc)
- le cache va se construire, soit au fil des visites, soit si vous avez une option de préchargement, le plugin WordPress ira vérifier les pages pour les mettre en cache.
- Le prochain visiteur à visiter une page déjà « cachée » ne fera plus d’appel à la base de données. Le site lui servira directement la page précédemment générée. Les performances seront décuplées.
Note : bien souvent les plugins de cache ajoutent également les règles nécessaires pour le cache « utilisateur ». Exemple : durée de conservation des fichiers CSS : 30j. Cela signifie qu’avec ce réglage, le navigateur client conservera en cache une version de fichier CSS pendant 30jours.
Autres types de caches : le CDN et le cache objet
Encore des termes barbares ! Voici une explication :
Le CDN : Content Delivery Network
À la base, le principe est de mettre en cache les ressources statiques (rappel : images, css, et js) sur des serveurs éparpillés aux 4 coins du monde pour réduire le délai de chargement. Par exemple, si le site WordPress est hébergé en France mais que votre visiteur est aux États-Unis, il va devoir télécharger le contenu depuis le serveur français. Le CDN permettra de « délivrer » l’image depuis un serveur directement aux États-Unis au lieu de la France afin de réduire le temps de réponse. Le CDN est un réseau de serveurs sur lesquels sont stockés les fichiers de votre site.
Donc le CDN est utile principalement si vous avez des visteurs à l’international. Sinon son usage est très limité. Certains CDN comme Cloudflare ajoutent une couche de sécurité mais qui peut parfaitement se gérer directement au niveau de l’hébergement de votre site, mais ça c’est un autre sujet.
Le cache Objet
Un message WordPress vous indique souvent qu’un cache objet devrait être présent. Le cache objet est un méchanisme de base de données. Plutot que de faire 15 fois la même requête, elle sera placée en cache pour améliorer les performances. Ce cache intervient surtout là où le cache de fichiers statiques n’est pas possible. Mais attention aux réglages, cela peut perturber les sites e-commerce.
Ces deux caches sont des optimisations possibles pour WordPress, mais à considérer en dernier recours. Ils sont assez délicats à manipuler et n’influenceront que dans certains cas les performances de votre site.
3. Les outils et plugins d’optimisation WordPress
Voici une liste non-exhaustive de plugins WordPress servant aux différentes optimisations vues précédemment.
Les plugins de cache pour WordPress
Le premium : Wp Rocket
Tout simplement l’un des plus utilisés car tres pratique d’utilisation. Le support est également três efficace et réactif. Il existe plusieurs addons tels que l’exclusion du cache utilisateur pour les admins ou encore une version git pour générer les fichiers de conf nginx (qui rappelons-le ne prend pas en charge le htaccess).
Cout : 59$ / an –> Voir les offres (aucun parrainage)
Le combo gratuit : autoptimize + wp super cache
Pourquoi ces deux là et pas w3 total cache ou fastest cache ? Simplement parce que par experience le combo est efficace mais vous pouvez toujours tester les 2 autres. Bemol pour W3total cache : il est tres complet, peut-être trop et une bonne configuration peut être un peu laborieuse à mettre en place.
Litespeed cache : le gratuit dédié à un hébergement du meme nom
En gros, il faut avoir un serveur light speed pour pouvoir bénéficier des fonctions de cache optimisé du plugin. Votre hébergeur vous indiquera si c’est le cas ou non. Voici un excellente vidéo sur la configuration du plugin : https://www.youtube.com/watch?v=dzkbHg_uD9w&ab_channel=NoraCheikh
Les plugins d’optimisation d’image
Là encore il y en a une poignée. En général ils sont gratuits avec une limite d’optimisation d’images.
- Ewww
- Imagify (meme societe que wp rocket)
- webp converter : gratuit mais ne fait que convertir en webp
Attention à l’espace disque : si ces plugins permettent d’optimiser les images sur votre site, ils conservent en général la version originale de l’image. L’occupation augmente donc d’autant plus avec les plugins car les images doublent : les originales / les optimisées / les non optimisées.
4. Conclusion : optimiser WordPress revient à combiner plusieurs techniques
Tout est dans le titre ! Pour optimiser WordPress, il faut combiner plusieurs systèmes d’optimisation. Mais attention aux conflits ! Voici quelques règles d’or en optimisation :
- Ne jamais tester sur la version de prod ! Des conflits non détectés peuvent completement « casser » un site
- Toujours tester un par un les plugins d’optimisations. Et meme sur un seul plugin, il faut tester les règles une par une ! Sinon on ne sait plus quelle règle peut causer une erreur.
- Tester (naviguer) régulièrement le site : les css / js changent régulièrement lors des mises à jours WordPress. Il faut donc souvent les regénérerer avec les plugins de cache.
Quels sont les formats d’image sur WordPress ?
Les différentes tailles d’images
WordPress génére automatiquement 3 tailles d’images pour chaque image uploadée :
- une miniature : 150px X 150px
- une medium : 300px X 300px
- une large : 1024px X 1024px
On trouve ces réglages dans « réglages » –> « Medias ». Seule l’image « miniature » est carrée. Elle est recadrée au centre de l’image. À l’inverse, les images « medium » et « large » ne sont pas « recadrées ». C’est à dire que ces valeurs sont des maximums en hauteur et/ou largeur selon la disposition de l’image d’origine. Le ratio de l’image est donc conservé.
Une image au format paysage restera sous ce format en « medium » et « large » alors que la miniature sera carrée. Selon les thémes, il est courant de trouver des formats d’image supplémentaires.
Sauf que si l’on regarde le FTP, nous verrons qu’il y a d’autres formats intermédiaire également générés.
La compression de WordPress des images
De plus, lorsque WordPress génère ces images, il compresse les images pour les optimiser. Mais pour être plus précis, cela ne fonctionne que sur des formats qui le supportent bien. Par exemple, le format PNG est un format qui ne se compresse que trés peu. C’est pour cela qu’il n’est pas recommandé de l’utiliser. Les images en PNG sont en général bien plus lourdes qu’en jpg. Ce format est traditionnellement utilisé pour les icônes.
Donc de manière native WordPress optimise les images, mais est-ce suffisant ? Tout d’abord, voyons comment les utiliser.
Quelle taille d’image à insérer dans des pages ou articles WordPress ?
Que l’on utilise Gutemberg, Divi, Elementor ou tout autre builder, lorsque l’on insère une image, il faut choisir le format le plus adapté. Insérer une image dans sa taille large (1024px) dans une colonne qui fait 300px de large n’est donc pas optimisé. Il faut alors choisir la taille « medium ». L’image aura une dimension adaptée, avec un poids limité. C’est de cette manière que le poids de la page est optimisé et que l’on gagne en performances.
Quel poids d’image est recommandé pour un site WordPress ?
En règle générale, on peut considérer qu’une image ne doit pas dépasser les 300ko sur un site web.
Est-ce suffisant ? C’est un bon point de départ, mais on cela peut etre optimisé davantage. Faisons un test avec une image d’un appareil photo que l’on souhaite insérer dans son article.
L’image originale fait 4032px par 3024px et pèse 4.3Mo.
Voyons les différents formats générés par WordPress.
Quel est le poids des images générées par WordPress ?
Notre téléchargement d’image basique a automatiquement créé 8 images :
- L’image d’origine : P1019118.jpg (voir l’image) pour 4.3Mo
- La miniature : P1019118-150×150.jpg (voir l’image) pour 48Ko
- La taille moyenne : P1019118-300×225.jpg (voir l’image) pour 56Ko
- La grande : P1019118-1024×768.jpg (voir l’image) pour 116Ko
Mais également :
- P1019118-scaled.jpg (voir l’image) pour 348Ko
- P1019118-1536×1152.jpg (voir l’image) pour 180ko
- P1019118-2048×1536.jpg (voir l’image) pour 256Ko
- P1019118-768×576.jpg (voir l’image) pour 92Ko
Nous avons donc un total de 8 images pour un poids total de 5.4Mo. Si on compare le poids des images générées par WordPress avec l’orginale, on ne depasse que de peu les 300ko, et cela n’est que sur l’image « scaled ». Cette image est en fait celle qui sera utilisée si vous choisissez la taille d’ « origine ». WordPress n’affichera pas l’image que vous avez téléchargée car elle est bien trop lourde et grande pour la majorité des écrans.
Doit-on optimiser les images avant de les uploader sur WordPress ?
Dans bien des cas, une image n’a pas vocation à être visualisée en plein écran. Une image qui sert uniquement d’illustration dans un bloc de 600px de large, par exemple, devrait être optimisée en amont et insérée directement à la bonne taille. Cela présente 2 avantages
- la compression WordPress est certe présente mais pas forcément optimale. À qualité identique, le poids peut etre optimisé.
- en téléchargeant directement l’image à la bonne dimension, on évite les multiples formats et surtout on évite de stocker sur l’hébergement une image de 4Mo qui ne sera jamais visualisée.
Bien des outils existent pour optimiser et redimensionner des images sur votre ordinateur. Une simple recherche Google vous en donnera toute une liste.
Nous prenons la même image, mais nous allons l’optimiser avant de la télécharger dans la médiathèque WordPress de la manière suivante :
- dimension : 762px * 572px
- compression : 60
- suppression des metadata
- Poids en sortie : 56ko
–> La premiere constatation est que notre optimisation (et encore, on aurait pu compresser un peu plus) est plus légère que celle de WordPress : P1019118-768×576.jpg (voir l’image) pour 92Ko
Et coté serveur nous n’avons plus que 3 images :
- P1019118_optim-150×150.jpg pour 8ko (40ko précédemment)
- P1019118_optim-300×225.jpg pour 16ko (56ko précédemment)
- P1019118_optim.jpg pour 56ko
Total : 80ko (5.4Mo précédemment)
Il est donc trés important d’optimiser dès le départ les images qui sont mises en ligne. Cela permet d’une part un gain de poids sur la page, mais aussi au niveau hébergement. Si vous téléchargez systématiquement des images en provenance de votre téléphone ou de votre appareil photo, le poids de votre WordPress sera décuplé inutilement.
Les plugins d’optimisation en ligne des images pour WordPress
Si jamais l’optimisation en amont n’est pas votre fort, vous pouvez toujours utiliser des plugins d’optimisation en ligne. Non seulement ils vont optimiser mes images mieux que WordPress, mais en plus ils proposeront de convertir vos images en formats plus récents et plus légers tels que Webp ou Avif.
Ceci dit, vous pouvez dans tous les cas continuer à importer vos images optimisées. D’une part le plugin aura moins de travail lors de la compression et d’autre part, comme nous l’avons vu plus haut, vous éviterez de surcharger inutilement votre hébergement WordPress.
Par contre, par défaut, ces plugins ne supprimeront pas les images non optimisées, risquant de faire encore grandir votre espace disque. Ce n’est pas une solution miracle non plus.
Certains plugins sont gratuits, d’autres payants, certains le font en ligne, d’autre non etc. Nous ne ferons pas de comparatif aujourd’hui mais en voici quelques-uns :
- Imagify : plugin développé par les créateurs de Wp-rocket.
- Smush : plugin développé par WPMU Dev autre grande équipe de plugins reconnus
- EWWW Image Optimizer
- ShortPixel
- etc.
Conclusion
À la question : « Faut-il optimiser les images avant de les télécharger sur WordPress ? », la réponse est : OUI. Nous l’avons vu, si WordPress optimise les images automatiquement, son optimisation n’est pas au maximum de ce qu’il est possible de faire.
De plus, importer des images en sortie d’appareil photo ou de téléphone fera exploser inutilement la taille de votre répertoire /wp-content/uploads. Et les plugins améliorent le front, mais pensez que les images stockées augmenteront. Sur des boutiques en ligne ou des sites volumineux, il faudra le prendre en compte.
- D’abord parce que la version gratuite de wp amélia ne permet pas ces integrations.
- Ensuite parce qu’intégrer ces outils nécessite un compte sur les systèmes de visio.
- Par conséquent, les outils de visio ne sont pas sur votre site.
Revenons juste un moment sur l’outil de prise de rendez-vous.
Quelles solutions pour ajouter de la prise de rendez-vous en ligne sur mon wordpress ?
Comme nous l’avons dit en introduction, wpamelia est un trés bon plugin de prise de rendez-vous. Il permet facilement à vos visiteurs de :
- Prendre des RDV en ligne
- Payer en ligne (version payante)
- Gérer leurs RDV (version payante
- S’inscrire à des évènements que vous aurez planifiés
- Et encore bien d’autres options que nous ne détaillerons pas aujourd’hui
Mais ce qui nous interresse c’est d’ajouter de la visio-conférence à la prise de rendez-vous en ligne. Nous allons nous pencher sur cet aspect
Pourquoi ajouter un système de visio-conférence sur mon site internet ?
C’est une excellente question, merci de me la poser :)
Avec la crise sanitaire passée, de nombreuses professions ont dû s’adapter afin de continuer à travailler. Le télétravail s’est démocratisé et les rendez-vous en ligne ont augmenté. Il est aujourd’hui trés courant de faire une visioconférence avec son médecin, un agent immobilier ou n’importe quelle entreprise de services. Il est donc logique de chercher à ajouter à un système de prise de rendez-vous en ligne une visio-conférence en suivant.
Votre visiteur prend rendez-vous sur votre site selon les disponibilités que vous aurez fixé et il reçoit un mail avec toutes les informations nécessaires pour démarrer une visio-conférence.
Wp see me, le plugin de visio-conférence intégré à votre site pour wpamelia
Comme nous l’avons dit, Amelia a déjà une integration native mais elle est limitée à la version payante et ce sont des applications pour lesquelles il faut s’enregistrer et sortir de votre site web. Nous n’avons donc rien inventé, nous avons juste cherché à optimiser un systeme existant par notre experience et les demandes de nos clients.
Voici que nous proposons :
- Intégration de la visio-conférence, même sur la version gratuite
- Systéme intégré à votre site wordpress : votre marque est préservée
- Aucune installation sur le poste client, il a juste à cliquer sur le lien et activer son micro et sa caméra
Ce sont les fonctions principales. Pour plus de détails, n’hésitez pas à nous contacter.
Nous avons fait en sorte qu’un lien unique pour chaque rendez-vous soit généré via la plateforme jitsi meet et encapsulé sur votre site. De cette manière, votre visiteur n’a pas besoin d’installer quoi que ce soit sur son ordinateur (ni vous non plus d’ailleurs) pour démarrer la visioconférence sur votre site wordpress.
Où voir le plugin de visio-conférence Wp see me en action ?
Le plugin a été développé pour notre client « psybernetic » afin de faciliter la prise de RDV en ligne de ses patients :
- Psychologue 100% en ligne : https://psybernetic.fr/prendre-un-rendez-vous/
Il en va de même pour les fiches produits de woocommerce. De nombreux plugins permettent de les refaire complètement. On peut citer là encore le contructeur Elementor pro pour construire les fiches produits, mais aussi jetengine. Il suffit de reconstruire la page avec les widgets de nom de produit, prix, description courte, description longue, bouton d’ajout au panier etc.
Mais alors, comment personnaliser et modifier le tableau d’attributs des produits de woocommerce ?
En fait, il s’agit d’une partie qui est restée codée de manière historique. Il n’y a pas de hook, pas d’options de personnalisation pour afficher les attributs d’un produit woocomerce. C’est un tableau de caractéristiques pur et dur.
Toutes les caractéristiques du produit woocommerce sont affichées, on ne peut même pas choisir au niveau template d’afficher ou non certains attributs. Il faut le faire au niveau du produit. Ce n’est pas tellement pratique alors que tous les sites tendent à optimiser non seulement leur SEO mais aussi leur fameux UX (User eXperience, yeah !). Bon en gros, ce n’est jamais que de mettre un mot sur ce qu’on a toujours fait, à savoir un site pratique à utiliser, mais ça, c’est un autre débat :)
Donc pour revenir à nos attributs de produit woocommerce, comment les mettre en forme et surtout :
Pourquoi modifier l’affichage des attributs produit sous woocommerce ?
Et bien tout simplement pour pouvoir rendre plus lisible une fiche qui sera ssez technique. Par exemple :
- On peut souhaiter regrouper les caractéristiques par thème pour les rendre plus digestes.
- On peut également vouloir identifier quelques attributs phares et les mettre en avant dans les boucles de produits woocommerce.
C’etait encore un peu compliqué il y a quelques années, mais avec les builders (constructeurs de page) et les champs personnalisés de wordpress, c’est aujourd’hui beaucoup plus simple.
Utiliser ACF pour des champs personnalisés sur un produit woocommerce ?
Oui, utiliser ACF (Advanced Custom Fields) est une solution. Pourquoi ? Car ce plugin permet d’avoir une interface graphique et de (très) nombreuses options pour gérer des champs personnalisés de manière globale. Mais pour autant est-ce LA solution ? pas vraiment.
- Si ACF permet d’ajouter des champs personnalisés, ils ne peuvent pas être utilisés comme filtres
- ACF n’est jamais qu’une solution avancée de gestion de chanps qui sont natifs chez wordpress
Encore une fois, ACF est très bien, mais il ne répond pas nécesairement à notre besoin ici qui est de reprendre les attributs produits pour les afficher à différents endroits du site. Quelle est donc la solution ?
Exporter les attributs des produits vers des champs personnalisés
Comme dit précédemment, si ACF est une solution, pourquoi ne pas utiliser directement les champs personnalisés de wordpress au lieu d’installer un -nième plugin qui sera sous exploité ?! Il suffit alors d’exporter les attributs des produits vers les champs personnalisés.
Mais au fait, pourquoi exporter les attributs de produits me direz-vous ? Parce que les attributs sont des valeurs qui sont dans un tableau et qu’il n’est pas possible de les récuperer directement avec les champs dynamiques. Bon c’est un peu technique, mais en gros, les attributs des produits sont pêle-même et pour les utiliser séparément, et bien il faut tout déméler.
Et pour ça, on a fait un petit plugin magique qui permet d’exporter ces attributs ! Et comme on est sympa, on vous le met à disposition sur wordpress !
Plugin d’export des attributs en champs personnalisés
Bon évidemment, c’est encore un plugin, mais il ne fait que ça et ne consomme absolument aucune ressource puisqu’il ne travaille que sur demande. Il affiche tous les attributs, et vous n’avez plus qu’à cocher ceux qui vous interressent. Ils sont alors exportés séparemment dans des champs personnalisés que vous pourrez récupérer via la meta_key de votre éditeur favori !
Dans notre exemple, il faut juste récupérer les 3 metas key commançant pas esp_ et les utiliser dans les champs personnalisés elementor
Vous l’aurez deviné, lorsque vous mettez à jour vos produits avec leurs attributs, il faut juste relancer le petit plugin magique pour mettre à jour les champs dynamiques. Peut-on automatiser ? oui. Est-ce nécessaire ? non. Pourquoi ? Parce qu’en général, on ne fait pas de modification tous les 4 matins sur ses produits. Faire tourner régulièrement notre petit ami n’est donc pas forcément très optimal en terme d’utilisation de la base de données. Mais si vous en avez besoin, nous nous ferons un plaisir de vous personnaliser le petit plugin.
Elle est pas belle la vie ?! N’hésitez pas à télécharger le plugin sur wordpress et/ou à faire un tour sur les autres plugins que nous avons pu faire. Et si vous avez besoin d’un développement spécifique wordpress, n’hésitez pas à nous contacter !
]]>Vous savez que les algorithmes des moteurs de recherche évoluent régulièrement. Certains critères disparaissent au profit de nouveaux. Mais il y a des critères qui perdurent et restent le socle d’un bon référencement. La présence de backlinks en fait partie. Mais attention ! La qualité prime sur la quantité.
Dans cet article nous allons voir tout ce que vous devez savoir pour que vos résultats SEO s’améliorent en 2020 ! Mais attention ce n’est qu’un critère parmi tant d’autres, ne vous arrêtez pas là !
Un backlink c’est quoi ?
Précisons tout de suite ce qu’est un backlink. Il s’agit d’un lien positionné sur un site quelquonque (on va définir le quelconque) et qui pointe vers votre site, sur la page d’accueil ou tout autre page.
Grâce à ce lien vous envoyez un message aux moteurs de recherche. Vous les informez qu’un site donne de la crédibilité à une page de votre site. C’est en quelque sorte un lien de confiance et si le site qui vous cite est plus important que le votre alors vous bénéficiez de sa notoriété dans votre classement. Et ça c’est vraiment pas négligeable car vous gagnez du temps dans votre progression.
Maintenant je vais freiner vos ardeurs ! Je vous l’ai dit plus haut les algorithmes privilégient la qualité des liens à la quantité. Concretement ca veut dire quoi ? Ca veut dire qu’il ne faut pas chercher à être présent sur tout les sites de France, de Navarre et de la Péninsule Ibérique. Il doit y avoir un rapport pertinent entre votre site et celui qui vous transmet sa confiance. Vous devez aller chercher l’autorité auprès de site en rapport avec votre domaine d’activité. L’algorithme est capable aujourd’hui de repérer les « faux » backlinks et de vous sanctionner en conséquence, c’est à dire vous déclasser. Vous obtiendrez alors l’effet inverse de celui recherché.
Sur les sites anglophones ou les sites français qui se la pète on trouvera les termes inbound links ou incoming links.
Pourquoi des backlinks ?
A l’heure actuelle, avec plus de 30 milliards de pages présente sur la SERP Google comment départager plusieurs sites qui répondent à la même requête et choisir lesquels figureront sur la première page ? Grâce aux backlinks justement !
Malgré l’évolution incessante des algorithmes des moteurs de recherche il manque encore et toujours la capacité humaine (tant mieux?) à départager deux sites très pertinents. C’est donc grâce aux backlinks, à la notoriété acquise par un site, au meilleur profil de lien, que le moteur va faire la différence. En clair plus vous serez reconnus par vos pairs meilleur sera votre classement ! Evidemment, on ne le répétera jamais assez, d’autres critères sont indispensables. C’est la somme des bonnes pratiques qui vous mettra sur le devant de la scène.
Une autre raison à obtenir un bon backlink c’est la possibilité d’obtenir rapidement un bon positionnement. C’est un bon moyen d’être visible rapidement, de pouvoir rapidement valoriser votre produit ou votre savoir-faire. Pour ça il va bien falloir prendre le temps de trouver le bon « partenaire » et surtout de le convaincre de vous accorder sa confiance.
LA SERP c’est quoi ?
Acronyme anglophone pour « Search Engine Result Page ». Ce terme est souvent utilisé dans le jargon français des professionnels du marketing digital pour désigner une page de résultat d’un moteur de recherche, qui s’affiche suite à une requête (ou recherche) faîte par l’internaute.
Les types de backlinks
Concretement, et pour parler légèrement technique, il existe essentiellement deux types de lien entrants : les liens dofollow et les liens nofollow. Ces deux liens auront une influence différente, pour ne pas dire opposée, sur votre classement.
Les liens dofollow
Ces liens indiquent aux robots de transmettre l’autorité et le classement SEO aux sites cibles. En clair c’est grâce à ce type de lien que vous bénéfierez de la confiance et l’autorité du site qui possède votre lien. La vraie difficulté sera d’obtenir ces liens. Et que le site en question positionne judicieusement votre lien, dans un contexte lié à votre site. Et idéalement dans la première partie de son contenu, au dessus de la « ligne de flottaison », là ou il a encore une chance d’être lu. L’internaute est un zappeur, il faut rapidement capter son attention !
Dans la pratique un attribut « rel=dofollow » sera ajouté à votre balise de lien. Pour les utilisateurs WordPress c’est souvent un plugin de référencement qui le fera pour vous.
Lien nofollow
Les liens nofollow ont l’effet inverse des précédents. Ils disent aux robots de ne pas transmettre l’autorité et les classements SEO au site cible.
« Euh oui mais là c’est quoi l’intérêt ? » Merci Pauline pour la question ! Dans certains cas il est préférable de ne pas avoir un suivi de lien, par exemple sur des forums. Cela évite des abus de certaines personnes qui en profiteraient pour balancer de la pub à tout va. Si ces liens renvoient vers des sites douteux c’est l’autorité du forum qui en prendrait un coup. Et son classement aussi. De même si certains de vos liens entrants sont positionnés sur des sites peu visités il peut-être préférable de le marqué en nofollow. Ce lien servira uniquement aux humains et pas aux robots (ce qui est le but premier quand même!)
Dans la pratique un attribut « rel=nofollow » sera ajouté à votre balise de lien.
Une bonne stratégie est de mixer les liens dofollow et les liens nofollow.
Pour vérifier si un lien est dofollow ou nofollow vous pouvez par exemple utiliser une extension pour Chrome « NoFollow Simple Chrome extension »
Ou positionner des backlinks sur un site ?
Idéalement les liens entrants doivent être contextualisé c’est à dire au sein d’un contenu. Vous pouvez en avoir dans le pied de page mais leur impact est moins grand. On l’a dit un peu plus haut le lien doit être rapidement visible pour avoir une chance d’être vu, lu et cliqué ! D’où l’importance d’être convaincant auprès de votre « partenaire » pour avoir une chance d’être bien positionné. De surcroît le champ sémantique qui entoure votre lien devra être en rapport, si possible porteur de mots clés pour améliorer vos scores.
Quand on débute dans le marketing digital avec un projet à taille humaine on est souvent limité par le budget. Et dans le marketing en général le budget c’est primordial. Si je vous dis ça c’est parcequ’à votre niveau vous ne pourrez pas avoir les meilleurs backlinks possibles. Pour ça il faudrait passer par une agence SEO qui va alors créer une campagne de netlinking. Ca consiste à mettre en place une stratégie intelligente d’approche et d’échange de liens. Il peut s’agir également d’inscription sur des annuaires spécialisés ou encore d’achat de liens sponsorisés. Autant de méthode couteuses mais efficaces !
La bonne nouvelle !
Oui quand même il y a une bonne alternative sans coût ajouté et bonne pour votre santé digitale :) Laquelle ? Les réseaux sociaux. Et oui, grâce aux differents réseaux comme Facebook, Instagram, LinkedIn, Twitter et autres vous pouvez partager des liens vers votre site; Et gratuitement. La aussi il faut la jouer fine, ne pas inonder à tout va, sans rapport aucun mais il y a quand même de quoi faire. Et finalement votre meilleur vecteur de communication reste encore votre entourage, votre réseau d’amis et connaissances. Ne vous en privez pas ! Profitez en !
Conclusion
Je ne vais pas disserter trop longtemps sur ce sujet car il relève d’un vrai travail d’expert. A notre niveau débutant je voulais attirer votre attention sur l’importance de créer un maillage de liens dans vos contenus. Vous commencerez par les liens internes (ceux qui renvois à du contenu de votre propre site) mais en grandissant vous aurez besoin d’avoir et de dispenser des liens externes.
L’autre chose qu’il est bon de savoir c’est la difference entre les nofollow et les dofollow car vous utilisez certainements des plugins (comme Yoast ou SEOPress) qui utilisent ces termes sans forcemment bien vous les expliquer. Maintenant vous connaissez la différence et le rôle de chacun.
Sachez aussi que les professionnels du référencement utilisent des outils (payants et souvent chers) pour optimiser vos contenus et le maillage (netlinking), calculer des scores de profils backlinks, mesurer les performances, … bref un métier à part entière. Et là on ne parle que de référencement naturel (donc gratuit).
]]>