Ошибки скриптов: форма не работает у части посетителей

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

Такие поломки могут месяцами съедать часть обращений. И самое обидное, что причина обычно мелкая и правится за час — если её найти.

Разберём, почему форма может не работать у отдельных посетителей, как это обнаружить и что делать, чтобы такие ситуации не повторялись.

Почему проблема видна не всем

Ключевой момент: сайт у разных людей выполняется по-разному.

Браузеры отличаются. Версии браузеров отличаются. Настройки безопасности отличаются. Расширения блокируют разное. Корпоративные сети режут разное. Скорость связи разная. Устройства разные — от свежего телефона до рабочего компьютера, которому восемь лет.

Ваш сайт — это не один файл, а десятки: код страницы, оформление, скрипты, шрифты, сторонние сервисы вроде чата, счётчиков, карт, виджетов обратного звонка. Достаточно, чтобы один из них не загрузился или выполнился с ошибкой — и дальнейший код перестаёт работать.

Форма при этом внешне цела. Поля есть, кнопка есть. Но нажатие не приводит ни к чему, потому что обработчик не привязался.

Типичные причины

Разберём по частоте.

Ошибка в одном скрипте останавливает остальные. Если несколько скриптов подключены в один файл или выполняются последовательно, ошибка в первом останавливает выполнение всего, что после. Форма могла быть последней в очереди.

Сторонний сервис не отвечает. Чат, счётчик, виджет отзывов, карта, шрифты с внешнего адреса. Если такой сервис недоступен или медленно отвечает, страница может зависнуть на его загрузке. У части посетителей — например, в корпоративной сети, где внешние адреса режутся, — это происходит регулярно.

Блокировщик рекламы блокирует нужное. Блокировщики режут не только рекламу. Они часто блокируют счётчики и виджеты, а иногда — файлы с «подозрительными» именами. Если ваш скрипт формы лежит в папке с неудачным названием, его могут блокировать.

Старый браузер не понимает современный синтаксис. Код, написанный с использованием новых возможностей языка, в старом браузере вызывает ошибку разбора — и не выполняется вообще ни одна строка файла. Это классическая причина «у всех работает, а у бухгалтера нет».

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

Скрипт подключён до элемента, к которому обращается. Если код ищет форму на странице раньше, чем она появилась, он её не находит. На быстром соединении может успеть, на медленном — нет. Отсюда плавающая воспроизводимость.

Ошибка проявляется только при определённых данных. Например, скрипт проверки телефона падает, если ввели номер в непривычном формате, или проверка почты не понимает адрес с необычными символами. Человек с «неправильными» данными не может отправить форму, остальные могут.

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

Смешанное содержимое. Сайт работает по защищённому протоколу, а какой-то скрипт подключается по незащищённому. Браузер его блокирует. Часть браузеров — молча.

Как это обнаружить

Проблема в том, что жалоб почти не бывает. Человек не станет писать вам, что у него не отправилась форма. Значит, искать нужно самим.

Консоль браузера. Первый инструмент. Откройте сайт, вызовите инструменты разработчика, вкладку с сообщениями. Красные строки — это ошибки. Их наличие само по себе тревожный признак, даже если у вас всё работает.

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

Вебвизор в Яндекс.Метрике. Позволяет посмотреть записи сессий. Ищите те, где человек несколько раз нажимает кнопку отправки и уходит. Это прямое доказательство поломки. Один час просмотра записей обычно даёт больше, чем неделя догадок.

Карта кликов. Если по кнопке отправки много нажатий, а обращений мало — что-то не так.

Сопоставление цифр. Число открытий формы против числа отправок. Если из ста человек, начавших заполнять, отправили пятнадцать — либо форма неудобная, либо она у кого-то не работает.

Проверка на разных устройствах. Минимальный набор: свежий и старый браузер, телефон на разных системах, планшет, компьютер с блокировщиком рекламы, корпоративная сеть.

Отзывы менеджеров. Иногда клиенты всё-таки говорят по телефону: «у вас форма не работает, поэтому звоню». Такие фразы нужно фиксировать, а не пропускать мимо ушей.

Как искать причину

Когда факт поломки установлен, порядок такой.

Воспроизвести. Попробуйте повторить условия: тот же браузер, то же устройство, то же соединение. Если не удаётся — используйте журнал ошибок или запись сессии.

Посмотреть, что в консоли. Обычно там прямо написано, в каком файле и на какой строке ошибка.

Отключить сторонние сервисы по очереди. Временно уберите чат, потом счётчик, потом виджет. Если после отключения одного всё заработало — виновник найден.

Проверить порядок подключения скриптов. Часто помогает перенос кода формы ниже или его выполнение после полной загрузки страницы.

Проверить на старом браузере. Если там ошибка разбора — нужно либо упростить код, либо собрать его в совместимом виде.

Проверить проверки полей. Введите телефон в разных форматах, почту с точками и дефисами, имя латиницей и кириллицей, длинный текст, пустые пробелы. Нередко именно здесь всё и ломается.

Проверить с блокировщиком. Установите популярный блокировщик и попробуйте отправить форму.

Как сделать форму устойчивой

Профилактика дешевле поиска.

Форма должна работать без скриптов. Базовый принцип: если скрипт не загрузился, форма всё равно отправляется обычным способом с перезагрузкой страницы. Некрасиво, но заявка дойдёт. Это самая надёжная защита, и она почти нигде не сделана.

Код формы — отдельным файлом, независимым от остального. Тогда ошибка в другом скрипте не уронит отправку.

Скрипты сторонних сервисов подключаются с отложенной загрузкой. Чат, счётчики, виджеты не должны блокировать основную работу страницы.

Обработка ошибок внутри кода формы. Если что-то пошло не так, человек должен увидеть сообщение, а не тишину.

Понятная обратная связь при отправке. Кнопка меняет вид, появляется индикатор, потом сообщение об успехе или об ошибке. Тишина — худший вариант.

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

Запасной способ обращения на видном месте. Телефон, мессенджер, почта. Если форма не сработала, у человека должен быть другой путь.

Дублирование заявки в несколько мест. Почта, база на сайте, уведомление в мессенджер, передача в Битрикс24 или амоЦРМ. Тогда сбой одного канала не означает потерю обращения.

Как это связано с продвижением 3 в 1

Сломанная форма бьёт по всем трём источникам обращений одновременно, и это стоит понимать.

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

Яндекс.Справочник и Яндекс Бизнес. Здесь спасает то, что человек может позвонить прямо из карточки, минуя сайт. Это тот самый резервный канал, который выручает при технических проблемах. Именно поэтому карточка должна быть заполнена и телефон в ней актуален — она страхует вас в тот момент, когда сайт подводит.

2ГИС. То же самое: отдельная точка входа, не зависящая от работоспособности вашего сайта.

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

Регулярная проверка: короткий порядок

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

Раз в неделю: отправить тестовую заявку через каждую форму на сайте. Убедиться, что письмо пришло и цель в Метрике засчиталась.

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

После обновления системы управления или модулей: обязательная проверка.

Раз в месяц: проверка с телефона, со старого браузера и с включённым блокировщиком.

Раз в месяц: просмотр десяти записей сессий в Вебвизоре на предмет застрявших посетителей.

Постоянно: контроль соотношения «открыли форму / отправили форму» в Метрике. Резкое изменение — повод проверять.

Это занимает полчаса в неделю и окупается многократно.

Сколько это стоит на самом деле

Полезно перевести проблему в деньги, иначе она кажется мелкой технической неурядицей.

Допустим, на сайт заходит 1 500 человек в месяц. Форму открывают 120. Отправляют, по вашим данным, 40. Если у десяти процентов посетителей форма не работает из-за скриптов, вы теряете примерно четыре обращения в месяц.

Четыре обращения — это, скажем, одна сделка. Умножьте на свой средний чек и на двенадцать месяцев. Обычно получается сумма, на фоне которой час работы специалиста выглядит смешно.

Причём это самая обидная потеря из всех возможных. Человек нашёл вас, прочитал сайт, убедился, решил обратиться — и не смог. Все затраты на его привлечение уже понесены. Он дошёл до последнего шага и споткнулся на технической мелочи.

Для сравнения: чтобы получить те же четыре дополнительных обращения через рекламу, придётся потратить бюджет. А здесь достаточно один раз проверить и починить.

Именно поэтому проверку форм стоит ставить в приоритет выше, чем большинство работ по привлечению. Сначала убедитесь, что не течёт, потом наливайте.

Отдельно про мобильные устройства

Больше половины посетителей приходит с телефонов, а проверяют сайт обычно с компьютера. Это создаёт целый класс невидимых проблем.

Кнопка перекрыта другим элементом. Плавающая панель, кнопка чата, всплывающая полоска с предложением — всё это на маленьком экране может лечь поверх кнопки отправки. Человек нажимает и попадает не туда.

Клавиатура закрывает поля и кнопку. Заполнил последнее поле, а кнопки не видно, и непонятно, что делать.

Слишком мелкие элементы. Промахнуться пальцем по маленькой кнопке легко.

Обработчик на событие мыши, а не на касание. На телефоне нажатие может не сработать вовсе.

Автоматическое исправление ввода. Телефонная клавиатура подставляет свои символы, а строгая проверка их не принимает.

Медленная сеть. Скрипт не успел загрузиться, человек уже нажал кнопку.

Автозаполнение. Браузер подставил данные, но скрипт этого не заметил, и проверка ругается на «пустые» поля.

Проверять формы на реальном телефоне, а не в режиме эмуляции на компьютере, — обязательное правило. Разница между эмуляцией и настоящим устройством большая.

Частые ошибки

Проверять только на своём компьютере. У вас свежий браузер, быстрый интернет и никаких блокировщиков. Вы — не типичный посетитель.

Считать, что раз заявки идут, всё в порядке. Идут те, у кого работает. Сколько не дошло — неизвестно.

Игнорировать ошибки в консоли. «Красное есть, но сайт работает». Работает у вас.

Подключать сторонние сервисы бездумно. Каждый виджет — это ещё одна точка отказа. Пять виджетов на сайте — пять шансов сломаться.

Делать сложные проверки полей. Строгая проверка номера телефона отсекает людей, которые вводят его с пробелами или со скобками.

Не иметь запасного канала. Только форма и никакого телефона на видном месте.

Не проверять после доработок.

Не собирать ошибки у реальных посетителей.

Что делать прямо сейчас

Откройте свой сайт и посмотрите консоль. Если там красное — уже есть повод разбираться.

Отправьте тестовую заявку с телефона, а не с компьютера.

Установите блокировщик рекламы и попробуйте отправить форму снова.

Посмотрите в Метрике соотношение открытий и отправок формы.

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

Проверьте, есть ли на сайте заметный запасной способ связи.

Убедитесь, что заявки дублируются хотя бы в два места.

Что в итоге

Форма, которая не работает у части посетителей, — это тихая утечка обращений, о которой вы не узнаете из жалоб. Причина почти всегда в скриптах: ошибка в одном файле, недоступный сторонний сервис, старый браузер, блокировщик или слишком строгая проверка полей.

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

А чтобы не повторялось — форма должна работать даже без скриптов, обращения должны дублироваться в несколько мест, и должен быть заметный запасной канал связи. Плюс живые карточки на Яндекс Картах и в 2ГИС, через которые человек может позвонить, даже если с сайтом что-то не так.

Если вы подозреваете, что теряете обращения на технических мелочах, — специалисты компании «Сайты Профессионально» проведут бесплатную диагностику: проверим формы на разных устройствах и браузерах, посмотрим ошибки скриптов, скорость загрузки и надёжность доставки заявок, а затем предложим план исправлений.