Обзор и отзывы о конструкторе сайтов Webflow - uGuide.ru

Обзор и отзывы о конструкторе сайтов Webflow

  • Обновлено:
    04.12.2019
  • Просмотры:
    323
  • Отзывы:
    0
  • Рейтинг: 4.3
Webflow – сервис для профессиональных разработчиков сайтов. По возможностям и формату является смесью Photoshop/Dreamweaver, CMS и конструктора сайтов с WYSIWYG-редактором. Навыков кодинга не требует. Уровень сложности освоения – выше среднего. Тестовый период не ограничен. Стоит ли переходить на платную подписку? Давайте разберёмся.

Целевая аудитория

Webflow пытается заигрывать с новичками, делая упор на формальном отсутствии необходимости кодинга. Это правда, здесь кодинг не нужен, но система этим проще не становится. Всё, что, по идее, нужно было реализовать через простые интеграции HTML-кода и правку стилей, сделано посредством введения классов и возможностью добавления HTML-элементов (div-блоков, заголовков и т. д.) в формате виджетов. Грубо говоря, разработчики внедрили виджеты с названиями основных HTML-тегов, а также классы свойств/атрибутов CSS-стилей с графическими переключателями и отчитались: у нас нет кодинга. По факту да, но сложность освоения лишь выросла из-за этого.

Да, по факту необходимость кодить отсутствует. Ввиду масштабности системы и гибкости, это лишь усложнило интерфейс и восприятие редактора. Слишком много всего здесь намешано. Лучше бы у Webflow был кодинг, который является универсальным знанием и пригодится в перспективе многим. Без него ничего проще не стало: легче запомнить названия тегов и синтаксис HTML/CSS, чем местную терминологию и классы. То, что поможет вам освоить этот редактор, больше нигде не пригодится в таком же формате. Конструктор совершенно точно не подходит новичкам. Он способен изначально запутать их, заложив искажённое представление о разработке сайтов.

Webflow подходит опытным дизайнерам и профессиональным разработчикам клиентских сайтов. Если вы хорошо пользуетесь Фотошопом, Иллюстратором и прочими продуктами этой серии, вам сервис понравится – у них много общего, интерфейсы похожи, пространства для креатива масса. Ощущение такое, будто имеем дело с конструктором от Adobe. Конечно, можно использовать минимум инструментов, ограничившись лёгкой правкой готовых шаблонов. Но, в таком случае, использование столь сложной и мощной системы теряет смысл. Для полной реализации потенциала системы потребуется опыт – и никак иначе.

Webflow позволяет создавать визитки, портфолио, лендинги, блоги и магазины. Разработчики позиционируют его в качестве альтернативы WordPress, указывая на отсутствие необходимости кодинга в роли основного преимущества. Спорное утверждение с их стороны. Сервис может стать эффективной платформой для разработки качественных небольших и средних сайтов – это легко. Крупные проекты можно создавать, но с затруднениями ввиду особенностей подхода, редактора и ограничений тарифных планов. В общем, Webflow – для творческих людей с опытом вёрстки веб-макетов и профессиональных разработчиков сайтов. Остальным он покажется сложным, невыгодным для освоения и вложений.

 

Функциональные возможности

Официальный сайт Webflow создан на родном движке. Изучив макеты страниц, получите более-менее полное представление об удачном варианте реализации возможностей редактора. Скажем так: создать нечто более продвинутое у вас вряд ли получится. Креативить, привнести море разнообразия в подачу – да, это вполне возможно, но общий уровень качества готовых сайтов вряд ли окажется выше, чем у самих разработчиков системы. Так что можете сразу на этапе знакомства с оф.сайтом прикинуть планку качества конструктора и сделать промежуточные выводы.

Webflow не имеет русскоязычной локализации. Интерфейс на английском. Основное преимущество сервиса – свобода в создании, размещении и настройке внешнего вида как целых секций, так и отдельно взятых элементов вроде кнопок, иконок, контейнеров для текста и прочего. Ближе всего по своей сути продукт находится к Adobe Muse. Имеем дело с визуальной вёрсткой макетов практически с нуля. Никаких ограничений, минимум шаблонных элементов. Можно вплоть до пикселя выверить параметры слоёв, переходов и прочего. Также здесь хорошо заходит анимация, сайты на движке могут быть очень нарядными.

В общем, Webflow – это, скорее, сервис для вёрстки макетов, а не конструктор в привычном понимании. То есть выбрать готовый шаблон, заменить или добавить блоки, настроить цветовую схему и запустить проект здесь не получится. Платформа о другом. В ней придётся учиться работать, пошагово разбирая приёмы оформления и правила взаимодействия между элементами. Можете рассматривать её как онлайн-редактор веб-страниц, интернет-версию Adobe Muse или что-то вроде этого. Почти всё здесь делается вручную с пониманием каждого шага. В редакторе минимум заготовок, позволяющих сделать автоматически красиво, он мощный и гибкий. Подойдёт тем, кто понимает, как верстать дизайн под конкретные проекты с нуля.

Изучение Webflow в достаточной степени для реализации приличных сайтов займёт примерно месяц-полтора у новичков. На самом деле, вы должны владеть хотя бы основами HTML/CSS. При использовании элементов и свойств стилей, редактор будет автоматически писать их код. Но вам придётся понимать, что происходит при добавлении DIV-блока, типов выравнивания и заголовков, использовании различных типов позиционирования элементов, отступов и т. д. Все эти штуки упакованы в интерфейс из галочек, ползунков и кнопочек, но это совершенно не избавляет вас от необходимости понимать их значение и уметь использовать в подходящих сценариях.

В итоге, кодинг вроде бы не обязателен для построения сайтов на Вебфлоу (хотя свой HTML-код можно вставить в любой элемент), но без наличия этих знаний вы не сможете пользоваться редактором. От слова совсем. Сюда нужно приходить подготовленными и в кодинге, и в вёрстке, иначе никакой пользы от системы вы не получите. Тем не менее, она может служить хорошим обучающим полигоном для тестирования различных подходов к вёрстке шаблонов, может быть использована параллельно с изучением HTML/CSS в качестве наглядного пособия для новичков. Но на быстрый результат не рассчитывайте. Редактор сложнее, чем у Adobe Muse.

Пример: здесь можно делать эффектные анимации, используя настройки свойств атрибутов CSS «Transitions» и «Transforms», но, если вы не знаете, что они означают, то не сможете нормально пользоваться! Придётся сначала разобраться. Отсутствие необходимости вбивать вручную синтаксис для преобразований макета ничем не поможет новичкам. То же касается и большинства других элементов редактора с их свойствами, кроме, пожалуй, настройки цветов, шрифтов, фонов и прочего в таком духе – там всё будет понятно без опыта.

 

Структура и возможности редактора

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

В системе широко используется система классов для идентификации объектов с определённым набором свойств. К примеру, можно создать 2 кнопки с разными параметрами, а потом присвоить каждой из них название класса. В итоге, вы сможете добавлять эти кнопки на макет через имя класса, чтобы не переделывать с нуля, соблюдая нужную стилистику. Такое можно проделывать с любыми объектами. Главное – не запутаться в созданных классах. При наведении на объект можете выбрать для него класс в поле «Selector» - там будут отображаться и шаблонные, и ваши заготовки.

Правый сайдбар содержит 4 вкладки: первая с классами и опциями стилей объектов, вторая – с настройками для присвоения ID div-блокам и добавления кастомных атрибутов, третья – менеджер стилей с перечнем всех использованных на странице классов элементов (и своих, и стандартных), а четвёртая позволяет добавлять триггеры для объектов и целых страниц, то есть задать их поведение при активации (открытии или наведении мыши). Совокупно такой набор свойств позволяет гибко настраивать дизайн для всех версий (ПК, смартфон, планшет) адаптивного макета.

В левом сайдбаре значок «+» скрывает то, что мы привыкли называть виджетами в других конструкторах. Основными элементами, с которых начинается разметка холста являются секция, контейнер, сетка и колонки. Среди базовых – div-блок, ссылка, кнопка и маркированные списки. Далее идут заголовки и другие вариации текстовых элементов. Есть возможность подключения коллекций – наборов динамически изменяемых элементов вроде блога или галерей. Что-то вроде баз данных с контентом.

Большое внимание уделено формам – здесь множество виджетов для их подачи и настройки. Есть также привычные медийные элементы вроде картинок, видео (фоновое тоже) и анимаций. Карта, выпадающее меню, табы, слайдер, поиск, виджеты социалок - в наличии и корректно работают. Также можно вставить свой HTML-код для добавления каких-то кастомных вещей либо интеграции сторонних сервисов (социалок, онлайн-консультантов, счётчиков, сервисов уведомлений и т. д.). То есть код всё же можно добавить вручную. В настройках сайта можно добавить и JavaScript в хедер.

В общих параметрах редактора есть раздел с бэкапами, которые создаются автоматически примерно каждые полчаса. Пошагово отматывать изменения можно стрелочками в верхнем меню редактора. Для добавления поиска на сайт его нужно опубликовать на хостинге. В разделе настроек почты можно выбрать превью и цвета для оформления писем. На бесплатном тарифе в футере писем будет приписка «Powered by Webflow».

В нижней части левого сайдбара находятся иконки для активации направляющих линий макета, контуров отдельных объектов и пустых элементов. Также есть общий поиск по названию чего-либо, размещённого на сайте. Тут же находится ссылка на обширную коллекцию обучающих видео, коротких и крайне информативных. Есть ещё одна интересная бета-функция – CSS Preview: после перетаскивания в окошко любого объекта с макета вам покажут его CSS-стили. Увы, можно только посмотреть их, редактировать таким образом не получится.

 

Опции магазина

У Webflow довольно приличный магазин. При его активации система автоматически создаёт коллекции данных и страницы для вывода категорий и перечня товаров. Опций множество, здесь можно делать крутые магазины, особенно по части оформления. Товары можно экспортировать/импортировать массово в формате CSV, причём, образец таблицы для наполнения система выдаёт по нажатию на «Export».

Есть возможность добавлять поля для категорий и отдельных товаров, менять URL и подключить SSL. Можно также настраивать валюты, способы доставки, оплаты и налоги, но всё это делается вручную – встроенной интеграции Сбербанка, Яндекс.Кассы и прочего здесь нет. Придётся вручную через код добавлять, если нужно.

Особое внимание уделено дизайну: можно отдельно оформить витрину, корзину, форму заказа, страницу товара и всё остальное из этой серии. При добавлении товара опций море, включая дополнительные поля свойств в любом количестве, изображения продукта, а также опции вроде размеров, цветов и материала. Для отслеживания заказов есть панель «Orders», все заявки в любом статусе стекаются в эту таблицу.

В целом, магазин у Webflow непросто настроить, но результат может получиться весьма привлекательным. В принципе, другого мы не ожидали от инструмента вёрстки макетов для дизайнеров.

 

Блог

Новостную ленту можно добавить виджетом из раздела «CMS Collections». Кстати, там же сможете посмотреть обучающие видео и прочесть статьи о назначении и способах настройки данного инструмента. На выходе получаем динамический контент – базу данных для определённой части сайта. В данном случае, речь о статьях для блога.

Суть такова: нужно настроить общие параметры блога, выбрав его страницу в навигаторе, а потом публиковать посты по мере необходимости. Они будут оформлены в соответствии с макетом (он доступен для персонального редактирования) и вводными по SEO. Возможна вставка своего кода, но она доступна только на платных тарифах.

Посты можно добавить в разделе «CMS Collections» в любом количестве – база данных не ограничена в объёме. Есть возможность сохранения черновиков и добавления публикаций в рекомендуемые читателям. Короткая новость, титульное и главное изображения, тело статьи – такова структура материалов. Отложенной публикации нет. Текстовый редактор никакой в прямом смысле – его нет, так что в поля нужно вставлять форматированные нужным образом материалы. В целом, блог у Webflow средний по удобству и гибкости настроек, может пригодиться.

 

Dashboard

В левом верхнем углу редактора есть буква «W», которая скрывает меню доступа к дашборду, общим настройкам проекта и WYSIWYG-редактору. Давайте обо всём по порядку.

Дашборд – это панель, в которой лежат все ваши проекты, то есть сайты. Здесь вы можете создавать новые, удалять, переименовывать, делиться ими, дублировать, раскладывать по папкам и прочее. Тут же находятся настройки аккаунта, в которых можно добавиться в команду разработчиков, оформить публичный профиль, посмотреть покупки, тарифы и ещё много всего по части безопасности, уведомлений и т. д. Вокруг Вебфлоу образовалось плотное сообщество дизайнеров, анкеты которых вы можете видеть, перейдя из дашборда во вкладку «Designers». Примеры классных работ лежат в «Showcase», по соседству с техподдержкой «Learn & Support», которая здесь весьма неплохо работает. В общем, дашборд – это личный кабинет с кучей полезных, интересных возможностей.

«Project Settings» - панель управления проектом. Настроек здесь миллион, все они разбиты на разделы: общие, хостинг, редактор, биллинг, SEO, формы, шрифты, резервные копии, интеграции, кастомный код. По названиям можно понять, что они примерно означают. Подключить тарифный план, хостинг, системы сбора статистики, кастомные шрифты (от Google, Adobe либо какие-то свои), добавить интеграции сторонних сервисов (есть даже доступ к API), собственный код на сайт, настроить уведомления, формы, брендинг, параметры редактора, какие-то общие данные для сайта – всё это и многое другое делается здесь. Мощный раздел со всеми настройками отдельного сайта помимо, собственно, редактирования макета.

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

Итак, подведём итоги по функциональности Webflow. Порядок работы такой:

  1. Создаёте проект;
  2. Верстаете макеты страниц в режиме дизайнера;
  3. Дорабатываете их в WYSIWYG-редакторе;
  4. Настраиваете сайт в «Project Settings»;
  5. Публикуете.

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

Все это в совокупности позволяет создавать красивые и даже объёмные сайты, если хватит терпения и навыка на их создание. Авторские проекты. Понравится дизайнерам и тем, кто страстно желает ими стать. Обычным пользователям Webflow противопоказан: ради создания одной визитки детально осваивать нечто вроде Photoshop/Muse по сложности совершенно нерентабельно. Тем не менее, можно зайти и бесплатно потренироваться.

 

Дизайны и работа с шаблонами

Webflow – система про дизайн, прежде всего. Содержит огромное количество готовых шаблонов. Сотни. Каких угодно. Большинство платные, стоят от $24 до $149. Бесплатных чуть более сорока. Есть для портфолио, магазина, бизнес-темы, блоговые, универсальные, визиточные и т. д.  Качество отлично, что не удивительно, но всё варьируется. Все адаптивные, но некоторые на вид чуть более удачные, чем остальные. У них нет каких-то очевидно общих принципов структуры – всё хаотично, разнообразно, местами похоже, но, в целом, весьма интересно.

Для каждого шаблона можно посмотреть описание и превью прямо в режиме дизайнера редактора или в полноэкранном стандартном браузерном режиме. Изучение чужих работ даёт много пищи для наследования идей, креатива, изучения каких-то технических моментов системы. Если вы – дизайнер, то рекомендуем посмотреть несколько шаблонов. Сможете прикинуть уровень редактора и приёмы, которые часто используют пользователи Webflow.

Конечно, есть опция создания макета с нуля, на что, в принципе, и рассчитана система. Теперь самое интересное: вы можете скачать код созданного макета, но не бесплатно. Для этого придется заплатить минимум $16/месяц для доступа к экспорту кода 10 проектов. Вебфлоу может работать в режиме качественного онлайн-редактора визуальной верстки с платной подпиской на манер того, как это организовано у продуктов Adobe.

C полученными макетами можно делать что угодно. Есть, к примеру, инструменты, позволяющие адаптировать Вебфлоу-шаблоны для WordPress. За обычные HTML-сайты и лендинги вообще молчим – это очевидный ход. В общем, сервис можно использовать в качестве онлайн-редактора для вёрстки макетов сайтов, игнорируя его SaaS-возможности. Так многие и поступают.

Любой макет можно редактировать в десктопном и мобильном режиме. Набор средств оформления структуры и дизайна проектов впечатляет. Каждый готовый шаблон сопровождается тематическими картинками, иконками и прочими элементами (раздел «Assets» левого сайдбара). Понятно, можно загрузить свою библиотеку графики и прочего. Навигатор, классы, виджеты, линейки, направляющие, подсветка структуры макета, обширный набор CSS-стилей, выраженных в графическом интерфейсе, – всё это понравится опытным разработчикам, поможет создать новые шедевры для своих клиентов.

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

 

Оптимизация (SEO) и продвижение

Webflow автоматически пишет код страниц на основе макетов, создаваемых в режиме дизайнера и WYSIWYG-редакторе. Код довольно высокого качества, сайты адаптивные, что любят поисковые системы. У каждого проекта есть SEO-настройки: правка robots.txt, генерация sitemap.xml, выключения индексирования сайтов на временных поддоменах формата mysupersite.webflow.io, а также принудительный запрос на верификацию сайта Google.

Каждая страница позволяет задать для себя значения мета-тегов заголовка, ключевых слов и описания содержимого, есть опции для разметки OpenGraph. Каждый блоговый материал, товар магазина тоже содержит SEO-настройки. Можно подключить внешние системы аналитики через вставку кода. По умолчанию есть поля для активации статистических сервисов Google. Поддерживается Facebook Pixel, а также Webhooks через доступ к API.

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

 

Ценовая политика Webflow (цены на тарифы)

Webflow – сервис с отличным визуальным редактором вёрстки (режим дизайнера) и неплохим WYSIWYG-редактором. Оба можно использовать бесплатно для тестирования возможностей и тренировок новичков. Но некоторые опции, особенно те, что касаются SEO-оптимизации, окажутся неактивными. Если вы желаете использовать сервис на полную катушку и публиковать сайты из личного кабинета на фирменном хостинге под своим доменом, получить все возможности и настройки, включая экспорт кода, тогда придётся заплатить. И немало.

Webflow предусматривает 2 сценария использования - в качестве SaaS-платформы (создание и размещение сайтов на хостинге тут же) либо редактора для дизайнеров с возможностью экспорта кода полученных макетов с последующим использованием их где-угодно. То есть конструктор либо онлайн-редактор на основе подписки.

Конструкторские тарифы делятся на обычные и магазинные, цены за месяц при оплате за год вперёд (20% скидка):

  1. Website Basic ($12/мес) – подключение своего домена, бесплатный SSL, CDN, 100 статических страниц, 25 000 уников трафика в месяц, 500 отправок данных в формы.
  2. Website CMS ($16/мес) – активация CMS (динамического контента), 100 статических страниц, 100 000 трафика, 1 000 отправок данных в формы, 2000 элементов для базы CMS (Collections), доступ к CMS API, поиск по сайту, возможность привлечения 3 контент-менеджеров к проекту.
  3. Website Business ($36/мес) – трафик в миллион посетителей в месяц, 100 статических страниц, 10 000 элементов CMS, 10 контент-менеджеров, возможность загрузки файлов в формы.

Очевидно, тарифы чётко и довольно жестко разграничены между собой количественными характеристиками. Всё упирается в объём сайта, особенно в количество статей блога или другого динамического CMS-контента. Ограничения трафика неприятны, но цифры довольно большие, должно хватать. Функциональность на магазинных тарифах ещё сильнее фрагментирована:

  1. Standard ($29/мес) – все возможности тарифа «CMS», а также настройки оплаты, доставки, налогов, 3 аккаунта для менеджеров, интеграция витрины в Facebook/Instagram, настройка форматов Email, ограничение до $50k продаж в год, 2% комиссии с транзакций.
  2. Plus ($74/мес) – все возможности тарифа «Business», а также отсутствии комиссии с транзакций, порог прибыли в $200k/год, отсутствие подписи сервиса в почтовых рассылках, 10 аккаунтов менеджеров.
  3. Advanced ($212/мес) – всё, что в тарифе «Plus», а также приём Stripe и PayPal-платежей, 15 аккаунтов для менеджеров магазина, безлимитный годовой оборот, нулевая комиссия с продаж.

Тарифы с доступом к экспорту кода (Account plans) позволяют временно публиковать проекты на бесплатном хостинге для демонстрации, а потом продавать их клиентам. Есть бесплатная версия, на которой начинают все новые пользователи в системе. Она допускает создание 2 проектов, но без экспорта кода. В общем, тестирование системы и обучение для новичков. Платные пакеты следующие (оплата за месяц при условии подписки на 1 год вперед):

  1. Lite  ($16/мес) – 10 проектов, выставление счетов клиентам, экспорт кода, трансфер проектов на другие аккаунты системы, публикация до сотни статических страниц и 50 динамических элементов на бесплатном хостинге.
  2. Pro  ($35/мес) – неограниченное количество проектов, доступ к ребрендингу платформы (White Labeling), защита сайтов паролем.

Есть еще Team-план для командной разработки сайтов. Там разблокировано и разрешено делать все, стоимость в месяц за 1 члена команды - $35. Если нужно добавить более 25 человек, то вступают в силу другие условия, о которых нужно договариваться индивидуально с менеджером сервиса. Это уже Enterprise-тариф.

Как видите, у  Webflow крайне сложное ценообразование, да и стоимость от одного тарифа к другому растёт лавинообразно. Честно говоря, платная вариация сервиса неинтересна. Просто ввиду цен. В качестве бесплатного онлайн-редактора или полигона для учёбы новичков система хороша. Но она откровенно дорогая. И не стоит своих денег. Реализовать творческий потенциал можно и в других сервисах или программах.

В конце концов, аудитория у системы – профессионалы, которые и до Webflow как-то работали. Пакетных тарифов на несколько доменов здесь нет. Везде указана цена за содержание 1 сайта на домене. Проектов может быть много, но опубликованный на своём домене и со всеми плюшками – всего один. Для нашего рынка эти цены – космос, использование сервиса теряет смысл. Попробуйте убедить клиента, что ему стоит вложить только в движок магазина $2.5к в год, не говоря уже за разработку и прочее. Кому это нужно?

 

Плюсы и минусы

Webflow хорош в своём роде. Он является отличной альтернативой Muse и прочим программам для вёрстки. Может быть простым конструктором новичка или мощным орудием в руках дизайнера. Тем не менее, лучшая роль – бесплатный редактор, так как сервис дорогой в платной версии. Плюсов множество:

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

Минусы завязаны, прежде всего, на тарифах и стоимости:

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

В целом, Webflow с технической точки зрения – отличный продукт. Но. Многим новичкам покажется сложным или дорогим – более доступных и удобных альтернатив полно. Дизайнеры могут верстать в нём макеты, оплатив минимальный индивидуальный тариф с доступом к экспорту кода, а потом адаптировать их для других CMS. А кому покупать сервис в формате CMS (с хостингом)? Трудно сказать. Большие сайты делать не очень удобно. Магазины, кстати, тоже. Получается хорошо, но мороки много. Для визиток, портфолио и лендингов с авторским дизайном – самое то, но дорого же. Стоит ли оно того? Думайте сами.

 

Альтернативы и конкуренты

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

Лучшие аналоги Webflow:

uKit.com
uKit – конструктор, в котором легко создавать бизнес-сайты. Лендинги, визитки, портфолио – те же дисциплины, в которых силён Webflow. Магазины тоже поддерживаются. Да, всё это с шаблонным дизайном, но симпатичным и адаптивным. В удобном визуальном редакторе, без кодинга, непонятных настроек и платных шаблонов. Эти сайты хорошо индексируются, нормально продвигаются, быстро работают. И, что важно, доступны по цене каждому. Сервис подходит и новичкам, и разработчикам клиентских сайтов.
uCoz.ru
uCoz – мощный конструктор магазинов и блогов. Всё остальное он тоже может, но лучше использовать для больших, перспективных проектов. Тоже довольно сложный и гибкий, требует знаний кодинга. Большие сайты получаются легче, более удобны в администрировании и стоят намного дешевле на фоне Webflow. Готовых шаблонов масса, платных/качественных в том числе. Уступает лишь гибкостью визуального редактора, практически во всём остальном превосходит героя обзора вполне ощутимо.
Wix.com
Wix – хороший конструктор для творческих людей. Его редактор предоставляет приличный простор для настройки дизайна макетов по множеству параметров. Размеры, цвета, ориентация элементов, слои, эффекты, анимации и прочее здесь тоже есть. Зато интерфейс не в пример более простой. Встроенный магазин приложений позволит в пару кликов добавить возможности, а также интеграции сторонних сервисов без кодинга. Шаблоны красивые, их много, редактировать несложно. Дизайнерам и новичкам вариант подходит одинаково хорошо.

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

 

Примеры сайтов, созданных в Webflow

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

 

Выводы и рекомендации

Webflow – американский SaaS-сервис для дизайнеров. Интерфейс англоязычный. Может быть использован в качестве платного веб-редактора для создания/экспорта своих шаблонов дизайнерами (от $16/мес) и в роли полигона для упражнений новичков бесплатно. В формате CMS стоит неоправданно дорого. Функциональность отличная, можно воплотить что угодно. Но для реализации этого потенциала нужны навыки в обязательном порядке – кодинг HTML/CSS и вёрстка макетов сайтов.

Стоит ли использовать? Да,  для верстки уникального дизайна клиентских сайтов за $16/мес на минимальном индивидуальном тарифном плане. В бесплатной версии пригодится новичкам в  качестве редактора веб-страниц - полигона для обкатки навыков в процессе изучения HTML/CSS и пробы сил в дизайне. В формате с хостингом для публикации сайтов сервис нерентабелен, учитывая цену и возможности конкурентов. Учить редактор новичку ради создания 1 сайта для себя - это чушь, так делать не стоит. Трудозатратно, дорого.

Webflow подходит тем, у кого создание сайтов на потоке, а навык разработки отшлифован. Сервис рентабелен для профи, работающих на состоятельных клиентов. Новичкам, помимо возможности использования тренировочной площадки бесплатной версии, от него пользы мало – проще и выгоднее собрать сайт в любом другом популярном конструкторе.

  • Автор:

no avatar