Объединение файлов CSS
Каждый файл CSS, который вы используете для своего веб-сайта, увеличивает скорость загрузки страницы. Иногда это неизбежно, однако в большинстве случаев вы можете объединить два или более файла CSS, используя только «copy and paste».
Часто единственная причина, по которой у вас вызывается несколько файлов CSS, заключается в том, что дизайнеру вашего веб-сайта проще работать с отдельными файлами. Коду CSS все равно, где он находится и в скольких файлах он находится. Один файл CSS, содержащий всю информацию о ваших отдельных объединенных файлах CSS, будет работать так же хорошо и улучшит скорость вашей страницы.
Поскольку все файлы CSS по умолчанию блокируют рендеринг, важно иметь как можно меньше файлов css.
Помещение всего вашего CSS в один файл существенно сокращает время, необходимое для загрузки ваших веб-страниц, потому что вы уменьшаете количество вещей, которые веб-браузер должен загрузить перед отображением вашей страницы.
WordPress и CSS
Вы должны обратить особое внимание на это руководство, если вы используете Wordpress. Практически каждая тема Wordpress имеет несколько загруженных файлов CSS. Если вы обнаружите, что это относится к вашему блогу, и вам удобно редактировать файлы, вы можете взять содержимое каждой из вызываемых таблиц стилей CSS и поместить их в основной файл CSS (тот, который вы часто используете, когда вы открываете «Внешний вид> Редактор» на панели инструментов). Просто не забудьте удалить вызовы для объединенного CSS.
Как объединить свой CSS
Часто вы можете просто скопировать и вставить содержимое каждого файла CSS вместе, чтобы создать один основной файл CSS.
Иногда у вас будет вызываться много файлов CSS, и вы можете просто создать один новый файл CSS, который содержит все содержимое других.
Этот метод сохранит все ваши старые файлы CSS в безопасности и правильно назовет их, если вам нужно вернуться к ним. Затем вы обновите свой HTML, чтобы вызвать новый файл и удалить все вызовы для старых файлов.
Часто бывает всего два или три файла CSS, и вы можете просто добавить содержимое одного из них в существующий файл...
Например, допустим, у вас есть три файла css...
В этой ситуации вы можете открыть свой «other.css», скопировать и вставить содержимое этого файла в «main.css».
Вы можете сделать то же самое и для «third.css».
Как только вы это сделаете, вы удалите вызов «other.css» и «third.css» из своего HTML. Теперь у вас есть только один файл CSS вместо трех, которые веб-браузер должен загрузить перед отображением вашей веб-страницы. Теперь ваша веб-страница будет загружаться быстрее.
Другие темы по оптимизации CSS
Возможно, вы захотите оптимизировать доставку css в соответствии с рекомендациями Google 1 ...