Sharapov
@Sharapov

Что лучше — общий всё-в-одном style.css или несколько файлов .css?

Несколько файлов удобней, но не снизит ли это скорость загрузки и рендеринга страниц?

cf083ad92dba4054b86617c25318236b.png
  • Вопрос задан
  • 6708 просмотров
Решения вопроса 2
StivinKing
@StivinKing
Влияет. Каждый файл это дополнительный запрос.
Но раскидывая стили по файлам удобнее за ними следить и править.
Что же делать? Правильно. Раскидывать по файлам, и работать с ними. А при загрузке на сервер пропускать через сборщик проектов (к примеру gulp), который объединит все css файлы в один, а так же сожмет их
Ответ написан
PretorDH
@PretorDH
HTML5, CSS3, PHP, JS - люблю в чистом виде.
С переходом на протокол HTTP2 держать файлы раздельно даже на сервере будет лучше. Не будет разницы, ибо пакетироваться они будут на уровне протокола.

Но даже сейчас лучше разделить стили блочной разметки от украшательств и грузить их раздельно. Подключать media queries CSS, не в CSS а в HTML отдельными файлами, указанием атрибута media:
<link rel="stylesheet" media="all and (min-color-index: 256)" href="..." />


А ещё лучше, подключать с каждой страницей только те стили, которые на ней используются :)

Чтобы это можно было сделать, верстальщик должен сделать раздельные сборки:
  • Стартовую таблицу стилей которая грузится на всех страницах. Сюда входят: сброс браузеров, хеадер, футер (если он fixed внизу видимого), стили видимого при загрузке домашней страницы. ТОЛЬКО то, что видно на самом большом экране без элементов которые появляются во время прокрутки.
  • Основную таблицу стилей для разметки страниц контента. То что входит во все страницы контента, без специфичности. Ну и не фиксированный футер тот, что после контента. Эти стили должны быть загружены уже после загрузки основного контента.
  • Специфичные стили для отдельных страниц. Эти грузятся отдельно на каждой странице свои стили и по надобности объединяются с Основной разметкой контента.
  • Таблица стилей форм. Все формы на сайте должны грузится с одной таблицы. А не быть специфичными для разных страниц. Формы это не контент!!! У форм ОБЯЗАТЕЛЬНО должна быть отдельная таблица стилей. Она подключается при включении формы генератором форм на бекенде. Даже строка поиска в хедере. Все элементы input, textarea, option должны быть описаны в отдельной таблице стилей. Эти стили объединяются с основной или стартовой таблицей как будет надо.


P.S. Уточню по Основной таблице стилей фактически сборок должно быть минимум 6 (мобильная, планшетная, малая, средняя, ретина, печатная).
Верстка ВСЕГДА должна быть мобайлфёрст. И сновная таблица должна быть на мобильной версии сайта. А потом ёё расширять и естественно подключать атрибутом media по надобности. Сборка в порядке возрастания сначала узкоспециализированная таблица для мобильников. Для планшетников подключается только отдельный файл с планшетной и мобильной таблицами стилей собранные в кучу. И так далее...

P.P.S. Cборщики (gulp) собирающие в один файл, это посредственное решение в лоб грубой силой, дабы не заморачиваться.
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
Shull
@Shull
хочу быть хорошим IT-шником
Это зависит от вашего уровня знаний и умений.
Сначала вы будете делать CSS-стили внутри HTML-файла.
Потом вы будете делать отдельный файл .CSS.
Потом вы подключите CSS-помогайки, например, reset.css и у вас будет несколько CSS. Я сейчас именно на этом этапе.
Потом вы начнёте использовать сборщики.
Потом вы будете всё это разумно комбинировать.
Удачи.
Ответ написан
trevoga_su
@trevoga_su
не снизит
css и js надо разделять. на каждый шаблон - свой css и js
совсем общие стили и скрипты - выносим в common.css и common.js

если не разделять, то потом не разберешься в этом хаосе
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
20 апр. 2021, в 15:47
100000 руб./за проект
20 апр. 2021, в 15:36
400 руб./за проект
20 апр. 2021, в 15:34
2000 руб./за проект