Оптимізуючи на своєму сайті файли стилів (CSS) , Можна збільшити швидкість завантаження сайту, іноді дуже істотно, що позитивно позначиться не тільки на підвищенні оцінки в Page Speed, а й внесе свою лепту в розкрутку сайту.
Оптимізація (стиснення) CSS - відмінний спосіб зменшити вагу сайту - в браузер кінцевого користувача буде віддаватися менше даних, за рахунок мінімізації коду і стилів в CSS-файлах. Не важливо, скільки обсягу займають на вашому сайті CSS стилі, в будь-якому випадку, 50 і більше% їх вмісту можна просто видалити (!) Без будь-якої шкоди для вашого сайту, що, безумовно, є важливою складовою в оптимізації швидкості сайту.
Оптимізацію CSS можна і потрібно проводити на будь-якій платформі. Залежно від ПО сайту, це можна реалізувати за допомогою плагінів і модулів для вашої CMS. Також це можна реалізувати за допомогою онлайн-інструментів.
Оптимізація CSS в WordPress
У WordPress оптимізацію CSS можна реалізувати автоматично за допомогою плагінів. Як працюють ці доповнення? Модулі по оптимізації CSS мінімізують і стискають CSS-файли:
- видаляють коментарі з CSS
- видаляють нові і порожні рядки, подвійні пробіли, табуляції і т.д.
- об'єднують однотипні стилі
- переводять значення кольорів в короткі (#ffffff і #fff - працюють однаково добре)
- використовують GZIP компресію для оптимізованого CSS
Серед популярних плагінів можна назвати:
До речі, оптимізацію CSS доцільно проводити разом з JavaScript . І два останніх плагіна працюють якраз в обох напрямках (вміють оптимізувати JS нарівні з CSS).
Оптимізація CSS онлайн-інструментами
Існує маса онлайн оптимізаторів CSS коду, які доцільно використовувати на статичних сайтах. Їх можна використовувати і для оптимізації CSS WordPress, якщо тема не передбачає оновлень, постійних доробок і т.д.
Онлайн CSS оптимізатор являє собою онлайн-інструмент для скорочення розміру файлу каскадних таблиць стилів. Просто вкажіть посилання до файлу стилів або завантажте стилі в спеціальне вікно. Прикладами онлайн оптимізаторів CSS можуть служити:
http://www.cssdrive.com/index.php/main/csscompressor/
http://www.cy-pr.com/tools/css/
http://www.css-school.ru/optimiser/
http://www.pagecolumn.com/tool/css_compressor.htm
http://www.online-code.net/minify-css.html
http://csscompressor.com
http://www.askapache.com/online-tools/compress-css/
http://refresh-sf.com
і т.д.
Перевірка валідності CSS
Популярний і визнаний онлайн сервіс перевірки валідації CSS від W3C може знайти всі помилки в стилях і автоматично згенерувати валідний файл стилів для Вашого сайту. Дійсний - значить "задовольняє специфікації CSS". У сервісі можна вказати url сайту (в такому випадку будуть довантажуючи і перевірені всі підключаються CSS файли), повний шлях до необхідного CSS файлу або CSS стилі текстом.
Сервіс оптимізації CSS від W3C: очистить невалідний код з стилів Вашого сайту
Не забудьте зробити резервну копію CSS файлу перед тим, як Ви його перезапише "валидной версією" від сервісу W3C. Сервіс здійснює перевірку Ваших стилів на відповідність специфікації CSS2.1 або CSS3 і деякі старі теми і шаблони можуть постраждати від результату валідації! Тому, старанно все перевірте, піклуючись про своїх
відвідувачів!