4 Инструменти за одит и оптимизиране на CSS
След като уебсайтът ви започне да се разраства, ще го направи и вашият код. Тъй като вашият код се разширява, CSS може внезапно да стане трудно за поддържане и може да се презапише едно CSS правило с друго. Това усложнява нещата и най-вероятно ще имате много грешки.
Ако това се случи с вас, е време да го направите одитирайте CSS на сайта си. Одитът на вашата CSS ще ви позволи да идентифицирате части от вашата CSS, която не е оптимизирана. Можете също така да намалите размера на файла със стилове, като елиминирате реда с код, който забавя ефективността на сайта Ви.
Ето 5 добри инструмента, които да ви помогнат да проверите и оптимизирате CSS.
Тип-о-матик
Тип-о-матик е плъгин Firebug за анализ на шрифтове, които се използват в уебсайт. Този плъгин дава визуален отчет в таблица, носещ свойствата на шрифта, като например семейството на шрифтовете, размера, теглото, цвета и броя на използваните шрифтове в уеб страницата. Чрез таблицата с отчети можете лесно да оптимизирате използването на шрифта, да премахнете ненужното или да комбинирате стилове, които са твърде сходни.
CSS Lint
CSS Lint е linting инструмент, който анализира синтаксиса на CSS въз основа на специфични параметри, които адресират за производителност, достъпност и съвместимост на вашата CSS. Ще бъдете изненадани от резултатите, очаквайте много предупреждения във вашия CSS. Тези грешки обаче ще ви помогнат да коригирате синтаксиса на CSS и да го направите по-ефективен. Освен това, вие също ще бъдете по-добър CSS писател.
CSS ColorGuard
CSS ColorGuard е сравнително нов инструмент. Той е изграден като Node модул и работи във всички платформи: Windows, OS X и Linux. CSS ColorGuard е инструмент за команден ред, който ще ви уведоми, ако използвате подобни цветове във вашата стилова таблица; например. # f3f3f3
е доста близо до # f4f4f4
, така че може да искате да обмислите сливането на двете. CSS ColorGuard може да се конфигурира, можете да зададете праг на подобие, както и да зададете цветовете, които искате инструментът да игнорира.
CSS Dig
CSS Dig е скрипт на Python и работи локално на вашия компютър. CSS Dig ще извърши задълбочено проучване в CSS. Той ще чете и комбинира свойства, напр. всички декларации за цвета на фона ще отидат под раздела за фон. По този начин можете лесно да вземате решения въз основа на доклада, когато се опитвате да стандартизирате своя синтаксис за CSS, напр. можете да намерите цвят в различни стилове със следната декларация за цвят.
цвят: #ccc; цвят: #cccccc; цвят: #CCC; цвят: #CCCCCC;
Тези цветови декларации правят същото. Може и да отидете с #ccc
или със столицата #CCC
като стандарт. CSS Dig може също така да изложи тази излишък за други CSS свойства и ще можете да направите кода по-последователен.