DevTools-tips: Identificeer CSS-verbeteringen

Sofia Emelianova
Sofia Emelianova

In het CSS-overzichtspaneel in DevTools kunt u in één oogopslag potentiële CSS-verbeteringen op uw pagina vinden.

Om een ​​rapport te krijgen, opent u DevTools > Meer. > Meer tools > CSS-overzicht en klik op Overzicht vastleggen .

Het rapport toont u verschillende secties:

  • Een samenvatting met statistieken over stijlen, selectors en mediaquery's.
  • Een overzicht van gebruikte kleuren, inclusief contrastproblemen : de meest voorkomende problemen op internet .
  • Een overzicht van gebruikte lettertypen met statistieken over grootte, gewicht en lijnhoogte.
  • Ongebruikte CSS-declaraties.
  • Statistieken over mediaquery's gesorteerd op aantal keren dat ze voorkomen, in aflopende volgorde.

Voor een meer praktische leerervaring, zie CSS-overzicht: potentiële CSS-verbeteringen identificeren .

Zie Uw website leesbaarder maken voor meer informatie over contrastproblemen.