Один файл CSS или отдельные файлы CSS для каждой страницы?

Question

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

Answer 1

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

Чтобы помочь, я обычно беру свой CSS с помощью CSS-очистителя , чтобы уменьшить размер его файла, кроме того, вы можете GZip CSS также использует .htaccess , уменьшая его размер.

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

Изменить, май 2017 г.

За последние 7 с лишним лет многое изменилось, и всем, кто ищет этот ответ, следует подумать о том, чтобы изучить новые методы доставки ресурсов, особенно теперь использование HTTP2 и препроцессоров стало более распространенным явлением.

Answer 2

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

Answer 3

Основная цель таблицы стилей - позволить вам изменить дизайн всех ваших страниц. Если у вас есть h1 {color:red;} на каждой странице, а затем вы хотите изменить его на синий, вам придется отредактировать таблицу стилей каждой страницы. С помощью одной таблицы стилей вы сможете изменить цвет и отразить его на всем сайте.

Кроме того, таблица стилей будет кэшироваться на компьютере пользователя, а не загружаться с каждой страницы.

Answer 4

Если вы хотите, чтобы на всех страницах вашего сайта был одинаковый стиль, используйте одну таблицу стилей для всех распространенных стилей. В противном случае вам может быть довольно сложно поддерживать множество таблиц стилей. Изменения должны быть добавлены к каждой из нескольких таблиц стилей.

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

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

Answer 5

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

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

Большинству сайтов не нужно иметь более одной таблицы стилей для одного типа мультимедиа. Однако, если ваш сайт сильно отличается по дизайну, я бы предложил иметь базовую таблицу стилей, которая имеет все общие свойства, а затем дополнительную таблицу стилей для каждой из страниц, которая содержит различия.

Это следует использовать только в том случае, если изменения CSS достаточно велики, чтобы оправдать использование отдельных таблиц стилей.

Answer 6

Поскольку я на самом деле настоящий веб-программист (Java-программист, а не скрипты, такие как PHP), я должен дать вам мнение, что никогда не видел ни одного настоящего веб-дизайнера дизайнеров :

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

Answer 7

Я наткнулся на эту тему в поисках того же вопроса..Моя мысль заключалась в том, чтобы построить такую ​​структуру..

Layout.css <--- для структуры сайта, ссылок, заголовков и т. д., которые являются общими для всего сайта.form.css <- общие стили формы reset.css <- все документы сбрасываются, если вы их используете

и в настоящее время я используюpages.css для всех стилей страниц..

или

домашняя страница.css about.css gallery.css