Лендинг, юзабилити, адаптив... Как понять своего дизайнера?

Итак, вы заказчик, и вы решили обратиться к дизайнеру, чтобы он сделал вам сайт. Приходите к нему с запросом "Сделай мне красиво", а он начинает сыпать незнакомыми терминами... Знакомо? Чтобы таких ситуаций не было, написала небольшой ликбез, который позволит говорить с подрядчиком на одном языке.

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

Подробнее про юзабилити можно почитать здесь.

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

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

Конечно, многостраничник предполагает гораздо больший объем работ и, как правило, он дороже. Но бывают и дешевые многостраничники с типовыми, шаблонными страницами, и очень дорогие лендинги с иллюстрациями и сложными анимациями.

Планируя редизайн сайта, я запрашиваю у клиента данные Google Analytics, Яндекс.Метрики и другую информацию по обратной связи от клиентов. Я анализирую, где именно пользователи испытывают проблемы при взаимодействии с сайтом и предлагаю решения на основе своего опыта.

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

К сожалению, нет. Тренды дизайна обновляются, CMS тоже - чтобы ваш сайт оставался актуальным, необходимо хоть немного, но редизайнить его, хотя бы раз в 2-3 года. Это не обязательно должна быть полная переработка дизайна - достаточно изменять небольшие элементы, как это делает, например, Amazon или Google. Также необходимо следить за показателями метрик и оптимизировать сайт, чтобы он наилучшим образом соответствовал запросам пользователей.

Поэтому, заказывая сайт, оставайтесь в рамках бюджета. Помните, что ему будет нужно своевременное обновление. А чем дороже сайт - тем дороже будет и редизайн.

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

1. Суперсложный дизайн и суперуникальную анимацию вы здесь не создадите.

2. За пользование всеми ресурсами Тильды нужно платить ежемесячно.

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

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

Чтобы дизайн получился по-настоящему уникальным, я использую:

• Zero-блоки - фреймы, которые нужно дизайнить самостоятельно. Тут нет шаблонов, такие блоки собираются по отдельным элементам интерфейса. Сложная анимация тоже прорисовывается в zero-блоках. Кроме того, zero-блоки не адаптируются автоматически под мобильную версию - ее тоже нужно отрисовывать отдельно.
• Креативную обработку изображений. Не все фото, которые присылает клиент, можно выкладывать на сайт в первозданном виде. Где-то надо отретушировать их, где-то - изменить фон или форму.
• Некоторые элементы - например, баннеры - все равно нужно отрисовывать с нуля.

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

Адаптив - это версия сайта, предназначенная для другого, отличного от основного, разрешения. Чаще всего за основу берется десктоп-версия (для компьютера), и на ее основе делается адаптив для мобильного и (иногда) планшета. Но бывает и такое, когда изначально дизайнится версия для мобильного - это происходит, когда, по результатам аудита, у клиента больше посетителей со смартфонов, чем с компьютера.

Я настоятельно рекомендую делать сайт хотя бы в двух версиях - десктопной и мобильной. Потому что сейчас сложно представить, чтобы какой-либо сайт никто не просматривал через телефон.

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

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

Так же и с дизайном - чтобы создать что-то красивое, дизайнеру нужно от чего-то отталкиваться. Любой профессиональный дизайнер может создать красивый сайт в абсолютно любой стилистике, но какая из них зайдет заказчику - знает только заказчик. Конечно, в процессе работы дизайнер предложит какие-то варианты, посоветует, но изначальный вектор должен быть выбран. Либо вы должны полностью довериться вкусу дизайнера.

Дизайнер делает дизайн - то есть, визуальный макет сайта, картинку. Чтобы сайт "появился" в интернете, нужно сначала сделать его верстку, а затем разместить на движке (CMS).

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

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

CMS - это система управления сайтом. Чтобы сайт разработал, его код (верстку) нужно разместить на CMS. Наиболее популярные системы - WordPress, Битрикс, OpenCart - с ними работает достаточно много специалистов. Также есть самописные движки, которые создаются под конкретный сайт.

Углубляться в тематику разработки не буду, это очень большая тема. Здесь я только хочу показать, что в понятие дизайна сайта не входит его верстка и размещение на CMS. Да, есть дизайнеры, которые умеют делать верстку. Есть дизайнеры, которые могут сделать весь комплекс работ по сайту. Но либо они очень дороги, либо качество их работ оставляет желать лучшего, потому что ИМХО невозможно развиваться во всех сферах одинаково успешно.

Признаюсь, уже давно не встречала веб-дизайнера, который бы работал в Фотошопе. Сейчас практически все специалисты перешли на Фигму - онлайн-ресурс для создания макетов.

В Фигме легко создавать прототипы, дизайн, кликабельные прототипы - то есть, сразу можно будет показать, что будет происходить при нажатии на ту или иную кнопку. Это онлайн-сервис, поэтому не нужно пересылать для показа заказчику никакие файлы - достаточно скинуть ссылку. Я сталкивалась с тем, что для многих заказчиков непривычно просматривать макеты в Фигме, но это дело практики. Попробуете один раз - и поймете, насколько это удобно.

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

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

Надеюсь, статья была полезна. Если у вас остались вопросы по поводу дизайна и того, как там все работает, буду рада ответить!