Статьи

Что такого плохого в CSS-фреймворках?

A boy rides a bicycle on a paved footpath. Training wheels are attached to the bike.

Фреймворки CSS ни в коем случае не являются последними новостями. Вот уже несколько лет можно выбирать из нескольких вариантов, одним из самых ранних и самых известных из них был CSS Grids от Yahoo ; мы говорили об этом ранее в наших блогах . Что удивительно для меня, так это то, что многим не удается воспользоваться этими замечательными маленькими сбережениями времени. Быстрая прогулка по нашему форуму CSS показывает, что у многих людей возникают такие же разочаровывающие, обескураживающие проблемы с плавающими макетами и позиционированием; Я вполне уверен, что этого можно было бы избежать, если бы разработчик просто использовал проверенные и проверенные методы макета, взятые из CSS-фреймворка.

Эй, подожди — убери эти гнилые помидоры! Я объясню, я обещаю.

Относитесь к каркасам как к тренировочным колесам

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

Кто из вас научился ездить на велосипеде с тренировочными колесами? Это отличный, веселый способ для ребенка обрести уверенность и овладеть основами торможения и рулевого управления, прежде чем научиться балансировать велосипед и оставаться в вертикальном положении. Более того, крайне неприятно падать с велосипеда и царапать колени.

Цель обучающих колес — укрепить уверенность, заставляя новых гонщиков ездить на велосипеде: аналогично, CSS-фреймворк, используемый с правильным отношением, может помочь новым разработчикам в таинственном и часто сбивающем с толку мире CSS-верстки. У новичков есть шанс увидеть, что верстка работает правильно, без разочарований, а открытая природа этих фреймворков позволяет легко узнать, что происходит под капотом. Позже, с некоторой уверенностью, методы, взятые из фреймворка, могут найти хорошее применение при разработке собственных макетов с нуля.

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

Съешь свой пирог и съешь его тоже

Другая критика CSS-фреймворков связана с тем, как они создаются. Часто структура основана на идее сетки или серии столбцов; соответственно, для этих столбцов часто будет ряд классов, названных для их презентационных аспектов. Популярная 960 Grid System содержит десятки странных классов, таких как .suffix_10 или .grid_3 , а не менее популярный Blueprint CSS предназначен для имен классов, таких как .border или .span_5 . Более того, они содержат множество классов для каждой мыслимой ширины столбца или требуемого поля. Затем, чтобы добавить оскорбление ране, у некоторых из них есть три или более отдельных файла CSS для типа, макета, печати или Internet Explorer.

Положительно шокирует! Должны ли мы пытаться поощрять значимые имена классов, которые описывают назначение элемента, а не его внешний вид? Должны ли мы избежать вздутия? Кто- нибудь подумает о браузерах?

Ну, конечно, мы должны, но этого едва ли достаточно для того, чтобы полностью отказаться от CSS-фреймворков. Ответ так прост: вам не нужно использовать все эти вещи, и никто не заставляет вас.

С большинством фреймворков вполне приемлемо использовать только те части, которые вам нужны, менять их по мере необходимости и выбрасывать остальные. На самом деле, выбор платформы с лицензией, удобной для редактирования, которая позволяет вам просто брать нужные фрагменты, приветствуется. Большинство CSS-фреймворков в Интернете лицензируются по модели свободного программного обеспечения, которая позволяет вам изменять код по вашему выбору. Например, 960 Grid System имеет двойную лицензию по лицензии MIT и GNU General Public License (GPL), которые разрешают свободное редактирование, в то время как лицензия Blueprint является модифицированной версией той же лицензии MIT. Ни в одной из этих лицензий нет ничего, что могло бы помешать вам брать плату за свою работу или отстаивать свои права на авторские права. Все, что требуется, — это если вы намереваетесь выпустить работу для остального мира, например, в теме WordPress или в бесплатном шаблоне, что вы делаете это на аналогичных условиях.

Поэтому, если вам не нравится, как они работают, абсолютно нормально переименовать эти непристойные классы, изменить их порядок или изменить их полностью. Вы можете взять любые детали, которые не нужны для вашего проекта — у нас даже есть замечательный инструмент в SitePoint, который называется Dust-Me Selectors , который поможет вам сделать это. На самом деле, это просто отлично. На самом деле вы можете использовать одну из этих платформ, чтобы запустить свою собственную, личную платформу.

Некоторые разработчики рассматривают как личную гордость тщательную сборку каждого макета с нуля — даже если это означает, что они выполняют одни и те же повторяющиеся задачи снова и снова. Со своей стороны, я считаю гордостью найти способы работать умнее и быть дома к обеду. Если CSS-фреймворки могут помочь вам создать более надежный макет за меньшее время, почему бы не попробовать?

(Изображение предоставлено Joejoe7 для начинающих )