4 CSS pārbaudes un optimizēšanas rīki
Tiklīdz jūsu vietne sāk augt, būs arī jūsu kods. Tā kā jūsu kods izplešas, CSS var pēkšņi kļūt grūti uzturēt, un jūs, iespējams, varēsiet pārrakstīt vienu CSS noteikumu ar citu. Tas sarežģī lietas, un jūs, iespējams, nonāksiet daudz kļūdu.
Ja tas notiek ar jums, jums ir pienācis laiks pārbaudīt vietnes CSS. CSS pārbaude ļaus jums identificēt CSS daļas, kas nav optimizētas. Jūs varat arī samazināt stilu failu lielumu, novēršot kodu rindas, kas palēnina jūsu vietnes veiktspēju.
Šeit ir 5 labie rīki, lai palīdzētu jums pārbaudīt un optimizēt CSS.
O-matic tipa
O-matic tipa ir Firebug spraudnis, lai analizētu fontus, kas tiek izmantoti tīmekļa vietnē. Šis spraudnis sniedz vizuālu pārskatu tabulā, kurā ir fonta īpašības, piemēram, fontu saite, izmērs, svars, krāsa un arī to, cik reizes fontā tiek izmantots tīmekļa lapā. Izmantojot atskaites tabulu, varat viegli optimizēt fontu lietošanu, noņemt nevajadzīgo vai apvienot stilu, kas ir pārāk līdzīgs.
CSS Lint
CSS Lint ir uzklāšana rīks, kas analizē CSS sintaksi, pamatojoties uz konkrētiem parametriem, kas risina jūsu CSS veiktspēju, pieejamību un saderību. Jūs būtu pārsteigts par rezultātiem, sagaidāt daudzus brīdinājumus savā CSS. Tomēr šīs kļūdas galu galā palīdzēs noteikt CSS sintaksi un padarīt to efektīvāku. Turklāt jums būs arī labāks CSS rakstnieks.
CSS ColorGuard
CSS ColorGuard ir salīdzinoši jauns rīks. Tā ir veidota kā mezgla modulis un tā darbojas visās platformās: Windows, OS X un Linux. CSS ColorGuard ir komandrindas rīks, kas informēs jūs, ja stillapā izmantojat līdzīgas krāsas; piemēram,. # f3f3f3
ir diezgan tuvu # f4f4f4
, lai jūs varētu vēlēties apsvērt abu apvienošanu. CSS ColorGuard ir konfigurējams, jūs varat iestatīt līdzības slieksni, kā arī iestatīt krāsas, kuras vēlaties, lai instruments ignorētu.
CSS Dig
CSS Dig ir Python skripts un darbojas lokāli datorā. CSS Dig veiks rūpīgu pārbaudi jūsu CSS. Tā nolasīs un apvienos īpašības, piem. visas fona krāsas deklarācijas iet zem fona sadaļas. Tādā veidā jūs varat viegli pieņemt lēmumus, pamatojoties uz ziņojumu, mēģinot standartizēt CSS sintaksi, piem. krāsu var atrast dažādos stilos ar šādu krāsu deklarāciju.
krāsa: #ccc; krāsa: #cccccc; krāsa: #CCC; krāsa: #CCCCCC;
Šīs krāsu deklarācijas dara to pašu. Jūs varētu arī iet ar #ccc
vai ar kapitālu #CCC
kā standarts. CSS Dig var atklāt šo atlaišanu arī citām CSS īpašībām, un jūs varēsiet padarīt jūsu kodu konsekventāku.