Ne fournit pas de contenu de remplacement lorsque JavaScript n'est pas disponible

L'amélioration progressive est une stratégie de développement Web qui permet de rendre votre site accessible au plus large public possible. Le principe de base est que le contenu et les fonctionnalités de base des pages ne doivent s'appuyer que sur les technologies Web les plus fondamentales. Les expériences améliorées, telles que l'ajout de styles sophistiqués en CSS ou l'interactivité avec JavaScript, peuvent être superposées aux navigateurs compatibles avec ces technologies. Toutefois, les fonctionnalités de base de la page et du contenu ne doivent pas dépendre de CSS ni de JavaScript.

Échec de l'audit des contenus de remplacement Lighthouse

Lighthouse signale les pages qui n'incluent pas certains contenus lorsque JavaScript n'est pas disponible:

Audit Lighthouse indiquant que la page ne présente aucun contenu lorsque JavaScript est indisponible

Lighthouse désactive JavaScript sur la page, puis inspecte son code HTML. Si le code HTML est vide, l'audit échoue.

Comment vérifier que votre page comporte du contenu sans JavaScript

L'amélioration progressive est un sujet vaste et controversé. Un camp indique que, pour respecter la stratégie d'amélioration progressive, les pages doivent être superposées de sorte que le contenu et les fonctionnalités de base ne nécessitent que du code HTML. Pour un exemple de cette approche, consultez l'article Progressive Improve: What It Is, And How To Use It de Smashing Magazine pour découvrir un exemple de cette approche.

Un autre camp estime que cette approche stricte est inutilisable ou inutile pour de nombreuses applications Web modernes à grande échelle et suggère d'utiliser le CSS de chemin critique intégré dans le document <head> pour les styles de page absolument critiques.

Compte tenu de ces éléments, cet audit de Lighthouse effectue une vérification simple pour s'assurer que votre page n'est pas vide lorsque JavaScript est désactivé. Le degré de respect de l'amélioration progressive de votre application fait l'objet de débats. Cependant, tout le monde s'accorde pour dire que toutes les pages doivent afficher au moins certaines informations lorsque JavaScript est désactivé, même si le contenu signale simplement à l'utilisateur que JavaScript est requis pour utiliser la page.

Pour les pages qui doivent absolument s'appuyer sur JavaScript, une approche consiste à utiliser un élément <noscript> pour avertir l'utilisateur que JavaScript est requis pour la page. C'est mieux qu'une page vierge, car elle ne permet pas aux utilisateurs de savoir s'il y a un problème au niveau de la page, de leur navigateur ou de leur ordinateur.

Pour voir l'apparence et les performances de votre site lorsque JavaScript est désactivé, utilisez la fonctionnalité Désactiver JavaScript des outils pour les développeurs Chrome.

Ressources