46 постов

#ux

Статьи с тегом #ux.

← Все статьи

(01) Умные формы — подсказки, автозаполнение, валидация Форма заявки — последний метр между интересом и сделкой, и именно тут утекают лиды. Маска телефона, автоподстановка города, валидация на лету и автофокус снижают трение, а ошибки показанные по-человечески удерживают клиента. Меньше полей — больше отправок. (02) Плейсхолдеры и подсказки в полях формы Форма заявки — последний метр перед заявкой, и на нём теряется больше, чем кажется. Частая причина — поля, которые молчат: непонятно, что писать и в каком формате. Разбираем, почему плейсхолдер не заменяет подпись и как формулировки полей меняют конверсию. (03) Сравнительная таблица тарифов — как не запутать клиента и подтолкнуть к выбору Пять колонок, двадцать строк и галочки, в которых чёрт ногу сломит, — и клиент не выбирает средний тариф, а закрывает вкладку. Слишком большой выбор не радует, а парализует. Показываем, как собрать три тарифа так, чтобы человек дошёл до решения. (04) Блок «Как мы работаем» — этапы, снимающие тревогу Клиент готов оставить заявку, но его тормозит вопрос «а что дальше?». Простая цепочка из 4-6 шагов от заявки до результата — со сроками, точками оплаты и тем, что нужно от клиента — снимает страх неизвестности и убирает половину возражений ещё до созвона. (05) Форма заявки, которая не отпугивает: поля, шаги, валидация Каждое лишнее поле и невнятная ошибка режут заявки. Разбираем минимум полей, порядок, inline-валидацию, шаги для длинных форм, мобильную клавиатуру и доступность. (06) Вебвизор и карты кликов — увидеть сайт глазами клиента Вам кажется, что на сайте всё понятно, а Вебвизор показывает обратное: клиент мечется, жмёт в некликабельное и уходит, не доскроллив до формы. Разбираем, как за десять записей сессий и три тепловые карты увидеть сайт его глазами и что чинить в первую очередь. (07) Холодный и горячий посетитель: два маршрута на одном сайте Горячий посетитель искал именно вас и хочет быстро: цену, телефон, «заказать». Холодный сравнивает пятерых и сначала ищет доверие. Один сайт спокойно ведёт обоих — если правильно расставить блоки: быстрый путь к действию сверху, материалы для сомневающихся ниже. (08) Core Web Vitals в 2026: LCP, INP, CLS — что чинить первым LCP, INP и CLS — три метрики Core Web Vitals, которые влияют на позиции и конверсию. Целевые значения, частые причины плохих оценок и понятный порядок: что чинить первым. (09) Язык клиента vs язык подрядчика — как говорить о сложном без жаргона «Адаптивная вёрстка с прогрессивным улучшением» — клиент не понял, почувствовал себя глупо и ушёл. Профжаргон на сайте кажется признаком экспертизы, а работает как стена между вами и заказчиком. Учимся переводить термины в выгоды и проверять текст на понятность. (10) Тексты на сайте услуг — как писать, чтобы дочитывали и звонили «Мы динамично развивающаяся компания» — и вкладку закрыли. Текст на сайте услуг это продавец, который работает без вас: если он мямлит канцеляритом, заявки не будет. Разбираем, как писать про клиента, убирать воду и проверять текст на читаемость. (11) Путь клиента по сайту — от первого визита до заявки и где теряются люди 800 визитов в месяц, 4 заявки. Первый рефлекс — «реклама не работает», но чаще проблема не во входе, а в том, что происходит после: с главной нет ссылки на услугу, страница услуги без кнопки, цены спрятаны. Раскладываем путь клиента на четыре шага и показываем, где именно рвётся цепочка и как это увидеть в Метрике. (12) Посетитель приходит не на главную — каждая страница как точка входа Собственник представляет сайт как главную страницу: слайдер, преимущества, «о компании». А Метрика показывает: 60-80% людей приземляются мимо — на статью, услугу, карточку товара прямо из поиска. Витрину, которую вылизывали три месяца, большинство гостей не видит. Разбираем, что должна уметь каждая страница, чтобы случайный вход превращался в заявку. (13) Устаревший контент — как «новости 2023» и старые цены убивают доверие Последняя новость на сайте — поздравление с 2024 годом, копирайт в футере © 2023, баннер «акция до 31 декабря» висит второй год. Посетителю хватает 20 секунд на вывод: фирма умерла. Разбираем, какие мелочи выдают заброшенный сайт, почему мёртвый блок хуже отсутствующего и как за 30 минут в квартал держать сайт живым. (14) Всплывающие окна — когда работают, а когда убивают доверие Вы открыли сайт, ещё не успели прочитать заголовок — а вам уже в лицо прыгает «Подпишитесь на рассылку!». Это как продавец, кидающийся с анкетой у входа в магазин. При этом попапы — самый конверсионный элемент на сайте: в среднем 3%, у лучших — 9%+. Разбираем, где граница между «работает» и «бесит». (15) Калькулятор стоимости на сайте — когда приводит лиды, а когда отпугивает Владелец студии ремонта заплатил 150 тысяч за красивый калькулятор — за полгода тот принёс три заявки. А у грузоперевозчика такой же виджет даёт половину всех лидов. Разница не в дизайне: калькулятор работает там, где цена — это формула, и вредит там, где цена — это разговор. Разбираем, где граница. (16) Форма заявки: 3 поля или 10 — что данные говорят о конверсии Expedia убрала одно поле из формы и заработала +12 млн долларов в год. Но у медали две стороны: форма из двух полей в B2B приносит поток мусорных лидов, и менеджеры тонут в «просто спросить». Разбираем на цифрах, какие поля выкидывать первыми, зачем маска телефона и когда email в форме — вредительство. (17) Одна страница — одна цель: почему сайт «обо всём сразу» не приводит никого «Позвоните», «скачайте прайс», «подпишитесь на рассылку», «мы в Telegram» — четыре кнопки на одном экране, и каждая кричит громче другой. Посетитель, которому предложили всё сразу, чаще всего не выбирает ничего. Разбираем, как конфликт CTA размывает конверсию и как выстроить иерархию: одна первичная цель, одна запасная. (18) Формы на телефоне — тип клавиатуры, автокомплит, минимум полей Хорошая мобильная форма заполняется за 8-12 секунд. Плохая — за минуту с матерным выдохом. Разница в трёх вещах: правильный inputmode для каждого поля, autocomplete на нужные значения, и трезвый ответ на вопрос "а это поле точно нам нужно?". Разбираем по каждому пункту. (19) Зона большого пальца — почему важные кнопки должны быть внизу экрана Большой палец легко достаёт нижнюю треть экрана, средне — середину, и почти не дотягивается до верха. Это база эргономики смартфона, которую игнорируют 80% сайтов. Кнопка "Заказать" вверху на iPhone 14 Pro Max — пользователь либо тянется второй рукой, либо забивает. Разбираем, где должны быть критичные элементы. (20) Мобильная версия в 2026 — отдельный сайт, адаптив или PWA Когда-то делали m.site.ru рядом с основным. Потом победил адаптив. Сейчас всё чаще встречаем PWA. Разбираем три подхода: где каждый ещё жив, что выбрать под коммерческий сайт под ключ в 2026, и почему вопрос "сделайте мне мобильную версию" от заказчика — звоночек. (21) Первый экран сайта — три вопроса, на которые он обязан ответить за 5 секунд Клик из Директа стоил 350 рублей, страница открылась — и у вас есть секунд пять, пока посетитель решает: остаться или закрыть. Если первый экран не отвечает «что тут», «для меня ли» и «что делать дальше» — деньги за клик сгорели. Разбираем типовые провалы и формулу заголовок-подзаголовок-кнопка. (22) Реальные мобильные скорости в РФ — 3G и ниже всё ещё существуют Замеряем сайт на офисном Wi-Fi 200 Мбит, всё летает. Реальный пользователь сидит в электричке на 2G, в подвальном ТЦ на EDGE, в городе с переполненной 4G-вышкой. По данным операторов и Roskomswoboda 2025, 12-18% мобильного трафика в РФ — это скорости ниже 1 Мбит/с. Что это значит для дизайна сайта и где у нас расходится теория с практикой. (23) Sticky-кнопки и плавающие меню — где помогают, где раздражают Sticky-кнопка "Заказать" в нижнем правом углу — стандартный приём для мобильных лендингов. Поднимает конверсию или мешает читать? Зависит от того, что прилипает, как часто появляется и не перекрывает ли реально нужный контент. Разбираем по типам элементов: что работает, что бесит, и где грань. (24) Кнопка звонка, мессенджер, форма — какие каналы связи оставить Гроздь из шести кнопок в углу сайта — не забота о клиенте, а тормоз, паралич выбора и перекрытый контент на мобильном. Каналы связи выбирают под аудиторию: молодёжи — мессенджер, B2B — телефон и почта, импульсу — форму. Разбираем, куда падают ночные заявки и почему скорость ответа важнее числа кнопок. (25) Прогрессивное улучшение в 2026 — не мёртвая ли идея Прогрессивное улучшение — сначала рабочий HTML, потом CSS поверх, потом JS поверх. Идея из 2003. В мире, где у всех React и SPA на 1 МБ JS, звучит как археология. Но статистика показывает, что 1-2% пользователей сидят с отключённым или сломавшимся JS — и для бизнеса это сотни заявок в год. Разбираем, что из принципов всё ещё актуально, а что можно отпустить. (26) Как скорость сайта влияет на продажи — реальные цифры из исследований «Скорость важна» — это очевидно, но насколько именно? Google, Amazon, Walmart, Booking регулярно публикуют замеры. Цифры пугающие: +1 секунда к загрузке = −20% к конверсии в e-commerce, −30% к мобильному поиску. Разбираем, что значит каждая секунда для бизнеса. (27) Призывы к действию — сколько CTA должно быть на странице и где Один CTA не работает на длинной странице — пользователь забывает о нём, скроля. Пять разных CTA тоже не работают — внимание рассеивается. Разбираем правило одного действия и где ставить кнопки на лендинге, чтобы они вели к одной цели. (28) Доступные формы — нативная валидация vs кастом Половина форм в рунете ломают скринридер, перехватывают Tab и показывают ошибку красным текстом без `aria-describedby`. Разбираем, что даёт нативная HTML-валидация бесплатно, где её недостаточно, и как сделать кастомную без потери доступности. (29) Поиск по сайту — нужен ли и когда лучше его убрать Поиск по сайту — типовой блок, который ставят «потому что у всех есть». На лендинге студии или каталоге из 30 страниц он не нужен и часто вредит. Разбираем, когда поиск действительно нужен и как его сделать. (30) Микрокопии и подсказки — как пара фраз удваивает конверсию формы Микрокопия — короткие тексты у полей формы, кнопок, ошибок. Не «дизайнерская прихоть», а 5-30% к конверсии заявки. Разбираем 12 микрокопий, которые работают в B2B-форме веб-студии. (31) Анатомия карточки услуги, которая продаёт Страница услуги «Разработка сайтов» с тремя абзацами «опытная команда» и кнопкой «оставить заявку» не продаёт. Разбираем 9 блоков, без которых карточка услуги становится мусором, и порядок, в котором их ставить. (32) Точки трения на сайте — где клиент уходит и почему Конверсия лендинга — 1.2%. Половина уходит, не дочитав первый экран, четверть — на форме, остальное — на странице «оплата». Что такое точка трения, как их искать дешёво и какие убираются за час. (33) App Clips и инстант-приложения — есть ли смысл App Clips на iOS и Instant Apps на Android — мини-версии приложения, которые запускаются по QR или ссылке без установки. Звучит мощно, на практике используется редко. Разбираем, где они реально работают и почему большинство проектов обходится без них.