В этом посте мы поговорим о Bootstrap, который является CSS-фреймворком.
Это один из наиболее популярных CSS-фреймворков, его разработали инженеры из Twitter.
Что такое Bootstrap
Bootstrap это самый популярный HTML/CSS/JavaScript фреймворк для разработки отзывчивых, “mobile first” проектов в вебе.
Давайте разберем эти утверждения.
Прежде всего, самый популярный фреймворк. На Github’е у них больше 110 тысяч звезд и больше 50 тысяч форков. Так что, это самый популярный проект на всем сайте.
Bootstrap состоит по большей части из CSS. Он предопределяет множество CSS-классов для вас.
Часто Bootstrap требует иметь определенную HTML-структуру на вашей странице.
На практике это не так страшно, как звучит. Он просто просит вас добавить пару тегов тут и там, чтобы определенный класс применялся правильно.
Он также имеет крутой JavaScript-фреймворк, основанный на jQuery API, который помогает добавлять плагины реально улучшающие ваш сайт.
Кроме того, Bootstrap называют “mobile first” фреймворком.
В общем-то, это означает, что вы имеете дело в первую очередь с мобильными девайсами.
В реальности, такой подход может иметь два варианта.
Первый из них, это когда вы действительно пишите код в первую очередь для мобильного. Как утверждают сторонники этого метода, он очень помогает контент-стратегии, заставляя вас задуматься о том какой контент важнее всего и что вы хотите показать в первую очередь.
Но вы можете также начинать с десктопной версии, если это удобнее для вас или имеет больше смысла для вашего проекта.
Я бы сказал, что оба эти варианта полностью валидны.
Но в любом случае вы планируете мобильную версию с самого начала, вы не игнорируете ее и не откладываете в конец или середину разработки.
Также этот подход означает, что CSS-фреймворк должен подходить для мобильных.
Кстати, довольно интересно, что Bootstrap не всегда был “mobile-first”. До версии 2.0 или около того, Bootstrap имел отдельный CSS-файл и отдельный набор классов для них.
Но сегодня он mobile-first.
Недостатки Bootstrap
Какие недостатки у этого фреймворка по сравнению, к примеру, с написанием собственного?
В первую очередь, он большой и нагруженный. То есть, многие функции вы скорее всего не будете использовать.
Это можно компенсировать скачиванием с их сайта только нужных модулей и функций, которые, по вашему мнению, вы будете использовать.
Так что, хотя Bootstrap и слегка раздут, это не очень плохо.
Далее, вы можете написать свой собственный фреймворк, который будет более направлен на ваш сайт и значительно меньше. Но это также займет у вас значительно больше времени.
Официальный сайт и документация
Официальный сайт — getbootstrap.com.
На официальном сайте можно найти документацию, примеры, темы и прочее.