Онлайн-сервисы для сжатия и оптимизации CSS кода [UPDATE]


- Расширение .css
- MIME-тип text/css
- РазработчикКонсорциум Всемирной паутины
- Опубликован17 декабря 1996
- Тип форматаЯзык стилей
- Сайт w3.org/Style/CSS
CSS (англ. Cascading Style Sheets — каскадные таблицы стилей) — формальный язык описания внешнего вида документа, написанного с использованием языка разметки. Преимущественно используется как средство описания, оформления внешнего вида веб-страниц, написанных с помощью языков разметки HTML и XHTML, но может также применяться к любым XML-документам, например, к SVG или XUL.
Один из наиболее важных факторов при разработке веб-сайта является тест скорости сайта. Загружать страницу нужно как можно быстрее, особенно в случае больших сайтов с большим количеством CSS кода, в котором более быстрая загрузка означает повышение удобства использования и удовлетворенности пользователей.
Инструменты для сжатия CSS улучшают время загрузки, удалив комментарии из кода, включающих каждую команду в одной строке, удаление "белого пространства" - пробелов и переносов строк.
Имейте в виду, если вы действительно хотите, увеличить производительность веб-сайта, после стадии разработки, вы должны пойти еще дальше и использовать GZIP сжатие и кэширование ваших файлов. Но об этом мы поговорим в следующей статье!
Попробуйте воспользоваться одним из этих онлайн сервисов по оптимизации CSS файлов (некоторые из них также предлагают и JavaScript сжатие), и посмотреть, как они могут ускорить время отклика веб-сайт и сохранить пропускную способность.
1. Cssdrive.com

Cssdrive.com CSS Compressor — работает в 2 режимах: обычный и продвинутый. Вы можете выбрать один из трех уровней сжатия. Режим "Normal" должен хорошо работать в большинстве случаев, создавая оптимальный баланс между ними.
2. Cleancss.com

Cleancss.com – CSS форматирование и оптимизатор на основе csstidy доступна на английском, немецком и французском языках.
4. CSS Optimizer

CSS Optimizer - Оптимизация CSS указав URL адрес css-файла, загрузив файл с локального компьютера или непосредственно введя CSS код в форму.
6. Askapache.com

askapache.com - данный сервис использует часть порта JavaScript из YUI Compressor, и часть W3 CSS Validator. Вы можете загрузить CSS файл, указать URL CSS-файла, или просто вставить CSS код в форму.
7. Iceyboard.no-ip.org

iceyboard.no-ip.org CSS Compressor - Вы можете загрузить файл, указать URL CSS-файла или вставить CSS код. Хорошие варианты сжатия.
8. Ebiene.de

Ebiene.de – сервис для сжатия JavaScript и CSS файлов. Вы можете выбрать между базовым сжатием и сильным.
9. Pagecolumn.com

Pagecolumn.com – Сжатие CSS, возможность поиска и удаления неиспользуемых классов и ID в CSS (опционально).
11. Lotterypost.com

Lotterypost.com CSS компрессор - нужно просто вставить CSS код и нажать кнопку «Сжать».
13. Refresh-sf.com

Refresh-sf.com — Сервис для JavaScript / CSS сжатия. Использует YUI Compressor. Просто вставьте код в текстовое поле или выберите файл для загрузки. Затем выберите тип сжатия, JS или CSS.
14. Sevenforty.com

Sevenforty.com CSS Compressor - основанный на Java YUI Compressor. Просто загрузите CSS файл, который вы хотите уменьшить и вы получите сжатый CSS файл в ZIP архиве.
15. Phpinsider.com

Phpinsider.com – использует метод Monte Ohrt, нет вариантов сжатия, просто вставьте код CSS и забирайте результат.
16. Devtrench.com
Devtrench.com -CSS Compressor на основе CSSTidy
17. Cssportal.com
Cssportal.com - CSS Compressor на основе CSSTidy
18. Mabblog.com
Mabblog.com – Укажите URL CSS файла или вставить код CSS, нет вариантов сжатия.
19. Creativyst.com
Creativyst.com – CSS и JavaScript компрессор.
20. Generateit.net
Generateit.net – CSS Compressor на основе CSSTidy
21. Arrantius.com
Arrantius.com CSS Compressor - написанный на JavaScript, поэтому нет передачи вашего CSS неизвестному серверу. Он вынимает комментарии и пробелы в CSS файле, не более того.
22. Artiss.co.uk
Artiss.co.uk - только загрузка файлов, возможность удалять комментарии или нет.
23. Homepage-Performance.de
Homepage-Performance.de – варианты: удалить пробелы, последняя точка с запятой, замена цветов и т.д. Вы можете только вставлять CSS код в поле ввода.
24. Isnoop.net
Isnoop.net – варианты: удалить пробелы, отступы и новую линию перед открывающей фигурной скобкой.
В заключение
Не бойтесь экспериментировать с этими сервисами. Большинство из них показывают результат в виде процента сжатия от оригинала и размер файла на выходе.
Если Вы знаете еще какие-либо онлайн-сервисы по оптимизации CSS, которые нет в этой статье, сообщайте об этом в комментариях.
Created/Updated: 25.05.2018