Почему использовать CSS фреймворки полезно?

Опубликовал: 6 лет назад CSS

Добрый день дорогой читатель блога Виктора Доценко. Данная статья рассчитана и ориентированна, в основном для новичков мира web разработки, но так же будет полезна и уже знакомым с веб разработкой людям. Многие разработчики для ускорения процесса разработки и экономии своего времени используют повсеместно CSS фреймворки. Интересно? Тогда читайте продолжение...

Интро:
Раньше разработчикам часто приходилось переписывать таблицы стилей. Проектов много, однотипных тоже. Переписывать гору стилей под определенные макеты. Весело. Но настало время, когда при работе с макетами требуется лишь менять некоторые значения, облегчая тем самым свою работу. Мое мнение, что использовать фреймворки иногда просто необходимо, но как говорится есть свои плюсы и минусы. О них по порядку:

+ CSS фреймворков

  • Ваш код будет правильным и легко понятным;
  • Быстрая разработка прототипов, увеличивается Ваша продуктивность;
  • Многие фреймворки Open Source;
  • Избегаете огромное количество частых ошибок;
  • Часто css фреймворки хорошо документированы;
  • Эффективная работа в команде;
  • Кроссбраузерность присутствует во многих CSS фреймворках;
  • Отличный структурированный код.

— CSS фреймворков

  • Используя фреймворк, Вы используете чужие знания и готовые решения, а не пишите свой код. Следовательно не растете;
  • Часто теряется уникальность проектов;
  • Встречаются ошибки от разработчика фреймворка;
  • Освоение фреймворка занимает порой много времени;
  • Огромное количество однотипных проектов;
  • Встречаются скудно документированные фреймворки;

 

Рассмотрим парочку фреймворков:

CSS FRAMEWORKS

 

Twitter Bootstrap

Bootstrap

 

Почему Bootstrap на первом месте в моем мини обзорчике? Потому, что он используется уже в огромном количестве проектов. Его так много, что многие просто плюются и люто ненавидят его. Особенно сообщество Хабра. Однако я до сих пор его использую. Почему? Да потому, что привык  я к нему, а привычка это сильно. И так давайте опишем его характеристики. Bootstrap написан на языке LESS (программируемый язык стилей). Поддерживает мониторы, мобильные устройства, планшеты. Используется 12-ти колоночная адаптивная разметка. Большое количество компонентов, UI элементов, иконок, каруселей и прочего прочего. Имеются подключаемые JavaScript плагины. Отличнейшая документация. Если побродить по интернету, найдете и на русском. Имеет огромное сообщество из за своей популярности, а это огромный плюс.

960 GRID SYSTEM

960 GRID SYSTEM

 

Часто 960 используют для сайтов с шириной 960px. Так же есть  Fluid 960gs версия и используют ее для всей ширины при резиновой верстке. Сетка задается из 12 — 16 колонок. Имеет приятный вес файла — занимает всего 3,6 Кб.

Blueprint

Blueprintcss

Blueprint — это довольно таки хорошая основа для прототипирования ваших проектов. При помощи  легкой в использовании сетки, красивых форм, стилей для печати можно быстро сделать красивые решения Ваших проблем. Так же в фреймворке есть удивительная функция сброса стилей браузера по дефолту, предлагая методы для использования настраиваемой сетки макета. К фреймворку существуют плагины. Сетка задается из 24 колонок.

 

YAML

YAML

YAML, направлен для гибких макетов. Предлагает Вам для ваших проектов — колонки и сетки для резиновых, эластичных и макетов с фиксированной шириной. Имеет удобный визуальный инструментарий. Генерирует HTML и CSS код на лету.

Когда и как использовать CSS Frameworks?

Я ниже приведу парочку причин, которые помогут Вам определится стоит ли использовать фреймворки или все таки писать свои оригинальные таблицы стилей:

  • Когда Вы часто используете один и тот же макет в своих проектах. Стоит задуматься о использовании фреймворка для того, чтобы оптимизировать свой труд;
  • Выбирайте только лучший на Ваш взгляд фреймворк. Который Вы выбираете опираясь на организацию и структуру Ваших проектов;
  • Более опытные программисты помогут Вам советами о фреймворках. Поспрашивайте их;
  • Выбирая фреймворк оценивайте также полноту и полезность документации по данному фреймворку.
  • Сообщества по данным фреймворкам играют огромную роль. Вы всегда сможете получить ответы на все вопросы связанные с выбранным Вам продуктом.
  • Если Вы хотите оригинальности — пишите свои таблицы стилей. Не следуйте за толпой=)

Итог:

Дорогие друзья, в статье я привел лишь мизерную долю фреймворков. Существует уже десятки других продуктов. Какой использовать? Я думаю Вы сами решите для себя.
И стоит ли использовать, Вы так же решите.Быть может Вы хотите поделится историей о продукте , который вы используете в своих продуктах?  Тогда милости прошу в комментарии.
Статья имеет кучу орфографических и пунктуационных ошибок. Сообщите пожалуйста при встрече с ними. Так же, статья может быть частично или полностью переписана. Следите за обновлениями. Всем добра. Пока.


Новая система комментариев
comments powered by HyperComments