Comment s'assurer que les fonctionnalités de base de votre site Web sont toujours disponibles, accessibles, sécurisées, utilisables, détectables et rapides.
Cette page fournit des conseils pour vous aider à vous assurer que votre site Web est disponible, accessible, sécurisé et utilisable par tous, à tout moment.
Les conseils de cette page proviennent d'un ensemble d'équipes interfonctionnelles de Google qui réorientent leurs priorités à court terme pour soutenir les sites Web qui aident les utilisateurs à se protéger pendant la pandémie de COVID-19. Ces Googlers ont constaté que les sites sont confrontés à une augmentation sans précédent de la demande de la part de personnes recherchant des informations essentielles, dont beaucoup ont rarement ou jamais utilisé le Web auparavant. Il peut être difficile de s'assurer que les sites sont disponibles pendant cette période et accessibles à tous.
Conseils
Disponibilité, fiabilité, résilience et stabilité
Si votre site rencontre des pics de trafic et qu'il ne fonctionne pas, ou si vous souhaitez éviter qu'il ne fonctionne pas, les conseils ci-dessous peuvent vous aider à résoudre rapidement les problèmes ou à les détecter avant qu'ils ne deviennent des problèmes majeurs.
- Consultez Résoudre des problèmes de surcharge de serveur pour découvrir comment détecter, atténuer et prévenir les problèmes de pics de trafic.
- Supprimez les images, vidéos, scripts et polices inutiles. Assurez-vous que chaque page se concentre uniquement sur la fonctionnalité dont les utilisateurs de votre site ont réellement besoin.
- L'optimisation de vos images peut réduire considérablement l'utilisation de la bande passante de votre serveur, car les images sont la principale source de surcharge sur le Web.
- Déchargez autant de contenu statique que possible vers des CDN. Plus d'informations sur les fournisseurs courants : AWS, Azure, Cloudflare, Google Cloud, Firebase.
- Vérifiez si votre CDN propose des optimisations faciles à activer, telles que la compression dynamique des images, la compression du texte ou la minimisation automatique des ressources JS et CSS.
- L'optimisation de la mise en cache HTTP peut réduire considérablement les demandes sur vos serveurs avec un minimum de modifications du code. Consultez Le cache HTTP : votre première ligne de défense pour une présentation, ainsi que Mise en cache HTTP et Bonnes pratiques de mise en cache pour des recommandations spécifiques. L'audit Diffuser des éléments statiques avec une règle de mise en cache efficace dans Lighthouse peut vous aider à détecter rapidement les ressources qui ne sont pas mises en cache. N'oubliez pas que les différents types de ressources ont des exigences de fraîcheur différentes et nécessitent donc des stratégies de mise en cache différentes.
- Les service workers sont un autre moyen de réduire considérablement les demandes sur vos serveurs, mais ils peuvent nécessiter un investissement technique important. Ils permettent également à votre site Web de fonctionner hors connexion, ce qui vous permet de présenter les horaires d'ouverture, les numéros de téléphone et d'autres informations aux utilisateurs connus sans connexion. Workbox est l'approche recommandée pour ajouter des service workers aux sites Web, car elle automatise une grande partie du code récurrent, facilite le respect des bonnes pratiques et évite les bugs subtils qui sont courants lorsque vous utilisez directement l'API
ServiceWorkerde bas niveau. - Si l'utilisation de votre site augmente considérablement, vérifiez que vous disposez d'une protection adéquate contre les attaques DDoS, car votre site peut désormais être une cible plus attrayante. Pour en savoir plus sur les fournisseurs courants : AWS, Azure, Cloudflare, Google Cloud.
Pour en savoir plus, consultez Fiabilité du réseau.
Accessibilité
Il est plus important que jamais de se concentrer sur l'accessibilité, car un plus grand nombre de personnes ayant des besoins variés sont susceptibles d'accéder à votre site. Suivez les consignes ci-dessous pour vous assurer que la fonctionnalité de base de votre site Web est accessible à tous.
- L'accessibilité est un travail d'équipe, et chacun a un rôle à jouer. Commencez par consulter le guide d'accessibilité pour les équipes de Google, ainsi que le guide d'équipe de l'U.S. Digital Service. Ces guides expliquent ce que chaque membre de l'équipe (responsables produit, ingénieurs, concepteurs, QA, etc.) peut apporter.
- Effectuez un examen de l'accessibilité pour déterminer ce qui fonctionne bien et ce qui doit être amélioré. Les extensions de navigateur WAVE peuvent vous aider à effectuer un audit manuel de l'accessibilité de votre site.
- Lisez les guides d'accessibilité pour mieux comprendre des sujets spécifiques tels que la navigation au clavier et la compatibilité avec les lecteurs d'écran.
- Exécutez un audit Lighthouse pour détecter les problèmes d'accessibilité courants. Le rapport fournit également une liste de vérifications manuelles que vous pouvez effectuer pour améliorer l'exploitabilité de votre site. Notez qu'un score d'accessibilité de 100 ne garantit pas que votre site est accessible. Il existe de nombreux problèmes importants que Lighthouse ne peut pas tester de manière automatisée. Il est donc toujours important d'effectuer des examens manuels. L'API WAVE et l'extension AXE sont d'autres outils d'audit automatisés.
- Suivez le cours Start Building Accessible Web Applications Today (Commencer à créer des applications Web accessibles dès aujourd'hui) sur egghead.io ou consultez le cours Web Accessibility (Accessibilité Web) sur Udacity.
- Regardez la playlist A11ycast pour obtenir d'autres conseils rapides sur des sujets spécifiques liés à l'accessibilité.
Identité, sécurité et confidentialité
Il peut être tentant de prendre des raccourcis pour déployer des correctifs critiques, mais veillez toujours à ne pas créer de failles de sécurité. Les utilisateurs doivent pouvoir accéder à des contenus sur des sujets extrêmement privés. Les sites Web doivent protéger à tout prix ces données utilisateur sensibles et convaincre les internautes que leurs informations permettant de les identifier personnellement sont en sécurité.
- Découvrez pourquoi tous les sites Web doivent être protégés par le protocole HTTPS, et pas seulement ceux qui traitent des informations permettant d'identifier personnellement l'utilisateur.
- Passez à un fournisseur d'hébergement qui utilise HTTPS par défaut, ou utilisez Let's Encrypt ou des services similaires pour activer HTTPS sur vos serveurs.
- Consultez Explication des cookies SameSite pour savoir comment sécuriser l'utilisation des cookies. Notez que l'application de l'étiquetage des cookies SameSite a été temporairement annulée.
Pour en savoir plus, consultez Sûr et sécurisé.
Ergonomie, UI et UX
Les utilisateurs se fient de plus en plus au Web pour répondre à leurs besoins de base. Beaucoup d'entre eux n'utilisent pas souvent le Web. Il est utile d'auditer la facilité d'utilisation des fonctionnalités de base de votre site et de vous assurer qu'elles sont aussi simples et faciles à utiliser que possible.
- Envisagez d'ajouter une bannière bien visible (qui peut être supprimée à l'aide d'un bouton X) en haut de votre site Web pour communiquer clairement les modifications apportées à vos services. Utilisez un incitation à l'action dans la bannière pour rediriger les utilisateurs vers des ressources plus spécifiques. Envisagez d'utiliser des couleurs et des polices distinctes qui se démarquent du reste du contenu de votre page. Vos textes doivent être empathiques, axés sur les besoins des utilisateurs et transparents quant au type de service auquel ils peuvent s'attendre.
- Recherchez des opportunités permettant de minimiser les interactions physiques dans vos critical user journeys (CUJ) et suggérez ces modifications à votre équipe produit. Par exemple, si votre service de livraison exige habituellement une signature, voyez s'il est possible de contourner cette exigence.
- Vérifiez que vos CUJ sont aussi simples et intuitifs que possible, et suggérez des modifications à votre équipe produit si vous voyez des opportunités d'amélioration.
- Passez en revue les principes d'une bonne conception mobile et testez vos parcours utilisateur critiques sur différents appareils mobiles pour vous assurer qu'il n'y a pas de problèmes flagrants. Les personnes qui n'utilisent pas souvent le Web et qui se retrouvent soudainement à devoir l'utiliser davantage accèdent probablement à votre site depuis des appareils mobiles.
- Refactorisez votre site pour utiliser autant que possible des modèles de responsive design.
- Assurez-vous que vos formulaires sont efficaces et bien conçus.
SEO
Les utilisateurs recherchent des informations essentielles sur la santé et l'emploi. Il est important de vous assurer que vos sites sont détectables par tous les moteurs de recherche. Les audits SEO Lighthouse peuvent vous aider à détecter les problèmes de base. Suivez les blogs officiels des moteurs de recherche pour obtenir les dernières instructions et mises à jour : Google, Bing, Baidu, DuckDuckGo, Yandex. Posts récents liés à la COVID-19 :
- Comment modifier vos activités en ligne tout en minimisant l'impact sur votre présence dans la recherche Google
- Nouvelles propriétés pour les événements virtuels, reportés et annulés
- Bing adopte le balisage schema.org pour les annonces spéciales concernant la COVID-19
- Ajouter des données structurées aux communiqués sur la COVID-19
- Aider les organismes de santé à faciliter l'accès aux informations sur la COVID-19
- Bonnes pratiques générales pour la recherche sur les sites gouvernementaux et de santé
Pour en savoir plus, consultez Détectable.
Performances
Certains FAI (en Inde, par exemple) constatent une forte augmentation de l'utilisation d'Internet à domicile et ne disposent pas de l'infrastructure nécessaire pour répondre à cette demande accrue. Dans ce genre de situation, la vitesse de votre site Web peut ralentir sans que vous n'y soyez pour rien. L'optimisation des performances de chargement peut être un moyen de compenser la réduction de la bande passante. En d'autres termes, en réduisant le nombre d'octets à envoyer sur le réseau pour charger vos pages, vous pouvez compenser l'impact d'une bande passante réduite sur les performances.
- Les images sont la première cause de surcharge sur le Web. Vous pouvez réduire considérablement l'utilisation de la bande passante de votre site Web en optimisant vos images. Squoosh est un outil de compression d'images Open Source simple qui peut vous aider à compresser rapidement vos images.
- Exécutez WebPageTest ou Lighthouse pour découvrir les principales opportunités d'amélioration des performances.
- Activez la compression de texte pour réduire la taille réseau des ressources textuelles. Il s'agit souvent d'un moyen simple d'améliorer les performances, qui nécessite un investissement technique minimal.
- Lisez Améliorer la vitesse d'un site Web de manière transversale pour découvrir comment collaborer avec d'autres services et obtenir leur adhésion.
- Utilisez le chargement différé standardisé pour les images afin de minimiser les requêtes pour les images que les utilisateurs ne verront peut-être jamais. La compatibilité avec les navigateurs n'est pas de 100 %, mais la fonctionnalité peut être traitée comme une amélioration progressive. En d'autres termes, si un navigateur ne prend pas en charge le chargement différé standardisé, l'image doit se charger normalement.
- Vérifiez si votre site comporte des scripts de test A/B ou de personnalisation qui peuvent être chargés de manière plus asynchrone, ou si les scripts contiennent des fonctionnalités non critiques qui peuvent être désactivées. Les scripts de test A/B et de personnalisation ne peuvent généralement pas être chargés complètement de manière asynchrone, car ils doivent s'exécuter avant le chargement du contenu de la page. Toutefois, il peut être possible de charger certaines parties des scripts de manière plus asynchrone. Consultez Chemin de rendu critique pour comprendre le compromis fondamental entre les scripts synchrones (également appelés scripts bloquant l'affichage) en général et le temps de chargement de la page, puis décidez si vous devez prioriser les scripts bloquant l'affichage par rapport au temps de chargement de la page, ou inversement.
- Le code tiers représente environ la moitié de toutes les requêtes pour la plupart des sites Web. Envisagez d'optimiser, de supprimer ou de désactiver temporairement le code tiers qui n'est pas essentiel au fonctionnement de votre site.
- Si les lancements de fonctionnalités sont dépriorisés, c'est peut-être le moment idéal pour faire du ménage. Supprimez les balises de vos gestionnaires de balises, nettoyez les fichiers CSS et JS trop volumineux, et supprimez les fonctionnalités ou le code obsolètes. L'onglet "Couverture" dans les outils pour les développeurs Chrome et la classe
Coveragedans Puppeteer peuvent vous aider à détecter le code inutilisé.
Pour en savoir plus, consultez Temps de chargement rapides.