Hjemmeside » Toolkit » 4 verktøy for revisjon og optimalisering av CSS

    4 verktøy for revisjon og optimalisering av CSS

    Når nettstedet ditt begynner å vokse, så vil koden din. Etter hvert som koden din utvides, kan CSS plutselig bli vanskelig å vedlikeholde, og du kan ende opp med å overskrive en CSS-regel med en annen. Dette kompliserer ting, og du vil nok ende opp med mange bugs.

    Hvis dette skjer med deg, er det tid for deg å Kontroller nettstedets CSS. Ved å revidere CSS vil du kunne identifisere deler av CSS som ikke er optimalisert. Du kan også redusere stilarket filstørrelsen ved å eliminere linjer med kode som senker ytelsen til nettstedet ditt.

    Her er 5 gode verktøy for å hjelpe deg med å revidere og optimalisere CSS.

    Type-o-matic

    Type-o-matic er en Firebug-plugin for å analysere skrifter som brukes på et nettsted. Denne plugin gir en visuell rapport i et bord, som bærer skriftegenskaper som skrifttypefamilien, størrelsen, vekten, fargen og antall ganger fonten brukes på nettsiden. Gjennom rapporttabellen kan du enkelt optimalisere skriftbruken, fjerne det som er unødvendig, eller kombinere stiler som er altfor like.

    CSS Lint

    CSS Lint er en linting verktøy som analyserer CSS-syntaksen basert på bestemte parametere som adresserer for ytelse, tilgjengelighet og kompatibilitet til CSS. Du ville bli overrasket med resultatene, forvent mange advarsler i CSS. Disse feilene vil imidlertid til slutt hjelpe deg med å fikse CSS-syntaksen, og gjøre den mer effektiv. I tillegg vil du også være en bedre CSS-skribent.

    CSS ColorGuard

    CSS ColorGuard er et relativt nytt verktøy. Den er bygget som en nodemodul, og den går over alle plattformer: Windows, OS X og Linux. CSS ColorGuard er et kommandolinjeverktøy som vil varsle deg om du bruker lignende farger i stilarket ditt; f.eks. # f3f3f3 er ganske nært # f4f4f4, så du vil kanskje vurdere å slå sammen de to. CSS ColorGuard kan konfigureres, du kan angi likestærskelen, og sette fargene du vil at verktøyet skal ignorere.

    CSS Dig

    CSS Dig er et Python-skript og fungerer lokalt på datamaskinen din. CSS Dig vil gjennomføre en grundig undersøkelse i CSS. Det vil lese og kombinere egenskaper, f.eks. Alle bakgrunnsfarger vil gå under bakgrunnsseksjonen. På den måten kan du enkelt ta beslutninger basert på rapporten når du prøver å standardisere CSS-syntaksen din, for eksempel Du kan finne farge på tvers av stiler med følgende fargedeklarasjon.

     farge: #ccc; farge: #cccccc; farge: #CCC; farge: #CCCCCC; 

    Disse fargedeklarasjonene gjør det samme. Du kan like godt gå med #ccc eller med hovedstaden #CCC som standard. CSS Dig kan avsløre denne redundansen for andre CSS egenskaper, og du vil kunne gjøre koden din mer konsistent.