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

Ответ 1

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

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

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

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

Многое изменилось за 7+ лет, и каждый, кто смотрит на этот ответ, должен рассмотреть возможность изучения новых методов доставки активов, особенно сейчас использование HTTP2 и препроцессоров более обыденны.

Ответ 2

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

Ответ 3

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

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

Ответ 4

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

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

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

Ответ 5

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

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

Ответ 6

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

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

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

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

Ответ 7

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

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

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

или

homepage.css about.css gallery.css