Разрыв, который никто не видит
Сайт делают, глядя в большой монитор. Заказчик принимает работу тоже с компьютера. Правки обсуждают по скриншотам с десктопа.
А потом сайт открывают с телефона, и открывают его так большинство людей.
Это не про «адаптивность» в техническом смысле - почти все современные сайты подстраиваются под ширину экрана. Это про то, что подстроившийся сайт может быть неудобным, и на компьютере этого не увидеть никогда.
Что ломается чаще всего
Список из практики, от частого к редкому.
Телефон не нажимается. Номер написан текстом, а не ссылкой. На компьютере это не имеет значения, на телефоне человек тыкает в него и ничего не происходит. Он не будет переписывать номер вручную.
Форма требует слишком много. Пять полей на телефоне - это долго. Имя и телефон достаточно, остальное спросите в разговоре.
Кнопка ниже экрана. Человек не долистал и решил, что кнопки нет.
Таблица разъезжается. Прайс или условия доставки в таблице на широком экране выглядят отлично, на узком превращаются в кашу или уезжают вбок.
Текст мелкий, а межстрочка плотная. Читать неудобно, человек уходит.
Всплывающее окно на весь экран. Крестик крошечный, попасть невозможно, назад тоже не работает.
Долгая загрузка. Тяжёлые фотографии на мобильном интернете грузятся секунд десять. Человек не ждёт.
PDF вместо страницы. Прайс или меню в PDF - на телефоне это боль.
Карта, которая ловит палец. Встроенная карта на странице контактов перехватывает прокрутку: человек пытается пролистать страницу, а вместо этого двигает карту. Мелочь, из-за которой люди уходят с раздражением.
Форма, которая уезжает под клавиатуру. Пользователь нажимает на поле, вылезает клавиатура, кнопка отправки оказывается за экраном, и он не понимает, что делать дальше.
Как проверить самому за десять минут
Не нужны инструменты. Возьмите свой телефон, желательно не самый новый, и отключите вайфай - смотрите через мобильный интернет.
Пройдите путь клиента полностью. Найдите сайт в поиске, как ищет обычный человек. Откройте. Найдите цену. Найдите телефон и нажмите на него - началcя ли звонок. Заполните форму заявки до конца и отправьте. Найдите адрес и попробуйте построить маршрут.
Засеките, сколько это заняло и где вы застряли.
Второй тест лучше первого: дайте телефон человеку, который вашего сайта не знает, и попросите сделать то же самое. Молча смотрите. Всё, где он тыкает не туда, - ваш список правок.
Что важнее всего на маленьком экране
Приоритеты на телефоне другие, чем на компьютере.
Первый экран решает. Человек должен за две секунды понять, куда попал и что вы делаете. Не слоган, а конкретика: «Ремонт стиральных машин в Казани. Выезд сегодня».
Кнопка действия видна сразу. Позвонить или написать - без листания.
Цена близко. Не в глубине сайта, а на первом-втором экране.
Меньше текста. То, что на компьютере читается как абзац, на телефоне - как стена.
Крупные кнопки. Палец толще курсора, и это не метафора.
Про формы отдельно
Форма - самое частое место, где теряют заявку.
Что сокращает потери: минимум полей, правильные клавиатуры (для телефона - цифровая), понятная ошибка при опечатке, видимая кнопка отправки, честное подтверждение «мы получили, ответим за 15 минут».
Что убивает: обязательные поля, которые не нужны; капча, которую невозможно пройти с телефона; форма, которая при ошибке стирает всё введённое.
Последнее встречается до сих пор и стоит вам всех, кто ошибся в одной цифре.
Альтернатива форме
Честно говоря, на телефоне многие вообще не хотят заполнять форму. Они хотят нажать и написать.
Поэтому кнопка «написать в мессенджер» рядом с формой часто собирает больше обращений, чем сама форма. Это не значит, что форма не нужна: часть людей предпочитает именно её. Дайте оба варианта.
И проверьте, что мессенджер, на который вы ведёте, работает. После ограничений на звонки часть привычных сценариев отвалилась - мы разбирали, что с этим делать.
Почему это не «доработка на потом»
Обычный аргумент: сначала запустим, потом поправим мобильную версию.
Проблема в том, что «потом» вы будете смотреть на статистику и делать выводы. А статистика будет собрана с сайта, которым половина людей не смогла пользоваться.
Ещё: поиск учитывает удобство на мобильных при ранжировании. Сайт, неудобный на телефоне, показывают ниже - то есть вы теряете дважды.
Мы писали, почему сайт есть, а заявок нет - мобильная версия там в первой тройке причин, и её почти никогда не проверяют первой.
Что предлагаем мы
Наши сайты собираются с расчётом на телефон, а не подгоняются под него потом. Сайт для услуг - 2 990 рублей в месяц, интернет-магазин - 7 990. Запуск за 5 дней, домен на вас, хостинг, SSL, бэкапы, обновления и поддержка в цене, установка бесплатно.
Но если у вас уже есть сайт, начинать надо не с замены. Начните с теста на своём телефоне: часть проблем из списка выше чинится правкой текста и настройками, а не переделкой.
Три вещи на сегодня
Проверьте, нажимается ли номер телефона. Это одна строка кода и самая частая потеря.
Отправьте заявку через свою форму с телефона. До конца, по-настоящему.
Посмотрите на первый экран и спросите себя: понятно ли за две секунды, что вы продаёте и где.
Если хотите, чтобы на ваш сайт посмотрели со стороны, - напишите нам, скажем прямо, что видим.
