Переклад з англійської дає нам поняття “каскадні таблиці стилів”.
У них зберігаються стилі різних елементів HTML-документів: кордон, заливка, колір, розмір, відносне розташування та інше.
Присвоєння стилів елементів може виконуватися прямо в коді веб-документа з використанням тега Style.
Але для прискорення завантаження сторінок краще скористатися іншим варіантом – винесенням стилів в окремі файли CSS. У цьому випадку підвищується ймовірність формування позитивних поведінкових факторів, оскільки швидкість завантаження веб-сайту – один з основоположних моментів, що впливають на думку користувачів про нього.
Виходить, що каскадні таблиці стилів, винесені з коду сторінок в CSS-файли є одним з багатьох інструментів внутрішньої оптимізації веб-ресурсів, побічно поліпшують їх позиції в ведучих.
Для оптимізації CSS коду можна:
- Об’єднувати всі стилі CSS в один файл
- Об’єднання всіх підвантажуваних на сторінку стилів CSS в один дозволяє зменшити час завантаження сторінки браузером за рахунок зменшення необхідної кількості HTTP запитів та підвищення ефективності стиснення.
- Перемістити стилі CSS перед скриптами JavaScript
- Виправлення порядку проходження CSS і JavaScript дозволяє краще розпаралелити їх завантаження і збільшити швидкість рендерингу сторінки браузером
- Мінімізувати CSS
- Прискорює час завантаження сторінки браузером за рахунок зменшення розміру CSS стилів шляхом видалення коментарів, зайвих пробілів і скорочення назв кольорів.
- Оптимізувати CSS в атрибутах style
- Виробляти всі включені оптимізації CSS також в атрибутах style (лише якщо вони містять url картинок)
- Перемістити CSS head
- Переміщення стилів CSS в секцію head дозволяє візуально прискорити рендеринг сторінки браузером, а також уникнути в деяких браузерах ефекту перемальовування елементів у разі, якщо стилі для них прописані після оголошення самого елемента.
- Перемістити невеликі зовнішні CSS в HTML
- Переміщення зовнішніх CSS файлів розміром до 1Кб всередину HTML дозволяє скоротити число запитів до сервера, необхідне для відображення сторінки.
- Розширити кешування CSS
- Включає кешування CSS в браузері на тривалий термін, залишаючи розробнику можливість вносити до них зміни без необхідності перейменування файлів.
Такі налаштування оптимізації можна знайти в одній українській хостинг компанії.