এই ডকুমেন্টটি সেইসব ডেভেলপারদের জন্য যারা Google Analytics ব্যবহার করে তাদের সিঙ্গেল-পেজ অ্যাপ্লিকেশনে পৃষ্ঠা ভিউ পরিমাপ করতে চান।
সিঙ্গেল-পেজ অ্যাপ্লিকেশন (SPA) হল এমন ওয়েবসাইট যা একবার HTML ডকুমেন্ট লোড করে এবং জাভাস্ক্রিপ্ট API ব্যবহার করে যেকোনও অতিরিক্ত কন্টেন্ট নেয়।
যেমন: ধরুন, আপনার কাছে কিছু লিড পাওয়ার জন্য একটি ফর্ম আছে। এই ফর্মে তিনটি স্ক্রিন আছে: > * গ্রাহকের তথ্য ক্যাপচার করার জন্য প্রথম স্ক্রিন। * সেকেন্ড স্ক্রিন যেখানে গ্রাহকরা নির্দিষ্ট পরিষেবায় আগ্রহ প্রকাশ করেন। * তৃতীয় স্ক্রিন গ্রাহকের আগ্রহের সাথে সম্পর্কিত ওয়েবিনারে সাইন-আপ করার পৃষ্ঠা।
SPA থেকে পৃষ্ঠা ভিউ সঠিকভাবে পরিমাপ করার মূল চাবিকাঠি হল ব্যবহারকারী ইন্টার্যাক্ট করেন এমন প্রতিটি স্ক্রিনের জন্য পৃষ্ঠা ভিউ গণনা করা এবং পৃষ্ঠার রেফারার সঠিকভাবে পাওয়া, যাতে আপনি ব্যবহারকারীর অভিজ্ঞতা সঠিকভাবে ট্র্যাক করতে পারেন।
শুরু করার আগে
এই পৃষ্ঠায় ধরে নেওয়া হয়েছে যে আপনার কাছে আগে থেকেই এগুলি আছে:
আপনার ওয়েবসাইটের জন্য Google Analytics অ্যাকাউন্ট ও প্রপার্টি। কীভাবে Google Analytics সেট-আপ করবেন তা জানুন।
আপনার ওয়েবসাইটে Google ট্যাগ প্রয়োগ করা হয়েছে যা পৃষ্ঠা প্রথমবার লোড হওয়ার সময় ট্রিগার হয়। কীভাবে Google ট্যাগ সেট-আপ করবেন তা জানুন।
সিঙ্গেল-পেজ অ্যাপ্লিকেশন পরিমাপ প্রয়োগ করা
SPA-এর সঠিক পরিমাপ প্রয়োগ করতে, নতুন ভার্চুয়াল পেজ ভিউ ট্রিগার করতে, এই পদ্ধতিগুলির মধ্যে একটি ব্যবহার করুন:
ব্রাউজার ইতিহাসের পরিবর্তন (সাজেস্ট করা): আপনার SPA যদি স্ক্রিন আপডেট করার জন্য History API, বিশেষ করে
pushState()এবংreplaceState()পদ্ধতি ব্যবহার করে, তাহলে এই বিকল্প ব্যবহার করুন।কাস্টম ইভেন্ট: আপনার ওয়েবসাইট যদি বিভিন্ন স্ক্রিন রেন্ডার করার জন্য
DocumentFragmentঅবজেক্ট ব্যবহার করে, তাহলে এই বিকল্প ব্যবহার করুন।
ব্রাউজার ইতিহাস পরিবর্তন সংক্রান্ত প্রয়োগ
আপনার SPA যদি ইতিহাস API ব্যবহার করে, তাহলে আপনি Google Analytics-এ উন্নত পরিমাপ চালু করতে পারেন ব্রাউজার ইতিহাস ইভেন্টের উপর ভিত্তি করে পৃষ্ঠা ভিউ অটোমেটিক ট্র্যাক করতে।
Google Analytics-এ উন্নত পরিমাপ চালু করা
ব্রাউজার ইতিহাসের ভিত্তিতে page_views অটোমেটিক পরিমাপ করতে:
Google Analytics খুলুন
অ্যাডমিন বিকল্পে, ডেটা সংগ্রহ ও পরিবর্তন বিকল্পের অধীনে, ডেটা স্ট্রিম > ওয়েব বিকল্পে ক্লিক করুন।
উন্নত পরিমাপ বিকল্পের অধীনে, সব বিকল্প চালু করতে সুইচটি চালু করুন।
আলাদা আলাদা বিকল্প এডিট করতে ক্লিক করুন। পৃষ্ঠা দেখা বিকল্পের মধ্যে, উন্নত সেটিংস দেখুন বিকল্পে ক্লিক করুন। পেজ লোড ও ব্রাউজার ইতিহাসের ইভেন্টের উপর ভিত্তি করে পেজে পরিবর্তন, এই দুটিই চালু করতে ভুলবেন না।
পরিবর্তন সেভ করুন।
আপনার পরিমাপ সেট-আপ যাচাই করা
আপনার সিঙ্গেল-পেজ অ্যাপ্লিকেশনের পেজ ভিউ সঠিকভাবে পরিমাপ করা হয়েছে কিনা তা যাচাই করতে:
আপনার SPA পরিমাপ সেট-আপে প্রতিটি ট্যাগের জন্য ডিবাগ মোড চালু করুন। কীভাবে DebugView-তে ইভেন্ট মনিটর করতে হয়তা জানুন।
আপনার সিঙ্গেল-পেজ অ্যাপ্লিকেশন ক্লিক করে দেখুন। আপনি নতুন ভার্চুয়াল স্ক্রিনে ক্লিক করলে, DebugView-তে নতুন
page_viewইভেন্ট দেখতে পাবেন। পৃষ্ঠা রেফারের এবং পৃষ্ঠার লোকেশন সঠিকভাবে আপডেট করা হয়েছে কিনা তা চেক করতে, আগেরpage_viewইভেন্টের সাথেpage_viewইভেন্ট প্যারামিটার তুলনা করুন।
SPA-এর জন্য অতিরিক্ত বিবেচনা
page_view ইভেন্ট পাঠানোর পাশাপাশি, Google Analytics-এর সাথে
শক্তিশালী SPA ইন্টিগ্রেশন এবং আরও ভালো ব্যবহারকারীর অভিজ্ঞতার জন্য এই অতিরিক্ত বিষয়গুলি বিবেচনা করুন:
স্ক্রল পজিশন ম্যানেজ করা
SPA-তে ব্যবহারকারীরা যখন এক ভিউ থেকে অন্য ভিউতে নেভিগেট করেন, তখন ব্রাউজার সাধারণত বর্তমান স্ক্রল পজিশন ধরে রাখে। এর অর্থ হল, ব্যবহারকারীরা নতুন ভার্চুয়াল পৃষ্ঠার উপরের অংশ দেখতে পান না এবং এটি স্ক্রল ডেপথ ট্র্যাকিংকে প্রভাবিত করতে পারে।
সাজেশন: প্রতিটি ভার্চুয়াল পৃষ্ঠা ট্রানজিশনের পরে, প্রোগ্রামের মাধ্যমে স্ক্রল পজিশন পৃষ্ঠার উপরে বা প্রধান কন্টেন্ট কন্টেনারে রিসেট করুন।
// 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 আপডেট করে।
সাজেশন: নিশ্চিত করুন যে আপনার SPA ফ্রেমওয়ার্ক এবং রাউটিং লজিক সম্পূর্ণভাবে এবং সিঙ্ক্রোনাসভাবে নতুন পৃষ্ঠার কন্টেন্ট দিয়ে DOM-এর প্রাসঙ্গিক অংশ আপডেট করে। বিলম্বিত রেন্ডারিং বা মূল DOM ট্রি থেকে লুকানো কন্টেন্ট ব্রাউজারের সার্চ ফাংশন দ্বারা অবিলম্বে ইন্ডেক্স করা নাও হতে পারে। কন্টেন্ট অ্যাক্সেস করা যাচ্ছে কিনা তা কনফার্ম করতে ভার্চুয়াল নেভিগেশনের পরে অন-পেজ সার্চ পরীক্ষা করুন।
অটোমেটিক ইভেন্টের উপর প্রভাব
আপনার SPA-তে ভার্চুয়াল পেজ ভিউ পরিমাপ সঠিকভাবে প্রয়োগ করলে, Google Analytics অন্যান্য অটোমেটিক ইভেন্ট যথাযথভাবে ম্যানেজ করবে। স্ক্রিন পরিবর্তনের জন্য ভার্চুয়াল পৃষ্ঠা ভিউ রেকর্ড করা না হলে, Google Analytics, SPA-কে একটি পৃষ্ঠা হিসেবে বিবেচনা করে, যার ফলে মেট্রিক্সে ভুল তথ্য দেখা যায়।
যেমন, user_engagement ইভেন্ট কোনও পৃষ্ঠায় ব্যবহারকারীর অ্যাক্টিভ থাকার সময় পরিমাপ করে। ভার্চুয়াল পৃষ্ঠা দেখা না থাকলে, এনগেজমেন্টের সম্পূর্ণ সময়কে
প্রাথমিক পৃষ্ঠা লোডের সাথে অ্যাট্রিবিউট করা হয়, এর ফলে আলাদা আলাদা স্ক্রিনে
কতক্ষণ সময় ব্যয় করা হয়েছে তা বিশ্লেষণ করা অসম্ভব হয়ে পড়ে।
ভার্চুয়াল পেজ ভিউ পরিমাপ সঠিকভাবে প্রয়োগ করা হলে:
- ব্যবহারকারী একটি ভার্চুয়াল
পৃষ্ঠা থেকে অন্য পৃষ্ঠায় নেভিগেট করলে
user_engagementইভেন্ট পাঠানো হয়। - আগের ভার্চুয়াল পৃষ্ঠার এনগেজমেন্ট টাইম গণনা করা হয় এবং
user_engagementইভেন্টের সাথে পাঠানো হয়, সাধারণত নতুন ভার্চুয়াল পৃষ্ঠার জন্যpage_viewইভেন্ট প্রসেস করার ঠিক আগে। - অন্যান্য ইভেন্ট, যেমন ক্লিক বা স্ক্রল, ভার্চুয়াল পৃষ্ঠার
page_locationসাথে যুক্ত থাকে যা ব্যবহারকারী বর্তমানে দেখছেন।
এটি আপনাকে SPA-এর মধ্যে স্বতন্ত্র স্ক্রিন বা বিভাগের জন্য ব্যবহারকারীর এনগেজমেন্ট এবং অন্যান্য মেট্রিক বিশ্লেষণ করতে দেয়, যা ব্যবহারকারীর অভিজ্ঞতা সম্পর্কে আরও সঠিক ধারণা প্রদান করে।