سنجش برنامه‌های تک‌صفحه‌ای

این سند برای توسعه‌دهندگانی است که می‌خواهند بازدیدهای صفحه را در برنامه تک‌صفحه‌ای خود بااستفاده از Google Analytics اندازه‌گیری کنند.

برنامه‌های تک‌صفحه‌ای (SPA) وب‌سایت‌هایی هستند که سند HTML را یک‌بار بار می‌کنند و هر محتوای اضافی را بااستفاده از میاناهای برنامه‌سازی کاربردی جاوا اسکریپت واکشی می‌کنند.

مثال: فرض کنید فرمی برای به‌دست آوردن مشتریان بالقوه دارید. این فرم سه صفحه دارد: > * صفحه اول برای دریافت اطلاعات مشتری. * صفحه دوم که مشتریان در آن علاقه خود را به خدمات خاصی نشان می‌دهند. * صفحه صفحه سوم برای ثبت‌نام در وبینارهای مرتبط با علایق مشتری.

کلید اندازه‌گیری صحیح بازدیدهای صفحه از برنامه‌های تک‌صفحه‌ای این است که بازدیدهای صفحه را برای هر صفحه‌ای که کاربر با آن تعامل دارد بشمارید و ارجاع‌دهنده صفحه را به‌درستی دریافت کنید، تا بتوانید مسیر کاربر را به‌درستی ردیابی کنید.

قبل‌از شروع

این صفحه فرض می‌کند که ازقبل موارد زیر را دارید:

  • حساب و دارایی Google Analytics برای وب‌سایتتان. با نحوه راه‌اندازی Google Analytics آشنا شوید.

  • برچسب Google در وب‌سایتتان پیاده‌سازی شده است که وقتی صفحه در ابتدا بار می‌شود فعال می‌شود. با نحوه راه‌اندازی برچسب Google آشنا شوید.

پیاده‌سازی سنجش برنامه تک‌صفحه‌ای

برای پیاده‌سازی اندازه‌گیری دقیق SPA، از یکی از این روش‌ها برای راه‌اندازی بازدید از صفحه مجازی جدید استفاده کنید:

  • تغییرات سابقه مرورگر (توصیه‌شده): اگر SPA شما از History API، به‌ویژه روش pushState() و replaceState() برای به‌روزرسانی صفحه‌ها استفاده می‌کند، از این گزینه استفاده کنید.

  • رویدادهای سفارشی: اگر وب‌سایت شما از شیء DocumentFragment برای ارائه صفحه‌های مختلف استفاده می‌کند، از این گزینه استفاده کنید.

پیاده‌سازی تغییر سابقه مرورگر

اگر «برنامه تک‌صفحه‌ای» شما از «میانای برنامه‌سازی کاربردی سابقه» استفاده می‌کند، می‌توانید اندازه‌گیری بهبودیافته را در Google Analytics فعال کنید تا بازدیدهای صفحه را براساس رویدادهای سابقه مرورگر به‌طور خودکار پیگیری کنید.

فعال کردن اندازه‌گیری بهبودیافته در Google Analytics

برای اندازه‌گیری page_views به‌طور خودکار براساس سابقه مرورگر:

  1. Google Analytics را باز کنید

  2. در سرپرست، در بخش جمع‌آوری و اصلاح داده‌ها، روی «جاری‌سازی داده‌ها > وب» کلیک کنید.

  3. در بخش اندازه‌گیری بهبودیافته، کلید را به حالت روشن بکشید تا همه گزینه‌ها فعال شوند.

  4. برای ویرایش گزینه‌های تکی کلیک کنید. در بخش بازدیدهای صفحه، روی نمایش تنظیمات پیشرفته کلیک کنید. حتماً هم بار شدن صفحه و هم تغییرات صفحه براساس رویدادهای سابقه مرورگر را فعال کنید.

    تصویری که تنظیم بازدیدهای صفحه را نشان می‌دهد

  5. تغییرات را ذخیره کنید.

راه‌اندازی اندازه‌گیری‌تان را به‌تأیید برسانید

برای درستی‌سنجی اینکه برنامه تک‌صفحه‌ای شما بازدیدهای صفحه را به‌درستی اندازه‌گیری می‌کند:

  1. حالت اشکال‌زدایی را برای هر برچسب در تنظیمات اندازه‌گیری برنامه تک‌صفحه‌ای فعال کنید. با نحوه پایش رویدادها در DebugView آشنا شوید.

  2. در برنامه تک‌صفحه‌ای خود کلیک کنید. وقتی روی صفحه مجازی جدیدی کلیک می‌کنید، باید رویداد page_view جدیدی در DebugView ببینید. پارامترهای رویداد page_view را با رویداد page_view قبلی مقایسه کنید تا بررسی کنید آیا ارجاع‌دهنده صفحه و مکان صفحه به‌درستی به‌روز شده‌اند یا نه.

ملاحظات بیشتر برای برنامه‌های تک‌صفحه‌ای

علاوه‌بر ارسال رویدادهای page_view، این جنبه‌های اضافی را برای ادغام قدرتمند SPA با Google Analytics و تجربه کاربری بهتر درنظر بگیرید:

مدیریت موقعیت پیمایش

وقتی کاربران در یک برنامه تک‌صفحه‌ای بین نماها پیمایش می‌کنند، مرورگر معمولاً موقعیت پیمایش فعلی را حفظ می‌کند. این یعنی کاربران ممکن است بالای صفحه مجازی جدید را نبینند و این امر می‌تواند بر ردیابی عمق پیمایش تأثیر بگذارد.

توصیه: پس‌از هر انتقال صفحه مجازی، موقعیت پیمایش را به‌صورت برنامه‌ریزی‌شده به بالای صفحه یا محتوی اصلی بازنشانی کنید.

// Example: Reset window scroll position on a route change in your SPA
window.scrollTo(0, 0);

// Or, if your content is within a specific element:
// document.getElementById('main-content').scrollTo(0, 0);

با این تغییر، کاربران از بالای محتوای جدید شروع می‌کنند که به Google Analytics امکان می‌دهد تعامل در صفحه مجازی جدید را به‌طور دقیق اندازه‌گیری کند.

اطمینان از دسترس‌پذیری محتوا برای ویژگی‌های مرورگر

اگر کاربران گزارش دهند که ویژگی‌های مرورگر مثل جستجوی درون‌صفحه‌ای (Ctrl+F) پس‌از بار کردن صفحه مجازی کار نمی‌کند، این می‌تواند نشان دهد که «برنامه تک‌صفحه‌ای» شما چگونه «مدل شیء سند» را به‌روزرسانی می‌کند.

توصیه: مطمئن شوید که چارچوب SPA و منطق مسیریابی شما به‌طور کامل و هم‌زمان بخش‌های مربوطه DOM را با محتوای صفحه جدید به‌روزرسانی می‌کنند. ممکن است رندر کردن با تأخیر یا محتوای پنهان‌شده از درخت DOM اصلی بلافاصله توسط عملکرد جستجوی مرورگر قابل‌نمایه‌سازی نباشد. جستجوی درون‌صفحه‌ای را پس‌از پیمایش‌های مجازی آزمایش کنید تا از دسترس‌پذیری محتوا مطمئن شوید.

تأثیر بر رویدادهای خودکار

اگر سنجش بازدید از صفحه مجازی را به‌درستی در SPA خود پیاده‌سازی کنید، Google Analytics سایر رویدادهای خودکار را به‌طور مناسب مدیریت خواهد کرد. اگر بازدیدهای صفحه مجازی برای تغییرات صفحه ثبت نشود، Google Analytics «برنامه تک‌صفحه‌ای» را به‌عنوان یک صفحه واحد درنظر می‌گیرد که منجر به انحراف معیارها می‌شود.

برای مثال، رویداد user_engagement مدت زمانی را که کاربر به‌طور فعال در صفحه می‌گذراند اندازه‌گیری می‌کند. بدون بازدیدهای صفحه مجازی، کل زمان تعامل به بارگیری اولیه صفحه نسبت داده می‌شود، که تحلیل زمان صرف‌شده در صفحه‌های جداگانه را غیرممکن می‌کند.

وقتی اندازه‌گیری بازدید از صفحه مجازی به‌درستی پیاده‌سازی شده باشد:

  • رویداد user_engagement زمانی ارسال می‌شود که کاربر از یک صفحه مجازی به صفحه دیگری می‌رود.
  • زمان تعامل برای صفحه مجازی قبلی محاسبه و همراه با رویداد user_engagement ارسال می‌شود، معمولاً درست قبل‌از اینکه رویداد page_view برای صفحه مجازی جدید پردازش شود.
  • رویدادهای دیگر، مثل کلیک‌ها یا پیمایش‌ها، با page_location صفحه مجازی‌ای که کاربر درحال‌حاضر مشاهده می‌کند مرتبط است.

این کار به شما امکان می‌دهد تعامل کاربر و سایر سنجه‌ها را برای صفحه‌ها یا بخش‌های مجزا در SPA خود تجزیه‌وتحلیل کنید و درک دقیق‌تری از سفر کاربر ارائه دهید.