Dans notre précédent article, nous vous expliquions comment nous réalisons l’arborescence des sites web de nos clients. Egalement, nous avons abordé l’importance d’un cahier des charges ou d’un backlog correctement rédigé. Enfin, nous avons abordé le sujet des zonings.
La conception pure de votre site web touche presque à sa fin.

En effet, dans cet article, nous allons parler webdesign, environnement de recette et plugins WordPress incontournables.
Pour naviguer simplement dans la troisième partie de cet article consacré à la méthodologie de votre agence pour créer un site WordPress, voici un sommaire :

Nous vous souhaitons une bonne lecture !

Comment réaliser les webdesigns d’un site WordPress ?

Tous les zonings ont été réalisés et les éventuels soucis d’interface utilisateur corrigés. Parfait ! Que diriez-vous d’insuffler un peu de vie à tout cela ? Il est maintenant temps d’adapter vos zonings en webdesigns.

Pour ce faire, nous allons remplacer les emplacements matérialisés par des rectangles, des cercles et autres polygones par leur véritable fonction, leur véritable design, etc.

Un zoning (gauche) et un webdesign (droite) d'une même page
A gauche, le zoning de la page d’accueil du site web de Walk The Line. A droite, le webdesign de cette même page.

Pour réaliser les webdesigns, on utilisera à nouveau Adobe XD. Adobe XD a des avantages non négligeables :

  • Adobe XD est gratuit,
  • Adobe XD est très intuitif,
  • Adobe XD est conçu pour cet usage.
  • Adobe XD permet de créer des prototypes dynamiques !

Grâce à Adobe XD, vous aurez ainsi la sensation de naviguer réellement à travers votre site web. C’est idéal pour s’assurer à nouveau que les éléments sont correctement placés, ont une taille adéquat, etc.

Les webdesigns seront mis en couleurs en respectant les règles établies dans la charte graphique de notre client. La charte graphique est un document contenant les règles d’utilisation des éléments graphiques qui constituent l’identité d’une marque.

Grâce à la pluralité des compétences de Walk The Line, nous savons proposer à nos clients des interfaces web bien conçues qui respectent leurs besoins et leurs attentes.

Pourquoi créer un environnement de recette pour son site WordPress ?

Lorsque l’on créé un site web en méthode Agile, on n’intègre pas les webdesigns sur le futur site web de but en blanc.
Il faut créer un environnement de travail appelé environnement de pré-production ou encore environnement de recette. Il sert à élaborer le futur site web utilisable par les utilisateurs, appelé environnement de production.

Également, l’environnement de recette n’est pas visible des utilisateurs. Lorsque l’intégralité du travail sur l’environnement de recette sera achevé, on pourra transférer l’intégralité de notre travail sur l’environnement de production, c’est à dire le site web visible des utilisateurs.

Votre agence web réalise donc l’intégralité de son travail sur un environnement de recette. Sur cet environnement inaccessible au public et aux moteurs de recherches, effectuer des tests est plus simple. Aucun risque de perdre votre trafic d’utilisateurs, de faire une fausse manipulation pouvant impacter votre site web, etc. Ce n’est que bénéfique.

Qui plus est, cet environnement de recette vous sera très utile le jour où vous souhaiterez mettre en place un nouveau design pour votre site web, de nouvelles fonctionnalités, tester de nouveaux plug-ins WordPress… Toujours dans la même optique : tester, se tromper parfois, mais toujours sans incidence.

Réglages et extensions WordPress indispensables

WordPress est un logiciel fantastique, si tant est qu’il soit correctement paramétré. Pour ce faire, on procède à un tour complet de ses réglages. Cela sera très important, tout au long de la vie de votre site web. Certains paramètres influencent la sécurité, d’autres les performances, d’autres encore le référencement naturel de votre site WordPress, etc.

“Mais pourquoi paramétrer un site web sur lequel mes clients n’iront pas et qui ne me servira qu’à faire des tests ?”

Parce que pour passer d’un environnement de recette à un environnement de production, on ne s’amuse pas à recommencer l’intégralité du travail déjà effectué et celui à venir !
La perte de temps (et d’argent) seraient conséquents. En prenant un petit peu de temps, on peut transposer directement son environnement de pré-production à celui de production. Mais j’y reviendrai le moment venu.

En attendant, nous passons en revue les réglages WordPress. Lorsque cela est fait, nous téléchargeons, paramétrons et activons les plugins WordPress que nous jugeons, chez Walk The Line, incontournables. Votre agence web possède une liste non exhaustive de plugins bien conçus, simples mais efficaces, qui améliorent la sécurité de votre site web, ses performances, le confort de vos utilisateurs, etc.

Retrouvez plus en détails des tutoriels sur les extensions WordPress indispensables.

Voici la liste des extensions que votre agence web utilise systématiquement :

  • Akismet anti-spam : Afin que des commentaires indésirables ne viennent pas polluer vos espaces de discussions, nous utilisons le plugin Akismet anti-spam. Ainsi, les commentaires douteux sont supprimés ou mis de côté pour une relecture manuelle.
  • Block Bad Queries (BBQ) : Ce plugin est un pare-feu qui protège les sites web WordPress de nos clients des injections de code et autres tentatives pirates.
  • Breadcrumb NavXT : Un plugin très utiles pour mettre en place le fil d’ariane des sites web de nos clients. Le fil d’ariane est ce petit chemin de liens que l’on observe généralement en haut à gauche des pages sur un site web. Il indique aux utilisateurs leur position sur le site web. L’avantage de de ce plugin est qu’il permet d’incruster des micro-datas à l’intérieur de ce fil d’ariane.
  • Disable REST API : Depuis sa version 4.7, WordPress introduit une API REST qui permet à vos extensions et autres services de communiquer avec votre site WordPress. Le problème est que cette API permet donc l’accès à la liste de tous les utilisateurs de votre site web. Plutôt problématique, non ? Cela ne sera plus un soucis grâce à ce plugin qui empêche cette fonctionnalité.
  • Imagify : Reposant sur un système d’API (“application programming interface” ou interface de programmation d’application, permet à deux services indépendants de communiquer), Imagify est un plugin qui va compresser vos images. Sans subir de détérioration, ces dernières seront toutefois plus légères et donc plus rapides à charger. De quoi booster les performances de votre site web.
  • No Self Pings : Ce plugin permet, comme son nom l’indique, de ne pas subir de self-ping. Lorsque vous rédigez un article sur WordPress en y ajoutant un lien vers un autre site WordPress, par exemple, celui-ci est notifié du lien que vous avez inséré. Ce plugin permet de ne pas vous notifier vous-même lorsque vous créez un lien conduisant à un autre article de votre site web.
  • Oxygen : Plugin page / theme builder, ou constructeur de page par excellence, ce dernier permet de construire d’une manière intuitive et visuelle vos pages, archive d’articles, articles, produits, etc, par glisser-déposer. Votre agence web peut ainsi vous offrir un site web au design en adéquation totale avec vos besoins et vos envies.
  • Redirection : Ce plugin permet de mettre en place des redirections. La structure de votre site web peut être amenée à changer. Pour ne pas perdre de trafic ou déstabiliser vos utilisateurs lorsqu’une page, un article ou un produit est supprimé, on met en place une redirection. Celle-ci peut être faite vers la nouvelle équivalence de la page ou du produit supprimé. Si aucune équivalence n’existe, votre agence web reconduit votre trafic vers votre page d’accueil pour ne pas perdre de trafic ou perturber vos utilisateurs.
  • SEOPress : Cette extension WordPress est dédiée au référencement naturel de votre site web. En l’activant, des informations utiles sont affichées sur vos pages web depuis le back-office (tableau d’administration). Cela permet de savoir si vos mots-clés sont correctement exploités, si la structure des pages est correcte, les meta-description et meta-title correctement employés, etc.
  • SF Move Login : Des URL par défaut sont attribuées lors de la création de votre site WordPress. Elles définissent les URL de connexion, de déconnexion, d’accès à l’interface d’administration, etc. Ces URL génériques sont soumises à des risques pirates importants. Pour augmenter la sécurité de votre site web et celle de vos utilisateurs, Walk The Line change systématiquement ces URL par défaut par des URL personnalisées.
  • Simple Page Ordering : Ce plugin très simple apporte encore plus de confort à l’utilisation de WordPress. Il permet de réordonner les types de post page dans le back-office, sans incidence sur le front-office, c’est-à-dire l’interface visible des utilisateurs. Cela permet une vision générale plus efficace.
  • WP Rocket : Plugin de gestion de cache et d’optimisation des performances pour WordPress. L’extension agit à la fois sur le cache navigateur (côté client) et sur le cache serveur. Ce n’est pas tout, elle gère également le lazy loading, la minification et concaténation de fichiers, le nettoyage de la base de données… Ce petit couteau-suisse complet est en plus une extension française.

Cette liste de plugin est non-exhaustive. Votre agence web pratique une veille régulière pour dénicher les extensions WordPress les plus efficaces, les plus légères et les plus pratiques qui soient.
Qui plus est, ceci est une liste de base, contenant nos incontournables. Selon votre activité et vos besoins, d’autres plugins peuvent venir s’ajouter à la liste.

A la fin de ces étapes, votre site web commence à avoir une ossature. Prochainement, nous verrons comment la concrétiser par l’ajout des pages, articles, catégories, etc. Nous verrons également comment ne pas perdre de trafic utilisateur dans le cas d’une refonte de site web.

En attendant, n’hésitez pas à nous poser vos questions via le bouton ci-dessous. Votre agence web est là pour vous porter conseil.

Des questions sur notre méthodologie ? Vous souhaitez discuter de votre projet de site sous WordPress ?

Dans la même catégorie

wordpress oxygen builder ou elementor

WordPress : Oxygen vs Elementor

Guillaume Meyer - 21 septembre 2021

Sommaire Quels sont les différences entre un Theme Builder et un Page Builder ? Oxygen et Elementor Pro : quels sont leurs points communs [...]

comment faire webdesign agence web walk the line

La réalisation de webdesigns chez Walk The Line

Mélody Challier - 16 décembre 2020

Et si vous passiez en coulisses pour découvrir comment nous réalisons des webdesigns chez Walk The Line ? Parce que c'est vous, nous vous [...]

meilleures extensions wordpress partie 6

Les extensions incontournables pour WordPress – partie 7 (bonus)

Mélody Challier - 9 décembre 2020

Vous n'avez jamais pensé à ces plugins, pourtant, ils vont vous rendre de fiers services ! Profitez vite de ce petit cadeau par votre [...]