Какие технологии вы используете для лендингов?

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

  • Slick slider
  • Font awesome
  • scroll-reveal
  • parallax


Что ещё интересного и полезного можете предложить?
  • Вопрос задан
  • 12701 просмотр
Решения вопроса 1
Nikolay12
@Nikolay12
Верстальщик
Если без фреймворка, а просто верстка по макету, то:
  • Emmet - быстрый кодинг html и сss
  • less - переменные для шрифтов, вложенность селекторов или бэм-нейминг.
  • flexbox - для сетки, расположения элементов и респонсива.
  • autoprefixer - добавление css-префиксов
  • Imagemin-pngquant - для сжатия картинок
  • gulp - для сборки вышеперечисленного
  • slick - карусели и слайдеры
  • remodal - модалки


Если использовать фреймворк, например, bootstrap, то быстрее будет работать с исходниками бутстрапа и потом собрать их:
  • переопределить переменные
  • подключить нужные js-скипты из коробки
  • подключить нужные less-стили
  • собрать это всё галпом
Ответ написан
Пригласить эксперта
Ответы на вопрос 11
Sanes
@Sanes
Uikit CSS Framework в плане верстки закроет 99% свистелок.
Ответ написан
HelpSophie
@HelpSophie
Нормального дизайнера.
Ответ написан
verbart
@verbart
Так как из проекта в проект многое повторяется, я решил сделать для себя небольшой старт-шаблон, включающий всё необходимое для простого и быстрого начала нового проекта, чего и вам желаю.

Мой шаблон для вёрстки - https://github.com/verbart/start-site
Мой шаблон для AngularJS проектов - https://github.com/verbart/ng-boilerplate

Был опыт использования штуковин вроде TARS, но я люблю контролировать каждую деталь, а с ними это не выходит. Слишком много лишнего, не достаточно гибкая структура.
Ответ написан
xmoonlight
@xmoonlight
https://sitecoder.blogspot.com
@Kjuri
Если ориентироваться на ваш список, те. различные скрипты js ( анимация, паралакс и слайдер) + шрифты, то список окажется очень длинным. Нужное используется по мере необходимости и исходя из минимизации допиливания.
Разве что из постоянных:
Fancybox - модальные окна для более сложных вариантов
Owl - адаптивная каруселька
+свои наработки для ajax заявок и простых модальных

Но могу заметить, это не то что серьезно влияет на скорость работы - сделать сайтик и не поставить какой-нибудь js скрипт это сейчас редкость.

Берите выше - для ускорения одних js-скриптов недостаточно.
Это и обвес своего редактора нужными плагинами (Emmet в первую очередь)
Это изучение клавиатурных сокращений (серьезно так ускоряет)
Это npm, сборщик проектов (gulp, grunt) + соответствующий обвес
Это фреймворк (bootstrap)
Это препроцессоры
Вот такой начальный список, а дальше - смотря что найдете и изучите полезного в интернете.
Ответ написан
@soofftt91
По технологиям для оптимизации вёрстки:
  • bootstrap
  • Font awesome
  • свои наработки (шаблоны целых блоков) на основе бутстрапа
  • Sass


Из "фишек" популярных в среде БМ и прочих клубов по интересам:
  • геотаргетинг (link)
  • мультилендинг (link)
Ответ написан
shapovalov_org
@shapovalov_org
Инженер-программист
Как не странно с головой хватает Бутстрапа, а для серверной части фреймворк Yii например, на случай если клиенты захотят вырастить из лендинга полноценный сайт, что частенько бывает
Ответ написан
@xxvxx
....
вообще они делаются 1 раз и в код обычно больше не смотрят.... если ты их постоянно делаешь adobe muse то с ним будет быстрее...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы