# 175: 7 вещей, которые нужно знать о Webflow - CSS-хитрости

Anonim

(Это спонсируемое видео, над которым я работал вместе с нами в CSS-Tricks и Webflow. Я думаю, что Webflow - замечательный продукт для создания веб-сайтов, который, на мой взгляд, сейчас находится в отдельной категории. Это занимает немного времени. чтобы поразмыслить, надеюсь, это видео поможет вам в этом.)

1) Webflow был создан для профессиональных дизайнеров и разработчиков

Уже знаете, как создавать сайты с помощью кода? Это потрясающе. Это не значит, что Webflow ниже ваших возможностей. Webflow представляет собой те же абстракции, что и HTML и CSS, но предоставляет эти интерфейсы на визуальном холсте.

2) В основе Webflow лежат повторно используемые стили

CSS-разработчик внутри вас, вероятно, жаждет превратить все в классы. Класс - это лучший инструмент CSS для повторного использования. Хорошие новости: все, что вы создаете в Webflow, буквально осуществляется с помощью селектора, являющегося классом. Даже не «как» класс. Это настоящий класс под капотом. Webflow не подделывает сеть, это сеть.

3) Webflow имеет такие функции, как Flexbox и CSS Grid.

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

Обеспокоены адаптивным дизайном? Webflow полностью покрывает это. Когда вы изменяете размер и точки останова, сам холст меняет размеры, а установленные вами стили перетекают вниз от большого к маленькому.

4) Публикуйте быстрее, меньше беспокойтесь

Когда вы закончите проектирование сайта в Webflow, вы не передаете его кому-то другому для создания в другом месте. Вы уже сделали, вы создали сайт. Вы можете нажать кнопку публикации, и она будет доступна по URL-адресу за секунды. Затем вы можете сопоставить с ним любой другой домен, и у вас есть проблема с хостингом и развертыванием. Нет SFTP. нет проблем с безопасностью. Никаких обновлений программного обеспечения вам не придется делать самостоятельно.

5) Webflow CMS чрезвычайно мощная и создана с учетом потребностей клиентов и маркетологов.

Webflow имеет встроенную CMS, столь же мощную, как и любые другие. Вы настраиваете именно ту модель контента, которая вам нужна (очевидно, кодирование не требуется), и вы ее получили. В каком-то смысле как конструктор форм. Затем эти поля можно будет использовать в ваших шаблонах так же легко, как и статическое содержимое.

Возможно, лучшая часть состоит в том, что создание и редактирование этих данных становится возможным через минимальный интерфейс прямо на самом сайте. Каждое поле, которое есть в CMS (и которое вы разрешили), можно редактировать прямо во внешнем интерфейсе действующего сайта. Внизу также есть панель для создания и редактирования контента через интерфейс администратора. Это лучшее из обоих миров: редактирование на странице и редактирование в стиле формы.

6) Инструменты анимации Webflow - новый уровень

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

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

7) Для вас есть масса обучающего контента и сообщества

Изучение Webflow - не удача. Надеюсь, вы найдете несколько сообщений в блогах или видео на YouTube. Webflow University полностью бесплатен и содержит все, что вам нужно знать о создании веб-сайтов с помощью Webflow. Это может быть ваш учебный лагерь.

Попробуйте Webflow