32 поста

#UX

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

← Все статьи

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