Веб-сайтыңызға Yandex Metrica қалай қосылады? Қадамдық орнату, Webvisor және Informer белгішесін жөндеу

Тәуелсіз ойын студиясы немесе контент жасаушы ретінде веб-сайтыңызға келушілердің қандай мақалаларды оқитынын, беттің қай жерін басатынын және дүкен белгішелерімен қалай әрекеттесетінін өлшеу өте маңызды. Google Analytics кең таралған стандарт болғанымен, Yandex Metrica (Yandex.Metrika) тегін Webvisor (сессияларды ойнату / Session Replay), басу картасы (Clickmap), айналдыру картасы (Scroll Map) және көрнекі есептегіш белгішесі (Informer) мүмкіндіктерімен әзірлеушілер үшін қуатты аналитикалық құрал болып табылады.

Arar Games ретінде 2011 жылдан бері жұмыс істеп келе жатқан Mayhem Corporation (mayhemcorporation.com) ойын әзірлеу порталымызды мобильді құрылғыларға бейімдеу (responsive) кезінде, сол жақ мәзірдегі 2012 жылдан қалған Yandex Metrica есептегіші мен көрнекі белгішеміздің сынып қалғанын байқадық.

2012 жылғы ескі bs.yandex.ru мекенжайындағы Yandex Metrica белгішесінің заманауи браузерлерде сынған белгіше ретінде көрінуі.

Бұл нұсқаулықта біз нөлден жаңа Yandex Metrica тегін (Tag) жасауды, ең соңғы tag.js кодын сайтыңызға біріктіруді және ескі bs.yandex.ru негізіндегі сынған Informer белгішесін AdBlocker қорғанысымен жөндеуді қадам-қадаммен бөлісеміз.

---

1. Yandex Metrica-да жаңа тег (Tag) жасау

Yandex есептік жазбаңызбен metrica.yandex.com сайтына кіргеннен кейін, жаңа веб-сайт есептегішін қосу үшін Add tag (metrica.yandex.com/add) терезесіне өтеміз. Орнату 3 негізгі қадамнан тұрады:

1-қадам: Create Tag (Тег мәліметтері және Webvisor баптаулары)

Бірінші терезеде сайтымыздың негізгі сәйкестендіру және аймақтық параметрлерін конфигурациялаймыз:

1. Tag name: Басқару тақтасында жобаңызды анықтауға көмектесетін атау енгізіңіз (мысалы: Mayhem Corporation).
2. Website URL: Сайтыңыздың негізгі доменін хаттамасыз (https://) енгізіңіз (мысалы: mayhemcorporation.com).
3. Accept data only from the specified addresses: Басқа сайттар сіздің есептегіш идентификаторыңызды көшіріп алып, статистикаңызды бүлдірмеуі (спам трафик) үшін бұл құсбелгіні міндетті түрде белгіленген күйде қалдырыңыз.
4. Including subdomains: blog.yoursite.com сияқты қосалқы домендерді де бір есептегіште жинағыңыз келсе, белгілей аласыз.
5. Time zone & Currency: Күнделікті келушілерді нөлдеу уақытына сәйкес келетін уақыт белдеуін (мысалы: (GMT+03:00) Istanbul) және валюта ретінде TRY (немесе USD) таңдаңыз.
6. Session Replay, scroll map, form analysis (Webvisor):

   💡 Ең маңызды мүмкіндік: Бұл параметр қосулы болғанда, Yandex Metrica келушілердің тінтуір қозғалысын, айналдыру тереңдігін және қай ойын/мақала карточкаларын басқанын анонимді бейнежазба ретінде көруге мүмкіндік береді.

---

2-қадам: Fill Out the Profile (Сайт профилін конфигурациялау)

Екінші қадамда Yandex Metrica сайтыңыз үшін салалық салыстырмалы (benchmark) есептерді дәл жасау мақсатында 5 қысқа профильдік сұрақ қояды:

1. Site Type (Сайт түрі)

Егер сіз негізінен мақалалар, техникалық нұсқаулықтар, жаңалықтар немесе құжаттама порталын басқарсаңыз, Informational website (Website with text content); ал егер бұл қолданба немесе ойынның тікелей промо-беті болса, Promo website параметрін таңдаңыз:

2. Industry (Сала)

Веб-сайтыңыздың мазмұнына сәйкес технология, медиа, мәдениет/өнерді таңдаңыз немесе тізімде дәл сәйкестік болмаса, ең төменгі жағындағы Other опциясын таңдаңыз:

3. CMS (Контентті басқару жүйесі)

Егер сайтыңыз WordPress, Drupal, Joomla немесе Wix сияқты дайын платформаны қолданса, оны тізімнен таңдауға болады. Біздің Mayhem Corporation порталы сияқты өзіңіз әзірлеген арнайы PHP/MySQL немесе .NET архитектурасын қолдансаңыз, тізімнің төменгі жағындағы Other таңдаңыз:

4. CRM жүйесі

Егер сіз ешқандай корпоративтік CRM пайдаланбасаңыз, бұл өрісте де Other (немесе Without CRM) таңдау арқылы жалғастыра аласыз:

5. Your Role in the Project (Жобадағы рөліңіз)

Егер сіз тәуелсіз әзірлеуші немесе студия негізін қалаушы болсаңыз, Business management немесе Product management таңдап, Continue батырмасын басыңыз:

---

3-қадам: Код үзіндісін орнату (tag.js)

Соңғы қадамда Yandex Metrica веб-сайтыңыздың <head> немесе <body> тегтерінің арасына қойылатын соңғы JavaScript есептегіш кодын (tag.js) жасайды:

Жаңартылған есептегіш кодының құрылымы төмендегідей (YOUR_TAG_ID орнына өзіңіздің есептегіш нөміріңіз келеді):

<!-- Yandex.Metrika counter -->
<script type="text/javascript">
    (function(m,e,t,r,i,k,a){
        m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)};
        m[i].l=1*new Date();
        for (var j = 0; j < document.scripts.length; j++) {if (document.scripts[j].src === r) { return; }}
        k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)
    })(window, document,'script','https://mc.yandex.ru/metrika/tag.js?id=YOUR_TAG_ID', 'ym');

    ym(YOUR_TAG_ID, 'init', {
        ssr:true,
        webvisor:true,
        clickmap:true,
        ecommerce:"dataLayer",
        referrer: document.referrer,
        url: location.href,
        accurateTrackBounce:true,
        trackLinks:true
    });
</script>
<noscript><div><img src="https://mc.yandex.ru/watch/YOUR_TAG_ID" style="position:absolute; left:-9999px;" alt="" /></div></noscript>
<!-- /Yandex.Metrika counter -->

Кодты сайтыңыздың негізгі үлгісіне (index.php немесе header.php) қосып, серверге жүктегеннен кейін, экрандағы "Check tag" батырмасын басу арқылы есептегіштің нақты уақытта жұмыс істеп тұрғанын тексеруге болады және "Get started" батырмасын басып, аналитикалық басқару тақтасына өтуге болады.

---

2. Сынған Yandex Metrica көрнекі белгішесін (Informer) жөндеу және AdBlocker қорғанысы

2011–2014 жылдары құрылған веб-сайттарда Yandex Metrica-ның 88x31 пиксельдік көгілдір статистикалық белгішесі (Informer) келесі ескі мекенжай арқылы шақырылатын:

//bs.yandex.ru/informer/OLD_TAG_ID/3_1_3FFEEFFF_1FDECFFF_1_pageviews

Жылдар өте келе Yandex bs.yandex.ru серверін және ескі watch.js скриптін қолданыстан шығарғандықтан, бұл мекенжай қазір HTTP 404 Not Found қатесін қайтарады және бетте сынған сурет белгішесін көрсетеді.

1-шешім: Жаңартылған informer.yandex.ru соңғы нүктесі

Көрнекі белгішені іске қосу үшін кескін көзін Yandex-тің қазіргі Informer қызметіне (https://informer.yandex.ru/informer/...) бағыттаймыз.

2-шешім: AdBlocker қолданатын келушілерге арналған жергілікті резерв (onerror)

Бүгінде көптеген ойыншылар мен әзірлеушілер браузерлерінде AdBlocker (uBlock Origin, Brave Shield және т.б.) пайдаланады. Жарнама бұғаттағыштар аналитикалық домендерді бұғаттаған кезде, белгіше кескіні жүктелмей қалуы мүмкін. Кез келген жағдайда дизайн бұзылмауын қамтамасыз ету үшін белгішенің 88x31 пиксельдік көшірмесін өзіміздің серверде (images/yandex_metrica_badge.png) сақтаймыз және onerror атрибуты арқылы оны автоматты түрде іске қосамыз:

<!-- Yandex.Metrika informer -->
<a href="https://metrica.yandex.com/stat/?id=YOUR_TAG_ID&amp;from=informer"
   target="_blank" rel="nofollow">
   <img src="https://informer.yandex.ru/informer/YOUR_TAG_ID/3_1_3FFEEFFF_1FDECFFF_1_pageviews"
        onerror="this.onerror=null;this.src='images/yandex_metrica_badge.png';"
        style="width:88px; height:31px; border:0; border-radius:3px;"
        alt="Yandex.Metrica"
        title="Yandex.Metrica: bugünün verileri (gösterimler, ziyaretler ve tekil ziyaretçiler)"
        class="ym-advanced-informer" data-cid="YOUR_TAG_ID" data-lang="tr" />
</a>
<!-- /Yandex.Metrika informer -->

Бұл реттеуден кейін Mayhem Corporation сол жақ мәзіріндегі Yandex Metrica белгішесі кәдімгі браузерлерде нақты уақыттағы статистикамен, ал AdBlocker қосулы браузерлерде сынған белгішесіз мінсіз көрінеді:

Жаңартудан кейін mayhemcorporation.com/mayhem/index.php сол жақ мәзіріндегі белсенді Yandex Metrica Informer белгішесі.

Бет қаралымдарын, кірулерді және бірегей келушілер деректерін жинақтайтын 88x31 көгілдір Informer белгішесі.

---

3. Веб-сайтымыз және ойындарымыз (Arar Games)

Веб-сайтымыз

• Mayhem Corporation: Ойын әзірлеу және XNA / MonoGame бойынша техникалық мақалалар жарияланатын веб-порталымыз.
  mayhemcorporation.com

Ойындарымыз

• Blocked: Pixel Panzer: 2D пиксельді танк экшн және аркада ойыны.
  Google Play | Microsoft Store
• Paint Trek: 2D ғарыштық тақырыптағы аркада және басқатырғыш ойыны.
  Google Play | Microsoft Store
• Space Dodger: Рефлекске бағытталған 2D ғарыштық аркада ойыны.
  Google Play

Әлеуметтік желілер

• TikTok: @arargamesstudio
• Instagram: @arargamesstudio
• X (Twitter): @arargamesstudio
• YouTube: @koreaaria
• Threads: @arargamesstudio
• Facebook: arargamesstudio