Отслеживание 404 ошибок в Яндекс.Метрике

24 октября, 2022

В предыдущем материале вы узнали, как вместе с JavaScript-событием можно отправлять дополнительные параметры визита в Яндекс.Метрику. В этой статье речь пойдет об отслеживании 404 ошибок с помощью события и параметров визита с использованием Google Tag Manager и без него.

Содержание

О 404 ошибках

В моем блоге есть несколько публикаций на данную тему.

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

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

Пример страницы с 404 ошибкой

Существует множество причин появления 404 ошибок:

был введен неверный URL-адрес;
битая ссылка (перестала работать);
адрес страницы был изменен (в этом случае поможет 301 редирект, который указывает роботам ПС, что страница перемещена по новому адресу, а старый адрес следует считать устаревшим);
контент запрашиваемой страницы по какой-либо причине может быть скрыт от пользователей, а перенаправление идет на 404 страницу;
страница была удалена или прекращено существование всего сайта;
целенаправленная DDoS-атака/взлом с целью дестабилизации.

Примечание: встречаются различные сообщения 404 - 404 ошибка, 404 Not Found, 404 Error, HTTP 404 Not Found, Страница не найдена, The page cannot be found, The requested URL was not found on this server и т.д.

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

Для отслеживания 404 ошибок в Яндекс.Метрике вы можете пойти одним из трех представленных путей:

использовать стандартный отчет по страницам в интерфейсе Яндекс.Метрики;
использовать JavaScript-событие и параметры визита (все настройки выполняются напрямую);
использовать JavaScript-событие и параметры визита (все настройки выполняются через Google Tag Manager).

Давайте рассмотрим каждый вариант подробнее.

№1. Отслеживание 404 ошибок с помощью стандартного отчета

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

Заголовок страницы с 404 ошибкой - Страница не найдена

Отчет в Яндекс.Метрике находится в разделе Отчеты - Содержание - Заголовки страниц:

Отчеты - Содержание - Заголовки страниц

Открыв его, сразу же добавьте в отчет через Группировки параметры Заголовок страницы, Адрес страницы и Реферер:

Группировки - Заголовок страницы, Адрес страницы и Реферер

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

Сверху над таблицей выберите линейный список и в поле поиска введите заголовок страницы 404 ошибки, чтобы отфильтровать данные:

Страница 404 в отчете Яндекс.Метрики

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

Если вам неудобно анализировать данные в самой Яндекс.Метрике, вы можете выгрузить эти данные к себе на компьютер с помощью экспорта в форматы .xlsx или .csv:

Выгрузка данных из Яндекс.Метрики

А затем открыть эту таблицу в Excel, чтобы легко привести статистику в нужный вид, увидеть список несуществующих URL за выбранный диапазон дат и отфильтровать/подсветить какие-то значения:

Пример страниц с 404 ошибкой в Microsoft Excel

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

№2. Отслеживание 404 ошибок напрямую (JavaScript-событие + параметры визитов)

Если ваш код счетчика Яндекс.Метрики и все настройки выполняются напрямую (без использования Google Tag Manager и других систем управления тегами), тогда вам необходимо выполнить следующее:

- перейдите в раздел Цели и создайте цель типа JavaScript-событие. Задайте название цели и добавьте идентификатор. Например: Отслеживание 404 ошибок и 404error:

Создание JavaScript-события

Скопируйте код цели для сайта. Чуть ниже мы модифицируем эту конструкцию.

На следующем этапе вам может понадобиться помощь разработчика, который добавит нижеприведенный скрипт в исходный код шаблона вашей 404-страницы. Как правило, в большинстве CMS-движков присутствует отдельный шаблон страницы 404. Например, в моем блоге (сделан на WordPress) на хостинге лежит файл 404.php:

Шаблон отдельный страницы 404.php (WordPress)

Открыв его, я увижу исходный код страницы:

Исходный код файла 404.php

Именно сюда вам или вашему программисту необходимо будет добавить такой код:

<script type="text/javascript">
var ref = document.referrer;
var url = document.location.href;
var params404 = {'404 ошибка': {'URL-адрес': url, 'Реферер': ref}};

ym(XXXXXXXX, 'reachGoal', '404error', params404);

</script>

var ref = document.referrer;

var url = document.location.href;

var params404 = {'404 ошибка': {'URL-адрес': url, 'Реферер': ref}};

ym(XXXXXXXX, 'reachGoal', '404error', params404);

</script>

, где:

var ref = document.referrer - переменная ref, которой присваивается URI страницы, с которой был совершен переход на текущую 404 страницу;
var url = document.location.href - переменная url, которой присваивается значение всего URL-адреса текущей страницы из браузера пользователя;
var params404 = {'404 ошибка': {'URL-адрес': url, 'Реферер': ref}} - создается JavaScript-объект, в котором с помощью иерархической структуры передается два параметра визита - URL-адрес со значением, извлеченным из переменной url, и Реферер со значением, извлеченным из переменной ref.
ym(XXXXXXXX, 'reachGoal', '404error', params404) - конструкция JavaScript-события с дополнительным аргументом params404, а XXXXXXXX - идентификатор вашего счетчика Яндекс.Метрики.

Этот код вставьте в шаблон вашей 404 страницы и сохраните изменения. После этого, при посещении несуществующей страницы в Яндекс.Метрику будет отправляться информация о событии 404error и дополнительных параметрах визита - URL-адресах таких страниц и их источниках (реферере).

Проверить корректность передачи данных можно несколькими способами:

добавить к URL-адресу с 404 ошибкой параметр _ym_debug со значением 1. Например, https://osipenkov.ru/takoj-stranicy-net/?_ym_debug=1

Далее необходимо вызвать консоль разработчика и перейти на вкладку Console. Вы должны увидеть строчку с PageView. Counter XXXXXXXX. Это первый хит на странице, свидетельствующий о просмотре страницы. Совершив отслеживаемое событие, вы увидите другую строчку с методом Reach goal. Если у вас есть возможность перейти на несуществующий URL-адрес с другого источника, тогда и параметру визита Реферер присвоится значение.

Отслеживание события 404 ошибки с идентификатором цели и параметрами визита

В моем примере я совершил переход с сайта http://techniqa.ru/ на страницу https://osipenkov.ru/takoj-stranicy-net/, которой на моем сайте нет. Поэтому зарегистрировалось событие 404 и вместе с ним передалось два параметра визита.

использовать готовое расширение для браузера. Например, Yandex Metrica Debugger или Яндекс.Метрика Инспектор.

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

Отслеживание события 404 ошибки с идентификатором цели и параметрами визита (Yandex.Metrica Inspector)

Если вы не видите ваше событие и переданные параметры визита, то, скорее всего, у вас проблема другого рода - ошибка Uncaught ReferenceError: ym is not defined.

Uncaught ReferenceError: ym is not defined

У Ивана Иванова, автора блога prometriki.ru, есть хорошая статья на эту тему. В ней он описывает причину возникновения такой ошибки и способ ее решения. Если кратко, то ошибка ym is not defined чаще всего возникает тогда, когда отправка данных о достижении цели методом reachGoal выполняется до того, как счетчик Яндекс Метрики был инициализирован (доступен) на странице. Используя код Иванова с интервальной проверкой, вы точно будете уверены в том, что счетчик Яндекс.Метрики будет загружен раньше остальных, а затем отправится JavaScript-событие с необходимыми параметрами.

Для своего сайта и примера я его чуть изменил:

<script>
var ref = document.referrer;
var url = document.location.href;
var params404 = {'404 ошибка': {'URL-адрес': url, 'Реферер': ref}};
(function () {
var ee = setInterval(function () {
if (typeof window.ym != 'undefined') {
ym(33437348,'reachGoal','404error', params404);
clearInterval(ee);
} else {
console.log('Метрика не инициализирована');
}
}, 500); // 0,5 секунды ждать, изменить на свое значение, 1 сек = 1000
})();

</script>

var ref = document.referrer;

var url = document.location.href;

var params404 = {'404 ошибка': {'URL-адрес': url, 'Реферер': ref}};

(function () {

var ee = setInterval(function () {

if (typeof window.ym != 'undefined') {

ym(33437348,'reachGoal','404error', params404);

clearInterval(ee);

} else {

console.log('Метрика не инициализирована');

}

}, 500); // 0,5 секунды ждать, изменить на свое значение, 1 сек = 1000

})();

</script>

Общее количество достигнутых целей по 404 ошибке можно посмотреть в отчете Конверсии:

Отчет "Конверсии"

Адреса 404-х страниц и их рефереров через некоторое время отобразятся в отчете Параметры визитов (Отчет - Содержание - Параметры визитов):

Отслеживание 404 ошибок в Яндекс.Метрике

Из отчета может быть удалена часть данных, поскольку детализация до уровня отдельных визитов и посетителей в Яндекс.Метрике отключена для исключения рисков деанонимизации пользователей. Показываются только строки с информацией не менее чем по 10 посетителям. Об этом свидетельствует соответствующая надпись над отчетом:

Чувствительные данные

Иногда на количество данных (их увеличению) в отчете Параметры визитов можно повлиять с помощью выключения метрики Роботность над отчетом:

Метрика "Роботность" (выкл.)

В официальном блоге Яндекса показан вариант создание JavaScript-объекта чуть другой вложенности:

<script type="text/javascript">
var
ref = document.referrer; //записываем в переменную ref значение реферера
siteurl = document.location.href; //записываем в переменную siteurl адрес просмотренной страницы
visitParams = {'NotFoundURL': {[siteurl]:{Реферер:ref}} }; //записываем в переменную visitParams иерархию с параметрами

ym(7777777, 'reachGoal', '404error', visitParams); //достигаем цель на посещение страницы 404 и передаем в параметрах визитов URL-адрес 404 cтраницы и её реферер.

</script>

var

ref = document.referrer; //записываем в переменную ref значение реферера

siteurl = document.location.href; //записываем в переменную siteurl адрес просмотренной страницы

visitParams = {'NotFoundURL': {[siteurl]:{Реферер:ref}} }; //записываем в переменную visitParams иерархию с параметрами

ym(7777777, 'reachGoal', '404error', visitParams); //достигаем цель на посещение страницы 404 и передаем в параметрах визитов URL-адрес 404 cтраницы и её реферер.

</script>

В таком случае будет передаваться иерархическую структура параметров визитов вида NotFoundURL: адрес сайта: Реферер: адрес реферера

№3. Отслеживание 404 ошибок с помощью Google Tag Manager (JavaScript-событие + параметры визитов)

Если в своей работе вы используете диспетчер тегов Google, Яндекс.Метрика установлена через него, и вы также отслеживаете все события Яндекс.Метрики с помощью GTM и соответствующих тегов, тогда этот вариант для вас.

Первая часть настройки ничем не отличается от способа, описанного выше. Для начала создайте цель типа JavaScript-событие. Задайте название цели и добавьте идентификатор. Например: Отслеживание 404 ошибок и 404error:

Создание JavaScript-события

Скопируйте полученный код цели для сайта. Эту конструкцию мы будем использовать дальше в настройке.

Этот способ очень похож на первый вариант, где мы фильтровали данные по заголовку страницы в самом отчете Яндекс.Метрики. Отличие заключается в том, что вы сами с помощью Google Tag Manager можете определить название (title) страницы, а затем создать переменную JavaScript, триггер и тег, чтобы передавать в Яндекс.Метрику отдельные события с 404 ошибкой.

Заголовок страницы можно извлечь с помощью пользовательской переменной Переменная JavaScript и значением document.title:

Переменная JavaScript - document.title

Свойство document.title получает или задает текущий заголовок документа. Вы можете протестировать эту конструкцию, перейдя на любой сайт, любую вкладку и открыв консоль разработчика. Введите туда document.title и нажмите Enter:

Вызов document.title в консоли разработчика

Теперь необходимо создать триггер, который бы активировался не на всех страницах, а когда заголовок страницы содержит Страница не найдена. Создайте такой триггер типа Просмотр страницы с дополнительным условием активации - document.title содержит Страница не найдена:

Триггер активации 404 ошибки

Задайте название триггеру и сохраните его.

Осталось только создать тег. Выберите Пользовательский HTML, в которой добавьте следующую конструкцию:

<script type="text/javascript">
var params404 = {'404 ошибка': {'URL-адрес': {{Page URL}}, 'Реферер': {{Referrer}}}};

ym(33437348,'reachGoal','404error', params404);

</script>

var params404 = {'404 ошибка': {'URL-адрес': {{Page URL}}, 'Реферер': {{Referrer}}}};

ym(33437348,'reachGoal','404error', params404);

</script>

, где 33437348 - идентификатор вашего счетчика Яндекс.Метрики (вы меняете на свой!)

В Google Tag Manager это будет выглядеть так:

Тег "Пользовательский HTML" с кодом JavaScript-события

Поскольку в диспетчере тегов Google уже есть встроенные переменные, позволяющие извлекать те данные, которые нам нужны для отслеживания, мы не используем несколько строчек кода из предыдущего варианта, а просто вставляем в соответствующие места переменную {{Page URL}} и {{Referrer}}. Конструкцию, которую мы добавляли в шаблон 404 страницы в предыдущем варианте, также добавлять не нужно. Все настройки производятся через интерфейс GTM, что очень сильно упрощает отслеживание.

На всякий случай я рекомендую в расширенных настройках тега задать Последовательность активации тегов, чтобы ваш счетчик Яндекс.Метрики загружался до того, как будет отправляться событие 404 ошибки. Для этого в теге откройте раздел Расширенные настройки - Последовательность активации тегов и поставьте галочку напротив Активировать тег перед тегом Яндекс.Метрика - 404 ошибка, задав Тег setup:

Последовательность активации тегов - Тег Setup - ваш счетчик Яндекс.Метрики

В качестве триггера активации используйте Триггер 404 ошибка, созданный на предыдущем шаге.

Итоговый тег будет выглядеть так:

Итоговый тег отслеживания 404 ошибок

Сохраните тег. Проверить корректность настройки можно через те же инструменты отладки, что были описаны выше. Режим предварительного просмотра GTM тоже можно использовать. С его помощью вы увидите регистрируемое событие Container Loaded и активированный тег с заданным условием, триггером которого является просмотра страницы с дополнительным условием срабатывания - document.title содержит Страница не найдена:

Режим отладки GTM

Однако вы не увидите корректные данные по настроенным параметрам визита, поскольку для отправки JavaScript-события в Яндекс.Метрику используется HTML-тег. Некоторые из вас, более продвинутые пользователи Google Tag Manager, знают, что есть специальные команды, которые можно использовать в консоли разработчика для просмотра данных, отображаемых в отладке. Например, вы можете посмотреть какие передались значения с нашим тегом Яндекс.Метрика - 404 ошибка с помощью таких команд:

google_tag_manager["GTM-KHV57NC"].macro(20)
google_tag_manager["GTM-KHV57NC"].macro(21)

1 2	google_tag_manager["GTM-KHV57NC"].macro(20) google_tag_manager["GTM-KHV57NC"].macro(21)

Введя их в консоль разработчика, вы увидите какие значения были присвоены вашим параметрам визита:

Команды для консоли разработчика

Для тех, кто не так хорошо разбирается в диспетчере тегов Google, используйте расширение Яндекс.Метрика Инспектор или конструкцию с _ym_debug=1

№3.1. Отслеживание 404 ошибок с помощью Google Tag Manager (dataLayer + JavaScript-событие + параметры визитов)

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

Однако не всегда есть возможность отфильтровать страницу по заголовку, содержащему 404. Либо же на сайте вообще нет отдельной страницы/шаблона для Page Not Found. Тогда вам необходимо использовать этот способ и привлекать к решению этой задачи разработчика.

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

Просьба сформировать уровень данных на странице 404, когда пользователь переходит на нее. Пример кода:

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
'event' : '404_error'
});

После того, как программист это сделает, вы можете перейти в режим отладки GTM и ввести URL-адрес любой страницы с 404 ошибкой. Вы должны увидеть на шкале событий event с вашим названием:

Событие 404_error на шкале событий

Если оно отображается, значит разработчик сделал все правильно по вашему ТЗ. Если нет, попросите его перепроверить настройки. После этого вы можете создать триггер специального события с названием события 404_error (как было указано в вашем техническом задании и отображается в режиме предварительного просмотра).

Триггер специального события

Все, что вам остается сделать, это создать точно такой же тег типа Пользовательский HTML как в способе №2 и добавить аналогичную конструкцию:

<script type="text/javascript">
var params404 = {'404 ошибка': {'URL-адрес': {{Page URL}}, 'Реферер': {{Referrer}}}};

ym(33437348,'reachGoal','404error', params404);

</script>

var params404 = {'404 ошибка': {'URL-адрес': {{Page URL}}, 'Реферер': {{Referrer}}}};

ym(33437348,'reachGoal','404error', params404);

</script>

, где 33437348 - идентификатор вашего счетчика Яндекс.Метрики (вы меняете на свой!)

В расширенных настройках тега также задайте последовательность активации тегов, чтобы ваш счетчик Яндекс.Метрики загружался до того, как будет отправляться событие 404 ошибки. Для этого в теге откройте раздел Расширенные настройки - Последовательность активации тегов и поставьте галочку напротив Активировать тег перед тегом Яндекс.Метрика - 404 ошибка, задав Тег setup:

Последовательность активации тегов - Тег Setup - ваш счетчик Яндекс.Метрики

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

Итоговый тег отслеживания 404 ошибок

На этом настройка отслеживания 404 ошибок с помощью Google Tag Manager завершена.

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

Метки: 404 ошибка, Google Tag Manager, параметры визитов, Яндекс.Метрика

Отслеживание 404 ошибок в Яндекс.Метрике

О 404 ошибках

№1. Отслеживание 404 ошибок с помощью стандартного отчета

№2. Отслеживание 404 ошибок напрямую (JavaScript-событие + параметры визитов)

№3. Отслеживание 404 ошибок с помощью Google Tag Manager (JavaScript-событие + параметры визитов)

№3.1. Отслеживание 404 ошибок с помощью Google Tag Manager (dataLayer + JavaScript-событие + параметры визитов)

Получайте бесплатные уроки и фишки

Еще статьи