CSS-фреймворк — фреймворк, созданный для упрощения работы верстальщика, быстроты разработки и исключения максимально возможного числа ошибок вёрстки (проблемы совместимости различных версий браузеров и т. д.). Как и библиотеки скриптовых языков программирования, CSS-библиотеки, обычно имеющие вид внешнего css-файла, «подключаются» к проекту (добавляются в заголовок веб-страницы). Более функциональные фреймворки также имеют больше функций и дополнительных функций на основе JavaScript, но в основном ориентированы на дизайн и ориентированы на интерактивные шаблоны пользовательского интерфейса. Эта деталь отличает фреймворки CSS от других фреймворков JavaScript.

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

Недостатки Библиотеки бывают сильно «раздуты» — может быть много лишнего кода, который не будет использоваться в проекте. Дизайн будет зависеть от css-библиотеки. Из-за необходимости добавления множества классов к одному элементу нарушается принцип, ради которого и был создан CSS: разделение описаний структуры и внешнего вида.

Отличия Некоторые библиотеки используют сброс стилей (reset.css) для приведения в соответствие стилей по умолчанию для разных браузеров, в то время как другие используют нормализацию (Normalize.css), что уменьшает количество изначального кода библиотеки.

Типы CSS-библиотек Из-за упомянутых недостатков использование CSS-библиотек вызывает споры в профессиональном сообществе. Также это привело к появлению различных типов CSS-библиотек. Условно можно выделить два типа: Всеобъемлющие и Ограниченные. Третьим вариантом может быть разработка собственной библиотекиGuidelines for Developing Your Own CSS Framework . Этот вариант предпочитает большинство разработчиков, так как это дает выгоды персонального решения и уменьшает негативные моменты зависимости от использования сторонних библиотек.

Всеобъемлющие CSS-библиотеки Этот тип библиотеки пытается охватить большинство вещей, которые могут понадобиться разработчику. К этому типу относятся библиотеки, которые включают CSS для вёрстки и сброса (или какую-то основу).

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

Примеры CSS-библиотек

Всеобъемлющие Bootstrap — библиотека, созданная разработчиками Twitter. W3.css — CSS-фреймворк от w3schools. Twitter Flight Blueprint UIKit Materialize - CSS-фреймворк в стиле Material Design. 960 Grid System — библиотека для быстрой разработки макетов. Yet Another Multicolumn Layout (YAML) — имеет инструмент генерации кода, возможность создания адаптивных интерфейсов. css-framework — российская библиотека для разработки веб-интерфейсов. Foundation  — продвинутая библиотека для разработки адаптивных интерфейсов. Golden Grid System — библиотека для разработки адаптивных интерфейсов на основе золотого сечения. Gumby Framework Topcoat — небольшая библиотека от Adobe распространяется по лицензии Apache 2.0 Compass — CSS-фреймворк независимый от Rails Rest Css Framework Tailwind CSS - с открытым исходным кодом.

Ограниченные jQuery UI CSS Framework CSS-based Slideshow System — библиотека для создания презентаций.

Примечания

Ссылки Сравнение CSS-фреймворков Frameworks for Designers Definitive List of CSS Frameworks — Pick Your Style CSS-библиотека 960 Grid System CSS-библиотека Bootstrap на Github Все о 960gs — почти исчерпывающее описание

Категория:Веб-дизайн Категория:Веб-разработка Категория:Каскадные таблицы стилей Категория:Фреймворки