اگر وب سایت وردپرس شما به شدت متکی است روی محتوای بصری، ممکن است بخواهید قابلیت بارگذاری تنبل را به آن اضافه کنید. این ویژگی وردپرس به بهبود وب سایت کمک می کند page سرعت و عملکرد، آن را برای تلاش های سئوی شما ضروری می کند.

این مقاله روش عملکرد بارگذاری تنبل را همراه با مزایا و معایب آن بررسی خواهد کرد. همچنین روش اجرای آن را یاد خواهید گرفت روی وب سایت شما و راه های بهینه سازی استفاده از آن برای نتایج بهتر.

این قابلیتی است که به وب سایت اجازه می دهد فقط تصاویری را که برای کاربر قابل مشاهده است بارگیری کند. این به سایت کمک می کند تا با دانلود نکردن تصاویر خارج از نما، سرعت بارگذاری سریع را حفظ کند.

بارگذاری تنبل وردپرس چگونه کار می کند؟

هنگامی که کاربر از یک وب سایت وردپرس بازدید می کند، مرورگر او تمام تصاویر موجود در وب را دانلود می کند page فورا. برای صفحاتی با تصاویر با وضوح بالا، این process می تواند زمان بارگذاری را به میزان قابل توجهی افزایش دهد و به عملکرد سایت شما آسیب برساند.

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

بارگذاری تنبل وردپرس: روش پیاده سازی آن روی سایت شما
بارگذاری تنبل وردپرس: روش پیاده سازی آن روی سایت شما 8

مزایا و معایب بارگذاری تنبل وردپرس

اگر هنوز نمی‌دانید که آیا باید بارگذاری تنبل تصویر را در وردپرس پیاده‌سازی کنید، در اینجا مزایا و معایب این ویژگی وجود دارد:

طرفداران:

  • استفاده از پهنای باند را کاهش می دهد و هزینه هاست را کاهش می دهد.
  • سرعت سایت را بهبود می بخشد و تجربه مرور بازدیدکنندگان را بهتر می کند.
  • تجربه موبایل را افزایش می دهد.
  • بزرگترین امتیاز رنگ محتوایی را بهینه می کند
  • تلاش های سئو را بهبود می بخشد و رتبه بندی جستجوی سایت شما را افزایش می دهد.

معایب:

  • باعث بافر شدن محتوا می شود و به سرعت بارگذاری آسیب می رساند.
  • اسکرول سریع را کاهش می دهد.

چگونه بارگذاری تنبل وردپرس را به سایت خود اضافه کنیم: 3 روش

سه راه برای اجرای بارگذاری تنبل وجود دارد روی سایت وردپرس شما ما توصیه می کنیم یکی از بهترین ها را انتخاب کنید که مناسب شرایط شما باشد.

1. به وردپرس 5.4 یا بالاتر ارتقا دهید

وردپرس 5.4 و نسخه های بالاتر به طور پیش فرض شامل تصاویر با بارگذاری تنبل است. به روز رسانی وردپرس خود به جدیدترین نسخه به طور خودکار بارگذاری تنبل را فعال می کند.

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

پیشنهاد می‌کنیم بخوانید:  روش نصب Node.js روی اوبونتو به صورت خودکار و دستی

یکی دیگر از عواملی که باید در نظر گرفت ماهیت متفاوت ویژگی بارگذاری تنبل در هر نسخه وردپرس است. اخیراً وردپرس پست کرده است که وردپرس 5.9 اصلاحاتی را برای حل مشکلات مربوط به امتیازات رنگ محتوای بزرگ ضعیف نسخه های قدیمی تر اجرا می کند.

یعنی وب سایت ها در حال اجرا هستند روی نسخه های قدیمی وردپرس از مزایای مشابه نسخه 5.9 وردپرس برخوردار نیستند.

2. Native Lazy Loading از طریق مرورگر را فعال کنید

مرورگرهای محبوب مانند کروم، فایرفاکس و اپرا از بارگذاری تنبل تصویر بومی پشتیبانی می کنند. شما فقط باید ویژگی بارگیری را به تصاویر و ویدئوهای مورد نظر اضافه کنید تا به طور خودکار فعال شود.

در بارگذاری تنبل بومی وردپرس، ویژگی loading از این سه مقدار پشتیبانی می کند:

  • خودکار ‒ بارگذاری تنبل پیش‌فرض را راه‌اندازی می‌کند، که همان ویژگی بارگیری نیست.
  • تنبل ‒ بارگذاری دارایی ها را تا زمانی که هر کدام به فاصله مشخص شده از viewport برسد توزیع می کند.
  • مشتاق ‒ به محض اینکه تمام دارایی ها را بارگیری می کند page بارها، صرف نظر از مکان آنها.

در اینجا مثالی از روش استفاده از آن آورده شده است:

<img src=”image-name.png” loading=”lazy” alt=”alt attribute” width=”200″ height=”200″>

این روش برای بارگذاری تنبل تصاویر خاص ایده‌آل است و به هر کدام یک ویژگی بارگذاری می‌دهد که زمان ظاهر شدن آن‌ها را در ویوپورت دیکته می‌کند. با این حال، بارگذاری تنبل تصاویر فردی ممکن است کمی طول بکشد، به خصوص اگر وب سایت شما فایل های رسانه ای زیادی داشته باشد.

3. یک پلاگین نصب کنید

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

در زیر بهترین پلاگین های وردپرس برای بارگذاری تنبل برای انتخاب وجود دارد که از طریق فهرست پلاگین وردپرس قابل دسترسی هستند.

بهینه سازی تصویر و بارگذاری تنبل توسط Optimole

بنر افزونه وردپرس Optimoleبنر افزونه وردپرس Optimole

یکی از نکات مثبت Optimole این است که از انواع تصاویر از جمله AVIF پشتیبانی می کند. این افزونه بار تنبل فریمیوم بهینه سازی و مقیاس بندی تصاویر وردپرس را به تناسب آنها ارائه می دهد روی دستگاه های بازدیدکنندگان، تضمین تجربه کاربری مطلوب.

هنگامی که شبکه کندتر را تشخیص می دهد، Optimole به شما این امکان را می دهد که کیفیت تصویر را کاهش دهید. علاوه بر این، با ذخیره تصاویر در کتابخانه ابری Optimole، فضای ذخیره سازی را ذخیره کنید.

این افزونه رایگان به شما امکان می دهد تصاویر را برای حداکثر 5000 بازدید ماهانه بهینه کنید. خرید طرح Pro به شما این امکان را می دهد که تصاویر را برای 25000 بازدید کننده فعال ماهانه و بیشتر بارگذاری کنید. تصاویر در هر دو طرح از طریق CDN AWS ​​Cloudfront ارائه می‌شوند.

Smush

بنر پلاگین وردپرس Smushبنر پلاگین وردپرس Smush

Smush یک افزونه محبوب بهینه سازی تصویر است که از بارگذاری تنبل پشتیبانی می کند. با تم های محبوب سازگار است، page سازندگان و افزونه های کتابخانه رسانه. علاوه بر این، به شما امکان می دهد تنظیمات افزونه را در پیکربندی های نامحدود ذخیره کنید و آنها را با چند کلیک اعمال کنید.

پیشنهاد می‌کنیم بخوانید:  بایگانی VPS

سایر ویژگی های مفید عبارتند از: تشخیص نادرست اندازه تصویر، پشتیبانی از چند سایت و ابزارهای فشرده سازی تصویر. ارتقاء به Smush Pro به شما امکان می دهد تصاویر بزرگ را بدون محدودیت اندازه بهینه کنید. backup تصاویر اصلی و دسترسی به سایر پلاگین های WPMU Pro. شروع قیمت ها از 5 دلار در ماه.

بار تنبل a3

بنر پلاگین وردپرس a3 Lazy Loadبنر پلاگین وردپرس a3 Lazy Load

a3 Lazy Load یک افزونه رایگان بارگذاری تنبل مبتنی بر موبایل است. این به طور کامل با وردپرس 5.9 و تعدادی از ابزارهای محبوب از جمله پلاگین های WebP و AMP سازگار است.

A3 Lazy Load علاوه بر ارائه ویژگی‌های اولیه بارگذاری تنبل تصویر، به شما امکان بارگذاری تنبل ویدیوها را نیز می‌دهد – از جمله ویدیوهای جاسازی شده در صفحات، پست‌ها، انواع پست سفارشی و ابزارک‌ها. جلوه های بار تنبل و گزینه بارگیری اسکریپت ها از سرصفحه یا پاورقی نیز موجود است.

سایر ویژگی‌های قابل توجه عبارتند از پشتیبانی چند سایت، پشتیبانی از تصویر WebP، و بارگذاری تنبل iframe – این ویژگی برای iframe‌هایی که هسته وردپرس بارگیری نمی‌کند، مانند Google Maps و رسانه‌های جاسازی شده اعمال می‌شود.

نکات بارگذاری تنبل وردپرس

نکته کلیدی برای بهترین استفاده از بارگذاری تنبل، استفاده صحیح از آن است. در اینجا چند نکته برای انجام بارگذاری تنبل آورده شده است روی سایت وردپرس شما:

  • تصاویر را در بالای صفحه بارگذاری نکنید. به عنوان تصاویر قرار داده شده در بالای page هنگام بارگذاری قابل مشاهده هستند، بارگذاری تنبل آنها هیچ فایده ای ندارد.
  • متغیرهای مناسب را انتخاب کنید. ما توصیه می کنیم از یک رنگ ثابت، غالب یا یک تصویر با کیفیت پایین به عنوان محل قرارگیری برای تصاویر خود استفاده کنید.
  • اضافه کردن زمان بافر برای بارگذاری تصویر به این ترتیب، تصاویر شما درست قبل از ورود به نمای بازدیدکنندگان آماده می شوند و زمان انتظار را از بین می برند.
  • ابعاد محفظه های تصویر را تعریف کنید. انجام این کار به جلوگیری از تغییرات ناگهانی چیدمان و ایجاد وب شما کمک می کند page هنگام بارگیری مرتب به نظر برسید
  • اجرای بارگذاری تنبل روی فقط صفحات طولانی صفحات طولانی شامل صفحاتی می شود که بیش از دو طومار طول می کشد تا به انتهای آن برسند و بیش از پنج تصویر در زیر تاشو دارند.

نتیجه

بارگذاری تنبل تصاویر در وردپرس به شما این امکان را می دهد که تجربه مرور بهتری را به بازدیدکنندگان بدهید. این ویژگی علاوه بر بهبود سرعت سایت، استفاده از پهنای باند شما را نیز کاهش می دهد. به طور کلی، به تلاش های سئوی شما برای رتبه بندی جستجوی بالاتر کمک می کند.

امیدواریم این مقاله به شما کمک کرده باشد تا بدانید چگونه از قابلیت بارگذاری تنبل حداکثر استفاده را ببرید روی سایت های وردپرسی اطمینان حاصل کنید که از هاست وردپرس با کیفیت بالا برای بهبود عملکرد سایت خود استفاده کنید. موفق باشید!

سایر تکنیک های پیشرفته وردپرس را بیاموزید

راهنمای همه چیزهایی که باید در مورد پایگاه داده وردپرس بدانید
راهنمای GDPR وردپرس
روش اضافه کردن فیلدهای سفارشی وردپرس
روش راه اندازی صفحه بندی WordPres
روش ایجاد کد کوتاه در وردپرس
عملکرد get_posts وردپرس چیست و چگونه از آن استفاده کنیم
روش قرار دادن iFrame در وردپرس