Pour faire la recette du site, mieux vaut :
- se munir de 2 ou 3 navigateurs a minima !
- vider la mise en cache avant de procéder à l’opération.
- contrôler le nouveau site sur plusieurs devices (tablette, mobile, desktop)
- utiliser un outil d’assistance comme Markup.io pour rassembler les anomalies identifiées lors du recettage.
Chic, une bonne vieille recette de grand-mère ! 🥘 Ahem, si vous pensiez trouver ici des astuces de cuisine, c’est raté.
En revanche, si vous pensiez atterrir sur un article donnant toutes les clés pour réussir un super site web, vous êtes au bon endroit !
Même si vous n’aviez pas tout à fait employé le mot recette au sens propre du terme. 😅
Commençons cette lecture par une petite définition…
→ Le recettage d'un site web (ou la recette) l’une des dernières étapes d’une refonte de site ou d’une première création. L’objectif est de vérifier, qu’une fois l’intégration terminée, le site soit bel et bien conforme à vos attentes. En d’autres termes, il s’agit de tester le site en long, en large et en travers pour vérifier que tout fonctionne correctement.
L’erreur est humaine. Lors de la phase d’intégration, il peut y avoir des oublis, erreurs qui seront vues en phase de recette. Lors de la phase de conception, tout n’est pas totalement spécifié. Il y a des comportements ou enchaînements que le concepteur pense évident et qui a été compris différemment par l’intégrateur. La recette permet de rectifier le tir.
Durant la phase de recettage, vous allez pouvoir déceler :
La recette nécessite donc toute la vigilance du monde ! 👀 Faire appel à d’autres personnes pour vous aider dans cette tâche n’est pas un luxe. Cela permet de ne rien laisser passer et de traiter la tâche plus rapidement.
Pour les projets d’une certaine taille, ce sont des métiers rompus à l’exercice qui accomplissent cette phase. Il y a également des organisations dédiées à la recette, processées et outillées pour que ce soit en agence ou en interne le plus souvent dans les directions informatiques des entreprises.
La phase de recette s’inscrit dans un cycle projet. Il y a aujourd’hui deux grands types de méthode (en V et agile) qui conditionnent l’exercice de la recette.
La méthode en V, plébiscitée depuis de longues années dans le secteur industriel et plus récemment en informatique, consiste à développer un projet d’un seul tenant, depuis l’expression des besoins jusqu’à la phase de livraison du produit. Elle se déroule en 2 phases majeures :
Ces 2 phases, représentées chacune par une branche du V et elles-mêmes subdivisées en 9 étapes, finissent comme pour la lettre V par se rejoindre.
Une fois la phase de conception achevée, les équipes pivotent pour amorcer la phase de validation (tests unitaires, tests de régression, tests d’intégration).
La méthode se veut gage de qualité voire de simplicité. Elle permet de suivre le projet de façon linéaire, de répartir et d’identifier les missions entre les équipes plus simplement (ce qui peut toutefois entraîner des problèmes de communication en interne).
L’autre méthode pour mener son projet est la méthode agile. Souvent désignée comme l’antithèse de la méthode en V, cette méthode consiste à concevoir un service par itération (sprint). Les corrections sont apportées à l’issue des sprints et n’attendent pas la fin du projet.
Dans le cas d’un recettage en méthode agile, les phases de recette sont plus nombreuses et portent sur les user stories décrites.
Voyons maintenant ensemble quelles sont les différentes étapes du recettage.
Nous allons nous donner quelques principes, en considérant que vous êtes seul sur le projet (car de petite envergure).
Pour faire la recette du site, mieux vaut :
Durant cette toute première étape, il vous faut vérifier que les fonctionnalités demandées se réalisent bien. Les fonctionnalités sont parfois complexes :
Et peuvent être plus simples :
Tout est primordial dans votre site, mais un fonctionnel balbutiant sera soumis plus facilement à la critique et l’apparition d’avis négatifs. Vous devez donc vous assurer que tout fonctionne parfaitement et surtout RE-TEST-TER à chaque modification pour vérifier qu’il n’y a pas de régression.
Un outil de test automatisé de type Saas pourra prendre tout son sens sur des dispositifs riches.
Cette étape doit s’opérer sur a minima 5 grands types de devices :
Si vous n’avez pas le temps, limitez-vous au support le plus souvent utilisé par vos personas (Cette information peut par exemple s’obtenir sur Google analytics).
Prenez votre temps. Inutile de vous hâter dans l’espoir de vous débarrasser de la phase de recettage. Il est possible que de tout petit élément n’apparaissent pas de la façon voulue. Attardez-vous sur chaque détail. L’interface doit correspondre aux résultats prévus sur les maquettes de conception.
Nous vous conseillons fortement de travailler sur 2 écrans avec sur l’un, la version maquettée, et sur l’autre, la version intégrée. Pour les devices mobiles, tablettes & Cie, l’idéal est de le faire sur un vrai terminal. Maintenant sachez que des émulateurs existent. Vous pouvez trouver des extensions chrome ou des produits plus abouties et payants comme Browerstack.
N’oubliez pas les images. Si le site et son design sont parfaits mais que celles-ci sont étirées, floues, déformées, aucun intérêt ! Leur format doit être tel que vous l’imaginez.
Votre header, les ancres, les éléments du footer… Tout doit être linké ! 🔗
Si vous avez réalisé un travail de maillage interne pour optimiser votre référencement naturel et que vous disposez de CTA (boutons d’appel à l'action) un peu partout sur votre site web (espérons-le), nous ne pouvons que vous encourager à tous les tester un par un. Y compris ceux qui redirigent vers vos réseaux sociaux ou votre chaîne YouTube !
Un lien rompu (erreur 404) a de grandes chances de pousser vos clients à déserter votre site web. Courage, cette opération demande du temps mais est nécessaire pour garantir la satisfaction de vos utilisateurs. Utilisez un crawler pour gagner du temps et repérer les éventuels liens morts.
Pour éviter d’avoir à rouvrir la même page plusieurs fois depuis votre navigateur, dans le cas où elle contiendrait de nombreux liens, utilisez la fonction clic droit de votre souris pour ouvrir les contenus dans un nouvel onglet.
L’audit technique consiste à vérifier que le site est “propre”.
Contenu en lien : 4 conseils pour optimiser les images de votre site web 🚀
En résumé, investiguez dans chaque recoin de votre site et traquez le moindre petit défaut qui fait tache ! 😄
Pour gagner du temps, faites passer un crawler sur le nouveau site, vous aurez rapidement tous les warnings en visu.
On les oublie souvent et pourtant, ces petites pages sont obligatoires. Leur affichage doit être instantané et clair. Ces pages doivent être repérables en un clin d'œil. Profitez-en pour contrôler leur lisibilité.
La masse de contenus présents y est souvent très importante :
- Séparez vos textes en plusieurs paragraphes distincts
- Ordonnez la structure par un balisage html réussi.
Enfin depuis 2021, la réglementation concernant la gestion du consentement concernant les cookies s’est renforcée. Assurez-vous que tous les cookies non techniquement obligatoires sont soumis à un dépôt suivant une autorisation explicite et éclairée.
Pour en savoir plus sur le sujet, allez à la source https://www.cnil.fr/fr/cookies-et-autres-traceurs ou contactez-nous.
Vous avez examiné votre site internet sous toutes les coutures, avez peut-être relevé des failles et les avez corrigées. Et maintenant, que faire ?
Premièrement, félicitez-vous ! Vous venez d’arriver au bout d’un travail de longue haleine et vous pouvez être fier de vous.
Deuxièmement, communiquez sur vos réseaux et annoncez officiellement la sortie de votre nouveau site ! Exposez-le fièrement sur votre compte LinkedIn, Facebook ou où que vous voulez pour montrer à votre communauté votre talent (même si ce n’est pas vous qui pilotiez le projet 😉 Qu’importe, susciter l’admiration ne mange pas de pain).
Enfin :
“Last but not least !”
La phase de recettage est une étape incontournable dans tout projet de refonte de site. Pour être réussie, vous devez faire preuve de vigilance et testez le site sur plusieurs supports, plusieurs aspects, plusieurs navigateurs et avec le soutien de plusieurs de vos collaborateurs ! 😉
OU
