Як відстежувати перегляд відеороликів на своєму сайті

Ще кілька років тому було прийнято на веб-ресурсах використовувати в основному текстовий або графічний контент.
Пояснювалося це елементарно – невисока швидкість інтернету не дозволяла задіяти більш потужні ресурси для впливу на аудиторію. Сьогодні швидкість вже не є перешкодою, і відеоконтент використовується на переважній більшості інтернет-ресурсів.
У зв’язку зі зростаючою популярністю відео-контенту, багато власників ресурсів, при просуванні сайтів стикаються з питанням: «Як відстежувати перегляд відеороликів на своєму сайті?» Як правило, цим питанням задаються з метою з’ясувати і оцінити зацікавленість цільової аудиторії в відео-контент. Таким чином, відстеження взаємодії з відео в переважній більшості випадків налаштовується для того, щоб з’ясувати три основних критерії відносини:
1. Відвідувач натиснув «play» і почав перегляд – відео зацікавило, тобто виникло бажання в перегляді.
2. Відвідувач переглянув відео до певного моменту і зупинив ролик – очікування виправдалися чи ні.
3. Відвідувач додивився відео до кінця – ролик сподобався, був цікавий, пізнавальний.
На сьогоднішній день існує кілька нескладних способів, які допоможуть налаштувати відстеження перегляду відео на сайті за допомогою «Google Analytics». Всі способи передбачають використання лічильника в тандемі з додатковим JavaScript-кодом. Така взаємодія допомагає не тільки управляти відтворенням відеоролика, а й посилати інформацію, у вигляді подій (track Event) безпосередньо на лічильник. Слід зазначити, що кожен з наведених нижче способів, має ряд обмежень і на даний момент не існує універсального способу відстеження інформації, що стосується перегляду відео на сайті. Це слід обов’язково враховувати, при виборі варіанта настройки для свого веб-ресурсу.
Варіант 1
Даний спосіб є найбільш простим, але на сторінці з відео повинна бути підключена бібліотека Jquery.
Перш за все, необхідно в коді сторінки з відео прописати посилання на Js-скрипт.
На практиці код вставки виглядає наступним чином:
<script src=”//code.jquery.com/jquery-1.7.2.js”></script>
<script type=”text/javascript” src=”/path/to/lunametrics-youtube.js”></script>
Далі за допомогою стандартного YouTube-коду і використання iframe, необхідно помістити відеоролик на сторінку. Таким чином, можна відстежити, скільки разів відео було включено і скільки разів доглянуто до кінця, що дасть чітке уявлення про зацікавленість відвідувачів в перегляді. Головний недолік даного способу полягає в тому, що тільки один відеоролик можна підключити до лічильника «Google Analytics». Крім цього, даний варіант відстеження не підходить для обліку тих відвідувачів, які використовують мобільні гаджети.
Варіант 2
Цей спосіб трохи складніше попереднього і відрізняється деякими особливостями, які будуть описані нижче. Для реалізації даного способу необхідно прописати файл зі скриптом і додатковий код з ID відео на сторінці, де буде розташований відео-контент.
Виглядає це приблизно так:
<script src=”path/to/youtube.ga.min.js”></script>
<script>
var configYouTubePlayer = {
videoID: ‘Rk6_hdRtJOE’ // The YouTube video ID.
};
</script>
Крім цього, необхідно в тому місці на сторінці, де буде ролик, розмістити DIV c «id = ytplayer». Після чого він буде заміщений скриптом на iframe з відео: <div id =”ytplayer”> </ div>
Особливість даного способу полягає в тому, що можна відстежувати більшу кількість інформації, такої як:
1. Як почати перегляд (запуск) і завершення перегляду – (started \ paused \ completed video).
2. Відсоток завершеності перегляду – (коли перегляд досягає 25%, 50% або 75% всього відеоролика).
NB! – HTML 5 обов’язково повинен підтримуватися браузером!
– Подія відстежується тільки при першому запуску!
– Значення параметра opt_noninteraction встановлюється як true, тому події, що стосуються перегляду відеоконтенту, не впливають на показник відмов!
– Відстежити можна тільки один ролик, як і в першому варіанті, але є можливість вибрати, який саме відстежувати!
– Подивитися відео за допомогою мобільних гаджетів неможливо!
– Відвідувачі, у яких відключений JavaScript, також не зможуть побачити відеоролик!
Варіант 3
Цей варіант найбільш складний і для його реалізації необхідно використовувати API YouTube. На сторінку, де розташований відеоролик, необхідно вставити такий скрипт:
<script>
var tag = document.createElement(‘script’);
tag.src = “http://www.youtube.com/player_api”;
var firstScriptTag = document.getElementsByTagName(‘script’)[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player(‘player’,
{
height: ‘390’,
width: ‘640’,
videoId: ‘Y8B9gMvcfQY’,
events: {
‘onReady’: onPlayerReady,
‘onStateChange’: onPlayerStateChange
}
});
}
function onPlayerReady(event) {
/// event.target.playVideo();
}
function onPlayerStateChange(event) {
if (event.data ==YT.PlayerState.PLAYING)
{_gaq.push([‘_trackEvent’, ‘Page Name’, ‘Video Name’, ‘Play’,
player.getVideoUrl() ]); }
if (event.data ==YT.PlayerState.ENDED)
{_gaq.push([‘_trackEvent’, ‘Page Name’, ‘Video Name’, ‘Watch to End’,
player.getVideoUrl() ]); } }
</script>
Після чого, необхідно вказати ID ролика в параметрі video ID і в довільній формі встановити Page Name, Video Name в ‘_trackEvent’. Прописати на місці ролика такий DIV
<div id=”player”></div>
В результаті реалізації даного способу можна відстежити запуск відеоролика і його перегляд до самого кінця. Для більшої зручності при аналізі статистики можна вказувати свою назву відеоконтенту.
Всі три варіанти на сьогоднішній день є придатними способами для відстеження переглядів відеороликів на сайті. Без сумніву кожен з них має свої сильні і слабкі сторони, зваживши які можна підібрати той спосіб, який ідеально підійде для збору інформації в конкретно взятих умовах.
Звичайно, існує маса і інших способів, за допомогою яких можна впровадити власне відео на сайт. У таких випадках, спосіб відстеження буде залежати безпосередньо від вибору плеєра, за допомогою якого відеоконтент встановлюється на сторінки веб-ресурсу.
Наприклад:
Flow Player має вихідний код з плагіном для підключення «Google Analytics». З покроковою інструкцією можна ознайомитися тут:http://flash.flowplayer.org/plugins/flash/analytics.html
Інформація для інтеграції «Google Analytics» в відеоплеєр Adobe Flash – https://developers.google.com/analytics/devguides/collection/other/flashTrackingIntro?csw=1
Для відео на HTML5 –
http://www.elisa-dbi.co.uk/blog/how-to-integrate-google-analytics-in-video-html5-and-goodbye-to-flash/
Наступний крок – це настройка виконання події, як виконання мети. Для цього необхідно:
1. В «Google Analytics» натиснути вкладку «Адміністратор».
2. Зайти на вкладку «Цілі» і створити мета.
3. Ввести ім’я мети і вибрати тип «Подія».
4. Заповнити поля в цілі таким чином:
- Категорія – ідентична
- Action – ідентична
- Ярлик – ідентичний
- Значення – ідентичне
5. Натиснути «Зберегти».
Підводячи підсумок вищевикладеного, можна зробити висновок, що сучасні інструменти веб-аналітики пропонують кілька ефективних способів для відстеження взаємодії відвідувачів з відеоконтентом на сайті. Виходячи з умов, а також цілей і завдань інтернет-проекту, підібрати найбільш оптимальний варіант, який надасть необхідний обсяг інформації для аналізу і подальшої оптимізації, не складе особливих труднощів.