قياس تطبيقات الصفحة الواحدة

هذا المستند مخصّص للمطوّرين الذين يريدون قياس مشاهدات الصفحة على تطبيقهم من صفحة واحدة باستخدام "إحصاءات Google".

تطبيقات الصفحة الواحدة (SPA) هي مواقع إلكترونية تحمِّل مستند HTML مرة واحدة وتجلب أي محتوى إضافي باستخدام واجهات برمجة تطبيقات JavaScript.

مثال: لنفترض أنّ لديك نموذجًا لاكتساب بعض العملاء المحتملين. يتضمّن النموذج ثلاث شاشات: > * الشاشة الأولى لجمع معلومات العميل. * الشاشة الثانية التي يشير فيها العملاء إلى اهتمامهم بخدمات معيّنة. * صفحة الشاشة الثالثة للاشتراك في ندوات على الويب ذات صلة باهتمامات العميل.

المفتاح لقياس مشاهدات الصفحة من تطبيقات الصفحة الواحدة بشكلٍ صحيح هو احتساب مشاهدات الصفحة لكل شاشة يتفاعل معها المستخدم والحصول على الإحالة الصحيحة للصفحة، ما يتيح لك تتبُّع رحلة المستخدم بشكلٍ صحيح.

قبل البدء

تفترض هذه الصفحة أنّ لديك ما يلي:

• حسابًا وموقعًا على "إحصاءات Google" لموقعك الإلكتروني. تعرّف على كيفية إعداد "إحصاءات Google".

• علامة تتبُّع من Google تم تنفيذها على موقعك الإلكتروني ويتم تنشيطها عند تحميل الصفحة في البداية. تعرّف على كيفية إعداد علامة التتبُّع من Google tag.

تنفيذ قياس تطبيق من صفحة واحدة

لتنفيذ قياس دقيق لتطبيق من صفحة واحدة، استخدِم إحدى الطريقتَين التاليتَين لتنشيط مشاهدة افتراضية جديدة لصفحة الويب:

• تغييرات سجلّ المتصفّح (ننصح بها): إذا كان تطبيقك من صفحة واحدة يستخدم History API، وتحديدًا pushState() و replaceState() لتعديل الشاشات، استخدِم هذا الخيار.

• الأحداث المخصّصة: إذا كان موقعك الإلكتروني يستخدم عنصر DocumentFragment لعرض شاشات مختلفة، استخدِم هذا الخيار.

تنفيذ سجلّ المتصفّح تنفيذ الحدث المخصّص

تنفيذ تغيير سجلّ المتصفّح

إذا كان تطبيقك من صفحة واحدة يستخدم History API، يمكنك تفعيل القياس المحسّن في "إحصاءات Google" لتتبُّع مشاهدات الصفحة تلقائيًا استنادًا إلى أحداث سجلّ المتصفّح.

ملاحظة مهمة: إذا كنت تضبط علاماتك باستخدام Google Tag Manager، لا تفعِّل التتبُّع التلقائي للسجلّ في "إحصاءات Google‏ 4"، لأنّ ذلك قد يؤدي إلى احتساب مشاهدات الصفحة مرّتَين. بدلاً من ذلك، اطّلِع على المقالة التعليمية قياس تطبيقات الصفحة الواحدة باستخدام Google Tag Manager.

تفعيل القياس المحسّن في "إحصاءات Google"

لقياس page_views تلقائيًا استنادًا إلى سجلّ المتصفّح:

1. افتح حسابك على "إحصاءات Google".

2. في قسم المشرف، ضِمن جمع البيانات وتعديلها، انقر على مصادر البيانات > الويب.

3. ضِمن القياس المحسَّن ، اضبط مفتاح التبديل على تفعيل لتفعيل كل الخيارات.

4. انقر على الرمز لتعديل الخيارات الفردية. ضِمن مشاهدات الصفحة، انقر على عرض الإعدادات المتقدّمة. احرِص على تفعيل كلٍّ من عمليات تحميل الصفحة وتغييرات الصفحة استنادًا إلى أحداث سجلّ المتصفّح.

   

5. انقر على حفظ لحفظ التغييرات.

التحقّق من إعدادات القياس

للتحقّق من أنّ تطبيقك من صفحة واحدة يقيس مشاهدات الصفحة بشكلٍ صحيح:

1. فعِّل وضع تصحيح الأخطاء لكل علامة في إعدادات قياس تطبيقك من صفحة واحدة. تعرّف على كيفية مراقبة الأحداث في DebugView.

2. انقر على تطبيقك من صفحة واحدة. عند النقر على شاشة افتراضية جديدة، من المفترض أن يظهر حدث page_view جديد في DebugView. قارِن مَعلمات حدث page_view بحدث page_view السابق للتحقّق مما إذا تم تعديل الإحالة إلى الصفحة وموقع الصفحة بشكلٍ صحيح.

اعتبارات إضافية لتطبيقات الصفحة الواحدة

بالإضافة إلى إرسال أحداث page_view، ننصحك بمراعاة هذه الجوانب الإضافية لتحقيق تكامل قوي لتطبيق من صفحة واحدة مع "إحصاءات Google" وتحسين تجربة المستخدم:

إدارة موضع التمرير

عندما ينتقل المستخدمون بين طرق العرض في تطبيق من صفحة واحدة، يحتفظ المتصفّح عادةً بموضع التمرير الحالي. قد يعني ذلك أنّ المستخدمين لا يرون أعلى الصفحة الافتراضية الجديدة، وقد يؤثر ذلك في تتبُّع عمق التنقل في الصفحة.

اقتراح: أعِد ضبط موضع التمرير برمجيًا إلى أعلى الصفحة أو حاوية المحتوى الرئيسية بعد كل انتقال إلى صفحة افتراضية.

// 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" بقياس التفاعل على الصفحة الافتراضية الجديدة بدقة.

ضمان إمكانية الوصول إلى المحتوى لميزات المتصفّح

إذا أبلغ المستخدمون عن مشاكل في ميزات المتصفّح، مثل عدم عمل ميزة البحث في الصفحة (Ctrl+F) بعد تحميل صفحة افتراضية، قد يشير ذلك إلى طريقة تعديل تطبيقك من صفحة واحدة لنموذج العناصر في المستند (DOM).

اقتراح: تأكَّد من أنّ إطار عمل تطبيقك من صفحة واحدة ومنطق التوجيه يعدِّلان بشكلٍ كامل ومتزامن الأجزاء ذات الصلة من نموذج العناصر في المستند (DOM) باستخدام محتوى الصفحة الجديدة. قد لا يكون المحتوى الذي يتم عرضه بتأخير أو المحتوى المخفي عن شجرة نموذج العناصر في المستند (DOM) الرئيسية قابلاً للفهرسة على الفور من خلال وظيفة البحث في المتصفّح. اختبِر ميزة البحث في الصفحة بعد عمليات التنقّل الافتراضية للتأكّد من إمكانية الوصول إلى المحتوى.

التأثير في الأحداث التلقائية

إذا نفّذت قياس مشاهدات الصفحة الافتراضية بشكلٍ صحيح في تطبيقك من صفحة واحدة، ستتعامل "إحصاءات Google" مع الأحداث التلقائية الأخرى بشكلٍ مناسب. إذا لم يتم تسجيل مشاهدات الصفحة الافتراضية لتغييرات الشاشة، ستتعامل "إحصاءات Google" مع تطبيق الصفحة الواحدة كصفحة واحدة، ما يؤدي إلى تحريف المقاييس.

على سبيل المثال، يقيس حدث user_engagement الوقت الذي يقضيه المستخدم بنشاط على صفحة. بدون مشاهدات الصفحة الافتراضية، يتم تحديد مصدر كل مدة التفاعل إلى عملية تحميل الصفحة الأولية، ما يجعل من المستحيل تحليل الوقت الذي يتم قضاؤه على شاشات فردية.

عند تنفيذ قياس مشاهدات صفحة على الويب الافتراضية بشكلٍ صحيح:

• يتم إرسال حدث user_engagement عندما ينتقل المستخدم من صفحة افتراضية إلى أخرى.
• يتم احتساب مدة التفاعل للصفحة الافتراضية السابقة وإرسالها مع حدث user_engagement، وعادةً ما يكون ذلك قبل معالجة حدث page_view للصفحة الافتراضية الجديدة مباشرةً.
• يتم ربط الأحداث الأخرى، مثل النقرات أو عمليات التمرير، بـ page_location للصفحة الافتراضية التي يعرضها المستخدم حاليًا.

يتيح لك ذلك تحليل تفاعل المستخدم والمقاييس الأخرى للشاشات أو الأقسام الفردية ضِمن تطبيقك من صفحة واحدة، ما يوفّر فهمًا أكثر دقة لرحلة المستخدم.