Retour au blog
Partager l'article
Feja - twitterFeja - Linkedincopy clipboard

Checklist - Setup d’un site web

François De Sousa
11 Oct, 2022
-
8 min de lecture

Les sites Web étant plus complexes, plus hiérarchisés et plus riches en fonctions que jamais, les développeurs sont soumis à une pression croissante pour écrire un meilleur code dans des délais plus courts. Les clients exigent des fonctionnalités améliorées, des visuels exceptionnels et l'excellence technique. Si leurs demandes ne sont pas satisfaites, il leur est assez facile de passer à un concurrent. Par conséquent, les développeurs de sites Web doivent fréquemment concevoir, coder et mettre en œuvre de nouvelles offres sur les sites Web pour éviter la perte de trafic, de revenus et de crédibilité.

Avec une telle charge de travail, il est difficile de suivre tous les contrôles et vérifications à effectuer avant de lancer un site ou une application Web. Cet article présente une liste de contrôle pour le lancement d'un site Web à laquelle les développeurs, les testeurs et les concepteurs peuvent se référer avant de pousser les sites vers le public.

Résumé

  • 10-Step Website Setup Checklist
  • Website Launch Checklist
  • Utiliser un design propre et attrayant
  • Mettre en œuvre et tester la fonctionnalité multi-navigateurs
  • S'assurer que la vitesse du site est constamment élevée
  • Privilégiez l'utilisation de visuels multi-appareils.
  • Mettre en œuvre des mesures de sécurité fiables
  • Se concentrer sur l'optimisation des moteurs de recherche (SEO)
  • Mettre en place un système d'analyse pour la collecte de données

10-Step Checklist

Il y a un certain nombre de choses que vous devez faire avant de configurer votre site Web. Vous trouverez ci-dessous les points que vous devez vérifier dans la liste de contrôle de la configuration de votre site Web.

  • Avez-vous configuré votre certificat SSL ? Fonctionne-t-il correctement ?
  • Votre CMS est-il à jour ?
  • Avez-vous une solution pour sauvegarder les données ?
  • Avez-vous finalisé votre solution analytique et l'avez-vous intégrée ?
  • La copie est-elle prête ?
  • Avez-vous vérifié le contenu de toutes les pages ?
  • Avez-vous vérifié votre Sitemap XML ?
  • Avez-vous ajouté des méta titres et des méta descriptions pour toutes les pages ?
  • Avez-vous généré le fichier robots.txt ?
  • Avez-vous vérifié si le site est conforme à la législation ?

Website Launch Checklist

Le lancement d'un site Web n'est pas une mince affaire. Cette liste de contrôle du lancement d'un site Web vous aidera à vous assurer que tout est en place pour créer et lancer votre site.

1. Utiliser un design propre et attrayant

Le site Web doit être visuellement attrayant, fournir des instructions faciles à suivre et permettre une navigation sans effort. Tout au long des sessions de feedback du client et des itérations de conception, gardez les points suivants à l'esprit :

Textes

  • La police de caractères est-elle cohérente et facile à lire ?
  • Est-il exempt de plagiat, de problèmes d'orthographe et de grammaire ?
  • Les titres, sous-titres et corps de texte sont-ils clairement visibles et de taille précise ?
  • Les formats italiques et gras sont-ils incorrects ?
  • Tous les liens du texte sont-ils opérationnels ?

Palette de couleurs

  • La palette de couleurs est-elle harmonieuse et agréable à l'œil ? (Cela nécessite des tests d'expérience utilisateur).
  • Des échantillons globaux ont-ils été utilisés ?

Espacement

  • Les espaces sont-ils cohérents dans tout le contenu du site ?
  • Tous les éléments ont-ils la possibilité de paraître indépendants et de se démarquer ?

Images & illustrations

  • Certaines images sont-elles floues, pixellisées ou insuffisamment visibles ?
  • Certaines images sont-elles cassées ?
  • La taille des fichiers d'images est-elle trop importante pour permettre un chargement à faible vitesse sur Internet ?
  • Les images non décoratives ont-elles des balises alt ? Tous ces éléments sont particulièrement importants pour le logo du site Web.

Shadows

  • Si des drop shadow ont été utilisées, la source de lumière est-elle cohérente pour toutes ces ombres ?
  • Les valeurs d'opacité, de flou et d'étalement sont-elles compatibles avec le schéma visuel dans son ensemble ?

Navigation

  • Un utilisateur peut-il facilement naviguer d'une page à l'autre ?
  • Tous les liens pertinents sont-ils visibles et explicites ?
  • L'utilisateur se heurte-t-il à des impasses en naviguant sur le site ?

Vérifiez également si le HTML/CSS s'affiche comme prévu. Les URL doivent être descriptives, les pages 404 doivent être informatives, les domaines canoniques doivent fonctionner et JavaScript doit être exempt d'erreurs lors du chargement de la page.

2. Mettre en œuvre et tester la fonctionnalité multi-navigateurs

Attendez-vous à ce qu'un site Web soit consulté à partir de plusieurs navigateurs et de plusieurs versions de chaque navigateur. Le site web devra s'afficher parfaitement sur chaque navigateur et chaque version de navigateur, compte tenu de leurs diverses variations techniques et de leurs particularités. La seule façon de s'en assurer est d'effectuer des tests complets sur des navigateurs et des appareils réels. Les testeurs doivent vérifier le rendu et le fonctionnement du site Web dans les conditions réelles de l'utilisateur, ce qui nécessite des tests sur plusieurs combinaisons uniques navigateur-appareil-OS.

Étant donné qu'il existe au moins 63 000 combinaisons possibles navigateur-plateau-appareil dans l'usage courant, les équipes d'assurance qualité doivent avoir accès à un vaste laboratoire d'appareils sur site (constamment mis à jour avec de nouveaux appareils) pour effectuer des tests de compatibilité entre navigateurs satisfaisants.

Toutes les organisations n'ont pas les moyens financiers ou les ressources humaines nécessaires pour mettre en place et entretenir un tel laboratoire, et elles n'ont pas à le faire. Elles peuvent utiliser BrowserStack, une plateforme de test basée sur le cloud qui offre un accès à un véritable cloud de plus de 3000 navigateurs et appareils réels. Qu'il s'agisse de tests manuels ou de tests automatisés, les testeurs peuvent utiliser l'infrastructure de BrowserStack pour obtenir des résultats 100 % précis dans des circonstances réelles. Les testeurs peuvent également utiliser les frameworks Selenium, Cypress, Playwright et Puppeteer sur des versions réelles du navigateur.

Les tests inter-navigateurs sont un aspect non négociable de la liste de contrôle. Si un site Web ne s'affiche pas parfaitement sur tous les principaux navigateurs, il aliène les utilisateurs potentiels, ce qui entraîne une perte de trafic et de revenus potentiels.

3. S'assurer que la vitesse du site est constamment élevée

47% des consommateurs s'attendent à ce qu'une page web se charge en 2 secondes ou moins. 40 % des personnes abandonnent un site Web qui prend plus de 3 secondes à charger.

À la lumière de ces chiffres, la vitesse est un élément essentiel de la feuille de route du succès d'un site Web. Les testeurs doivent notamment vérifier la vitesse de chargement du site sur différents navigateurs et appareils. Exécutez gratuitement des tests de vitesse de sites Web sur BrowserStack SpeedLab pour vérifier comment un site se charge sur des combinaisons réelles de navigateurs et d'appareils populaires.

Lorsque vous effectuez des tests de vitesse, il est essentiel de garder à l'esprit les paramètres suivants :

  • Time to First Byte (TTFB): Le TTFB est le temps qui s'écoule entre le moment où un utilisateur saisit l'URL du site dans son navigateur et celui où le navigateur reçoit le premier octet de données auquel le serveur répond. Selon Moz, "une corrélation claire a été identifiée entre la diminution du rang de recherche et l'augmentation du temps de réception du premier octet". Idéalement, le TTFB devrait être inférieur à 200 millisecondes.
  • Time to First Draw (TTFD): Le TTFD est le temps qu'il faut à un utilisateur pour voir la première partie du contenu lorsqu'il ouvre un site web. Idéalement, il devrait être inférieur à une seconde.
  • Time to Usability: Il s'agit du temps nécessaire pour qu'un site web devienne entièrement visible et fonctionnel, c'est-à-dire que les utilisateurs peuvent faire défiler, cliquer, afficher le contenu et interagir avec tous les éléments du site. Idéalement, ce délai ne devrait pas dépasser 2 à 3 secondes.

4. Privilégiez l'utilisation de visuels multi-appareils.

Un site Web peut fonctionner parfaitement sur plusieurs combinaisons navigateur-appareil. Toutefois, étant donné que des milliers d'appareils de tailles et de résolutions d'écran différentes sont utilisés dans le monde, il y a de fortes chances que le site ne s'affiche pas correctement sur certains écrans.

Browserstack en parle sur cet article : Quelle est la taille d'écran idéale pour le responsive design ?

Pour éviter cela, les développeurs web doivent mettre en œuvre un design responsive et vérifier l'efficacité de ce design réactif sur différents appareils réels. Pour ce faire, les testeurs doivent une fois de plus recourir à des appareils réels.

Ils peuvent utiliser le responsive design checker gratuit de Google situé dans les outils de développement pour vérifier sur des appareils populaires tels que l'iPhone X, le Galaxy Note 10, l'iPhone 8 Plus, le Galaxy S9 Plus, et plus encore.

5. Mettre en œuvre des mesures de sécurité fiables

Avec la numérisation généralisée de la vie quotidienne, les utilisateurs sont plus conscients que jamais de la sécurité de leurs données. Chaque site web devrait au moins avoir activé les mesures suivantes :

  1. SSL (Secured Socket Layer): Si un site a l'intention de recueillir des données sensibles sur les utilisateurs, telles que des informations financières et des détails personnels (comme l'adresse et la date de naissance), il doit disposer d'un certificat SSL (Secured Socket Layer).
  2. Anti-malware Plugin: À ce stade, les utilisateurs ne devraient pas avoir à faire face à des menaces de logiciels malveillants. Trouvez des plugins anti-malware appropriés pour combattre les attaques et vérifiez régulièrement leur efficacité.
  3. HTTPS: N'oubliez pas que la plupart des principaux navigateurs signalent tous les sites Web non HTTPS comme non sécurisés, ce qui incite la plupart des utilisateurs à rebondir dès qu'ils arrivent sur la page. Utilisez uniquement HTTPS. Le protocole HTTP doit toujours être redirigé vers le protocole HTTPS, sinon les données de l'utilisateur sont en danger.

6. Se concentrer sur l'optimisation des moteurs de recherche (SEO)

Quelques chiffres intéressants provenant du Rapport Marketing 2022 de Hubspot

  • Environ 64% des spécialistes du marketing ont investi dans le référencement
  • 25 % des entreprises déclarent que l'optimisation mobile est leur principale tactique de référencement et 50 % d'entre elles utilisent des mots-clés stratégiques comme principale stratégie de référencement.

Voici quelques incontournables pour tirer une meilleure valeur du référencement d'un site :

  • Les robots d'exploration analysent le contenu d'un site pour comprendre comment il doit être affiché pour les visiteurs et les aider à trouver un site plus facilement. Pour les aider à explorer et à afficher le contenu dans le format prévu, utilisez les balises sémantiques appropriées : h1-h6 (balises de titre), p (balises de paragraphe), ul/ol (listes ordonnées et non ordonnées). Incorporez les balises sémantiques HTML5 pour améliorer les performances de référencement et l'accessibilité des utilisateurs.
  • Les balises Meta SEO, qui comprennent le méta titre et la méta description, aident les robots d'exploration à comprendre le contenu de la page. Le méta titre doit décrire le sujet de la page, inclure des mots-clés importants et être inférieur à 65 caractères. La méta-description doit comporter moins de 160 caractères, décrire davantage le contenu de la page, inclure des mots-clés et cibler les lecteurs humains, et non le moteur de recherche.
  • Assurez-vous qu'il n'y a pas de liens brisés, car ils dégradent le score de référencement de la page.
  • Vérifiez avec Google Webmaster Tools si la page est recherchée correctement par Google.
  • Le site doit figurer sur la première page des pages de résultats de recherche (SERP), idéalement dans les 5 premiers résultats.
  • Les pages Web doivent contenir les balises OpenGraph correctes pour le partage social.

7. Mettre en place de l’Analytics pour la collecte de données

Intégrer votre site à Google Analytics pour consulter ses performances.

Les développeurs ne peuvent pas optimiser le site sans recueillir des données pertinentes (quels sont les appareils utilisés pour accéder au site, les pays d'où provient la majorité du trafic, les pages du site qui reçoivent le plus de visiteurs, etc.) En l'absence d'une optimisation continue, le site perdra des utilisateurs et sa valeur de référencement diminuera.

Cette liste de contrôle du lancement d'un site Web détaille les éléments de base que les développeurs, les testeurs et les concepteurs doivent examiner avant la publication d'un site. En fonction de la nature du site, d'autres éléments spécifiques peuvent devoir être vérifiés avant la publication. Toutefois, les éléments de cette liste sont des éléments essentiels à ne pas manquer, quel que soit le déploiement du site Web. Gardez cette liste à portée de main lors des vérifications finales, et les risques d'erreurs courantes seront considérablement réduits.

Feja logo
Feja - Linkedin
Rejoignez-nous sur les réseaux sociaux.