ভাল করে দেখে নিন যাতে Google লেজি-লোডেড কন্টেন্ট দেখতে পায়

তাছাড়াও, জরুরি নয় অথবা দৃশ্যমান নয় এমন কন্টেন্ট দেরি করে লোড করাকে সাধারণভাবে "লেজি-লোডিং" বলা হয়। এটি UX সংক্রান্ত পেশাদার পদ্ধতির একটি সাধারণ অঙ্গ যা পারফর্ম্যান্সের উন্নতি করতে সাহায্য করে থাকে। আরও জানতে ওয়েবের মূল নীতির ছবি ও ভিডিও লেজি-লোড করা সংক্রান্ত নির্দেশিকা দেখুন। তবে, ঠিকভাবে প্রয়োগ করা না হলে এই পদ্ধতি অনিচ্ছাকৃতভাবে Google-কে কন্টেন্ট দেখতে বাধা দিতে পারে। Google কীভাবে লেজি-লোড করা কন্টেন্ট ক্রল ও ইন্ডেক্স করতে পারে তা এই ডকুমেন্ট থেকে জানতে পারবেন।

ভিউপোর্টে দেখা গেলে কন্টেন্ট লোড করা

ভিউপোর্টে কোনও প্রাসঙ্গিক কন্টেন্ট আসলেই লেজি-লোডের মাধ্যমে লোড হচ্ছে কিনা দেখুন। তাহলে, আপনার পৃষ্ঠার সব কন্টেন্ট Googlebot দেখতে পাবে। আপনি এটি কীভাবে করবেন তার কিছু উদাহরণ এখানে দেওয়া হল:

  • IntersectionObserver এপিআই এবং একটি polyfill
  • ভিউপোর্টে প্রবেশ করলে ডেটাকে জাভাস্ক্রিপ্ট লাইব্রেরি লোড করতে সাহায্য করে।

ঠিকভাবে প্রয়োগ করা হচ্ছে কিনা তা পরীক্ষা করে ভালভাবে দেখে নিন।

সীমাহীন স্ক্রলের জন্য একাধিক পৃষ্ঠায় কন্টেন্ট লোড করার সুবিধা দেওয়া

আপনি সীমাহীন স্ক্রল ব্যবহার করলে, একাধিক পৃষ্ঠায় কন্টেন্ট লোড করার সুবিধা দিতে ভুলবেন না। একাধিক পৃষ্ঠায় কন্টেন্ট লোড করলে ব্যবহারকারী আপনার কন্টেন্টের সাথে সহজে ইন্টার‍্যাক্ট করতে ও তা শেয়ার করতে পারেন। সীমাহীন স্ক্রোল করা হয় এমন একটি পৃষ্ঠার শুরুতে নির্দেশ না করে, এটি Google-কে কন্টেন্টের একটি নির্দিষ্ট জায়গায় লিঙ্ক দেখাতেও সাহায্য করে থাকে।

পৃষ্ঠার ক্রমসংখ্যা অনুসারে কন্টেন্ট লোড করার সুবিধা প্রদান করতে, প্রতিটি বিভাগে একটি করে অনন্য লিঙ্ক দেখান যেগুলি ব্যবহারকারীরা সরাসরি শেয়ার ও লোড করতে পারবেন। কন্টেন্ট ডায়নামিকভাবে লোড হলে, History API ব্যবহার করে ইউআরএল আপডেট করলে ভাল হয়।

পরীক্ষা করা

প্রয়োগ করা সম্পূর্ণ হয়ে গেলে, সেটি ঠিকভাবে কাজ করছে কিনা তা ভাল করে দেখে নেওয়া উচিত। সফলভাবে প্রয়োগ করা হয়েছে কিনা তা স্থানীয়ভাবে পরীক্ষা করতে Puppeteer স্ক্রিপ্ট ব্যবহার করুন। Puppeteer হল একটি Node.js লাইব্রেরি যা headless Chrome-কে কন্ট্রোল করে থাকে। স্ক্রিপ্টটি চালানোর জন্য, আপনার কাছে Node.js থাকতে হবে। নিম্নলিখিত কমান্ডগুলির সাহায্যে আপনি স্ক্রিপ্ট পরীক্ষা করতে ও চালাতে পারেন:

git clone https://github.com/GoogleChromeLabs/puppeteer-examples
cd puppeteer-examples
npm i
node lazyimages_without_scroll_events.js -h

আপনার দেখাতে চাওয়া ও Googlebot-এর মাধ্যমে ইনডেক্স করা প্রয়োজন বলে মনে করেন এমন সব কন্টেন্ট অন্তর্ভুক্ত আছে কিনা তা ভাল করে দেখে নিতে, স্ক্রিপ্টটি চালানোর পরে, সেটির তৈরি করা স্ক্রিনশট ছবিগুলি ম্যানুয়ালি পর্যালোচনা করে দেখুন।

এছাড়া, সব ছবি লোড হয়েছে কিনা দেখতে, Search Console-এ ইউআরএল খতিয়ে দেখার টুল ব্যবহার করে দেখতে পারেন। আপনার ছবিগুলি ভালভাবে লোড করা হয়েছে কিনা তা দেখবার জন্য, স্ক্রিনশট ও রেন্ডার করা HTML চেক করে দেখে নিন।