رفع محتوای تنبل بارگذاری شده
به تعویق انداختن بارگذاری محتوای غیر بحرانی یا غیرقابل مشاهده، که معمولاً به عنوان "بارگذاری تنبل" نیز شناخته می شود، بهترین عملکرد و UX رایج است. برای اطلاعات بیشتر، به اصول وب مراجعه کنید راهنما برای بارگذاری تنبل تصاویر و ویدیو. با این حال، اگر به درستی اجرا نشود، این تکنیک می تواند پنهان کردن ناخواسته محتوا از گوگل این سند توضیح می دهد که چگونه می توان مطمئن شد Google می تواند بخزد و محتوای بارگذاری شده تنبل را فهرست کنید.
زمانی که محتوا در نمای نمایش قابل مشاهده است، آن را بارگیری کنید
برای اطمینان از اینکه گوگل تمام محتوای صفحه شما را می بیند، مطمئن شوید که تنبل هستید اجرای بارگیری، تمام محتوای مرتبط را هر زمان که در آن قابل مشاهده باشد بارگیری می کند درگاه دید در اینجا چند مثال در مورد نحوه انجام این کار آورده شده است:
- بارگیری تنبل بومی برای تصاویر و iframe
- IntersectionObserver API و a polyfill
- یک کتابخانه جاوا اسکریپت که از بارگیری داده ها هنگام ورود به viewport پشتیبانی می کند
حتماً اجرای خود را آزمایش کنید.
پشتیبانی از بارگذاری صفحه بندی شده برای اسکرول بی نهایت
اگر در حال اجرای یک تجربه اسکرول بی نهایت هستید، حتماً پشتیبانی کنید بارگذاری صفحه بندی شده بارگذاری صفحه بندی شده برای کاربران مهم است زیرا اجازه می دهد آنها را برای به اشتراک گذاشتن و تعامل مجدد با محتوای شما. همچنین به گوگل این امکان را می دهد که a را نشان دهد پیوند به یک نقطه خاص در محتوا، به جای بالای یک نامتناهی صفحه پیمایش
برای پشتیبانی از بارگذاری صفحه بندی شده، یک پیوند منحصر به فرد به هر بخش که کاربران ارائه می دهند می تواند به طور مستقیم به اشتراک گذاشته و بارگیری شود. توصیه می کنیم از History استفاده کنید API برای بهروزرسانی URL هنگام بارگیری پویا محتوا.
تست
پس از تنظیم پیاده سازی خود، مطمئن شوید که کار می کند به درستی. یکی از راه های انجام این کار استفاده از Puppeteer است اسکریپت برای آزمایش محلی پیاده سازی خود. Puppeteer یک Node.js است کتابخانه ای برای کنترل هدلس Chrome. برای اجرای اسکریپت، به Node.js نیاز دارید. برای بررسی اسکریپت و اجرای آن از دستورات زیر استفاده کنید:
git clone https://github.com/GoogleChromeLabs/puppeteer-examples cd puppeteer-examples npm i node lazyimages_without_scroll_events.js -h
پس از اجرای اسکریپت، تصاویر اسکرین شات ایجاد شده توسط آن را به صورت دستی بررسی کنید مطمئن شوید که آنها حاوی تمام محتوایی هستند که انتظار دارید قابل مشاهده و نمایه شود توسط گوگل
شما همچنین می توانید استفاده کنید ابزار بازرسی URL در کنسول جستجو برای دیدن اینکه آیا همه تصاویر بارگذاری شده اند یا خیر. اسکرین شات و HTML ارائه شده را بررسی کنید برای اطمینان از بارگیری تصاویر شما.