Сервис для
сео - оптимизаторов

Найди ошибки на сайте
Ошибки мешают продвижению сайта
Исправь ошибки на сайте
Сайт без ошибок продвигать легче
Получи новых клиентов
Новые клиенты принесут больше прибыль

Как удалить неиспользуемый CSS из ваших файлов стилей

CSS-файлы вашего сайта могут иметь несколько избыточных правил, которые больше не используются ни одним элементом на веб-страницах. Например, вы могли добавить поиск по сайту на вашем веб-сайте и соответствующие стили вошли в таблицу стилей. Позже, если вы решите удалить это окно поиска, стили могут продолжать существовать в вашем CSS, хотя они нигде не используются.

Эти неиспользуемые записи в ваших CSS-файлах увеличивают время загрузки страницы вашего сайта, а также влияют на производительность сайта, так как браузер должен выполнять дополнительную работу, анализируя все дополнительные правила. И даже если влияние на производительность будет минимальным, это облегчит задачу поддержания CSS, если файлы будут чистыми и хорошо структурированными.

Opera и браузер Firefox имеют популярное дополнение под названием Dust Me который сканирует вашу текущую веб-страницу и перечисляет все неиспользуемые правила CSS, которые определены в таблице стилей, но не используются на странице. Однако пользователям Google Chrome не нужно устанавливать надстройки, так как Инструменты разработчика Встроенный в сам браузер Google предлагает эту опцию.

CSS-файлы вашего сайта могут иметь несколько избыточных правил, которые больше не используются ни одним элементом на веб-страницах

Вот как вы можете легко найти все неиспользуемые селекторы в ваших CSS-файлах в Google Chrome:

  1. Откройте любую страницу вашего сайта в Google Chrome, а затем запустите инструменты разработки, доступные в меню «Файл» -> «Инструменты» -> «Инструменты разработчика».
  2. Перейдите на вкладку «Аудиты» внутри Dev Tools и выберите опции «Производительность веб-страницы» и «Обновить страницу и аудит при загрузке». Теперь нажмите кнопку «Выполнить», чтобы начать процесс аудита CSS.
  3. На странице результатов разверните группу «Удалить неиспользуемые правила CSS» и выберите файлы CSS, связанные с вашим сайтом. Вы можете игнорировать CSS-файлы, добавленные социальными плагинами и виджетами, поскольку у вас нет над ними контроля.

Здесь вы получите отсортированный список всех стилей, которые определены в файле CSS, но нигде не используются на текущей странице.

Вы можете скопировать и сохранить результаты в текстовом файле и повторить шаги для нескольких других страниц вашего сайта. Это важно, поскольку не все селекторы могут использоваться на всех страницах. Вы можете найти количество различных селекторов в комбинированном наборе результатов, возможно, используя Google Sheets и селекторы с наибольшим числом, вероятно, могут быть «безопасно» удалены.