Варварский снос декоративного ограждения ДНЦ РАН

14.08.2016
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc lacinia, metus et scelerisque pharetra, arcu diam facilisis tellus, eget posuere enim ligula sit amet est. Duis vel nisl ligula. Nulla vestibulum malesuada aliquet. Nulla ut vestibulum purus, ac semper lacus. Aenean imperdiet, dolor id consequat commodo, dui turpis eleifend ligula, a condimentum velit nibh et odio
"У вас используется Bootstrap, а вот там сказали, что это тормозит сайт и плохо и громоздко, и предлагают верстку, оптимизированную на уровне handmade" 
Итак, 
я могу лишь предполагать, почему и откуда "растут ноги", но не буду никого критиковать, сам тоже когда-то таким был. 

И все же Bootstrap придется хоть как-то "обелить" расставив точки над i и осветив один из самых его интересных моментов. 

Начнем

Современная адаптивная верстка может быть выполнена как в полностью handmade исполнении с точностью вылизывания каждого блока, так и с использованием готовых "промышленных" технологий. 

И одна из них - сетки. 

framework.jpg

Не стоит их отвергать или хаять, так как дизайн на основе сеток является стандартом де-факто уже далеко не один год, еще до популяризации адаптивности, и по сути уже баян, о котором никто не пишет. 

Для чего нужны сетки?

Чтобы ваш сайт превратить в аналог монолитного здания со свободной планировкой, которую может безопасно и просто перепланировать любой веб-мастер, и при этом с соблюдением единых стандартов. 

Отказаться от стандартов и создать верстку, прописав поведение всех (или только ключевых) блоков, ручками тоже можно, Но вы получите handmade проект, к которому кроме "создателя" остальные будут относиться с опаской, так как кто знает, что произойдет, если поправить этот стиль, заменить пимпочку на что-то другое. 

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

Но главный выигрыш от использования стандартов - скорость, универсальность. 
Если речь не идет о простеньких страничках или сайтах. 
Теперь отметим второй момент, когда популярность сеток резко выросла: 

Адаптивность

И тут преуспел Bootstrap, хотя есть и другие сеточные фреймворки (например 960.gs) 

Ах да. 
Забыл сказать следующее: 
Bootstrap - достаточно широкий фреймворк,в котором сетки просто один из "пунктиков", не считая адаптивности. 
Я редко встречал проекты, которые используют все 100% возможностей фреймворка. 
Но самое интересное, что многие сходу воспринимают Bootstrap именно как набор кнопочек, формочек и прочей всячности. Тем не менее, можно брать от него лишь то, что вам требуется. 

Именно поэтому говорить о том, какой он тяжеловесный, нельзя. 

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

Есть и интересные моменты. 
Если использовать готовые промышленные сетки вместо handmade верстки, то вес CSS, к примеру, наоборот может уменьшиться, а CSS могут стать проще, также как и "архитектура" верстки. 
Но самое главное - верстка на основе сеток читается верстальщиками гораздо легче чем хендмейд. Это преимущества любой стандартизации, когда освоив стандарт, можно легко работать с любым проектом, его поддерживающим 

Ну и живой пример на нашем опыте. 
Для решения TopShop мы создавали свои сетки, но... на базе промышленных стандартов. 

Но, начиная с решения Корп сайт, уже работаем строго с сетками Bootstrap (в первую очередь, чтобы встать на рельсы стандартизации, во вторую, он нам нравится, в третью - теперь это тоже "частичка" Битрикса, хотя на момент принятия нашего решения этого еще не было) 

А в решении Bxready: Маркет у нас даже есть свои хуки и патчи, корректирующие поведение родного Битриксовского Bootstrap. 

По сути мы не просто используем возможности Bootstrap, но и имплантировали в его генетику еще парочку нужных для наших решений возможностей. 

Пока мы использовали только: 
Сетки и часть типографики (вес очень мизерный и даже меньше чем хендмейдовская адаптивная верстка с CSS) 
Если понадобится что-то еще готовое, добавим. 
Но... делаем мы это осмысленно. 


Еще раз отметим почему это выгодно: 

1. Простота сборки макетов

Попробуйте провести модернизацию или перепланировку handmade верстки и правильно собранного сайта на сетках bootstrap. 

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

2. Простота модернизации и адаптации

Попробуйте поуправлять поведением блоков при адаптивности и поэкспериментировать при этом с АБ тестированием. 
И представьте handmade адаптив, когда боишься, что банальная перестановка стены обрушит все здание. 
Сравните скорости и затраты. 

Нельзя не отметить, что на сетках, в том числе и на сетках Bootstrap, многие вещи в отношении каркаса делаются быстро и гибко, ну и экономно, особенно, если работаешь с адаптивностью. 

Т.е. они как нельзя кстати подходят к современным реалиями 

Нейтральный итог:
В приницпе.... на многие моменты в Bootstrap существуют более крутые аналоги, но сетки... 
Мне вот просто нравятся и все тут :)

Вы еще верите, что Bootstrap это зло?

Если у вас новый Битрикс, попробуйте сдать его на анализы. 
А вдруг где-то в его клеточках притаился этот злобный и ужасный Bootstrap? ;)

Я же обычно интересуюсь, каким образом реализован дизайн и как работает адаптивность? 

Ну и еще интересный момент про bootstrap: 
Есть у него еще набор шрифтовых иконок GlyphIcon 

glyphicon.jpg

Прикольная штука, но одно "но". Набор состоит только из бесплатных иконок. 
Тем не менее есть альтернатива, которую знают многие: fontawesome (и радует, что этот набор теперь тоже в ядре битрикс и не надо его тащить извне) 

fontawesome.jpg

А еще я искренне поддерживаю разработчиков Битрикс в их решении в отношении сеток Bootstrap.

С уважением, Алексей Коваленко 

P.S. 
  • На самом деле не всем проектам или сайтам нужны промышленные технологии (сетки, адаптивность и прочее)
  • Сеточные технологии, в том числе и сетки Bootstrap, начинаются именно с дизайна. Поэтому сначала надо знать, как они работают и самое важное - это должен знать и соблюдать веб-дизайнер, иначе верстка превратится в "как бы эту картинку впихнуть в невпихуемое, или ну его нафиг, мне платят за точность, а не за пропаганду стандартов".
  • Настало время, когда до заказчика уже надо доводить, что есть моменты, в которых верстка должна быть строго по дизайну, а какие моменты варьируемые (резиновые, масштабируемые и т.д.), а это тоже труд.
  • Для меня до сих пор является непоняткой, если веб-мастер не знаком с сетками. При подготовке программистов я ранее использовал задания такого плана: сверстать простенький адаптивный макет, изучить Bootstrap, сделать тоже с помощью Bootstrap - и сделать соотв. выводы по простоте и скорости и когда это выгодно.
  • Реально встречал случаи некорректного использования bootstrap в модулях, отрицать не буду,, хотя также как и бездумное использование любого другого фреймворка, в том числе и Битрикс. 

Вернуться обратно
ОПУБЛИКОВАТЬ В СОЦ.СЕТЯХ