Astuces concernant les outils de développement: identifier les améliorations CSS

Sofia Emelianova
Sofia Emelianova

Le panneau CSS Overview (Aperçu CSS) de DevTools vous permet de trouver d'un coup d'œil les améliorations CSS potentielles sur votre page.

Pour obtenir un rapport, ouvrez DevTools > Plus. > Autres outils > Vue d'ensemble CSS, puis cliquez sur Capturer une vue d'ensemble.

Le rapport comporte plusieurs sections:

  • Résumé avec des statistiques sur les styles, les sélecteurs et les requêtes multimédias.
  • Répartition des couleurs utilisées, y compris les problèmes de contraste, les problèmes les plus courants sur le Web.
  • Répartition des polices utilisées avec des statistiques sur la taille, l'épaisseur et la hauteur de ligne.
  • Déclarations CSS inutilisées.
  • Statistiques sur les requêtes multimédias triées par nombre d'occurrences dans l'ordre décroissant.

Pour une expérience d'apprentissage plus pratique, consultez Présentation du CSS: identifier les améliorations potentielles du CSS.

Pour en savoir plus sur les problèmes de contraste, consultez Rendre votre site Web plus lisible.