С числом увеличения пользователей мобильного интернета  возникает необходимость создания адаптивных сайтов, которые смогут подстраиваться под любой экран. Для упрощения жизни верстальщиков решили решили рассмотреть самые популярные css фреймворки. Они не только помогут сэкономит время, но и сосредоточиться на дизайне и контенте сайта. 

Foundation

Вышла четвертая версия Foundation от компании ZURB. Foundation — css фреймворк с 12-ти колонок для создания прототипов для любых типов устройств. Главное отличие от предыдущей версии заключается в упоре на мобильные телефоны.

Less Framework

Less Framework представляет собой систему CSSдля проектирования адаптивных веб-сайтов. Он содержит 4 макета и 3 комплекта типографских пресетов, все они основаны на одной сетке.

Golden Grid System

Golden Grid System разделяет экран на 18  колонок, 16 из которых используются для дизайна, а две крайние — внешние границы сетки.

Bootstrap

Достаточно популярный фреймворк. Имеет 12-ти колоночную адаптивную сетку, плагины JavaScript и многое другое.

Responsive Grid System

С помощью Responsive Grid System вы можете достаточно быстро и легко создавать адаптивный дизайн. Это могут быть 12, 16 или 24 столбца.

Skeleton

Skeleton был одним из самых ранних и лучших адаптивных CSS — фреймворков, что позволяет разрабатывать привлекательные веб-сайты любого размера — будь то экран ноутбука или iPhone. Фреймворк достаточно прост в использовании.

Ingrid

Ingrid - легкая  резиновая CSS системы, которая направлена ​​на сведение к минимуму использования классов. Она может легко настраиваться в соответствии с вашими потребностями.

Titan Framework

Titan Framework  - новый адаптивный CSS-фреймворк, который был разработан на основе 960 grid system.

 The Goldilocks Approach

Минималистичный фреймворк, который включает css-файлы для определения трех разновидностей медиа-запросов - мультиколоночные, с узкими колонками  и с одной колонкой.

Cascade  

YAML CSS Framework

Все модули фреймворка подготовлены к HTML5 и CSS3. Имеет сетку,  различные формы, элементы навигации и типографики.

Gumby

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

Susy 

Если вы используете Django или Rails этот фреймворк во многом вам сможет помочь.

Amazium

Amazium позволяет достаточно легко выполнять самые сложные и трудоемкие части создания адаптивных веб-сайтов.   С этим фреймворком вы сможете создавать макета также для retina-дисплеев.

 Kube Framework 

Минималистичный фреймворк , который включает стили для форм, сеток, кнопок, таблиц, шрифтов и многого.

BluCSS  

320 and Up

320 and Up адаптивная шаблонная система, которая  содержит пять медиа-запросов, вертикальную сетку, заданные стили типографских пресетов и шаблоны HTML5.

Были использованы материалы: Alfred Winston

Перевод — Дежурка

Смотрите также: