بی­‌شک از کلیدی‌ترین فاکتورها برای هر وب‌سایتی، سرعت است که با تکنیک­‌های مختلفی می­‌توان آن را بهبود داد. از راه های رایج برای افزایش سرعت سایت — خصوصا در سایت‌های فروشگاهی — به‌کارگیری از قابلیت Lazy load یا لود تنبل است. در این مطلب از فروشگاه ساز تک‌وب با ما همراه باشید تا با لود تنبل، کاربردهای آن و چگونگی به‌کارگیری آشنا شوید.

قابلیت لود تنبل یا lazy loading چیست؟

به‌طور میانگین حدود 70 درصد از حجم هر صفحه از وب­‌سایت را ویدئوها و تصویرهای به کار رفته در آن صفحه به خود اختصاص می‌­دهند. این مساله می­‌تواند تاثیر زیادی در کاهش سرعت آن صفحه به­ هنگام لود شدن برای کاربر داشته باشد. خوب، آمارها نشان می­‌دهند که اگر نمایش سایت بیش از 3 ثانیه طول بکشد، حدود 53% از بازدیدکنندگان صبر نمی­‌کنند و صفحه را می­‌بندند. lazy load از تکنیک‌های سئو وجود دارد که در این مورد می‌­تواند به وب­‌سایت­‌ها کمک کند و علاوه­ بر کاهش حجم مصرفی از اشتراک، در نهایت موجب افزایش سرعت سایت شود.

به­ عنوان مثال تصور کنید وارد یک صفحه از سایتی می­‌شوید که در انتهای آن یک ویدئو بارگذاری شده است. تکنیک lazy loading باعث می‌­شود تا زمانی که شما به پایین صفحه اسکرول نکرده‌­اید — ویدئو برای‌تان لود نشود و با سرعت بیشتری بتوانید محتوای مورد نیاز خود در آن صفحه را مشاهده کنید. در عمل به‌کارگیری از lazy loading باعث می­‌شود تا متن، تصاویر و ویدئوهای موجود در یک صفحه و به­ طور کلی منابعی که در صفحه قابل دیدن هستند، پس از اسکرول کردن به ترتیب برای ما دانلود شوند و سپس نمایش داده شوند.

تکنیک lazy load چه کاربردهایی دارد؟

همان­ طور که اشاره کردیم از کلیدی‌ترین موارد در عملکرد سایت، سرعت آن است. علاوه بر کاربران — موتورهای جستجو نیز علاقه‌­ای به سایت‌­های کند ندارند. بنابراین حتی اگر چند ثانیه هم سرعت سایت‌مان از رقیب بهتر باشد، جایگاه مناسب‌تری نسبت به او خواهیم داشت.

افزایش سرعت سایت در نهایت موجب بهبود تجربه کاربری و کاهش نرخ پرش سایت نیز می­‌شود. هم‌چنین دلیل دیگر به‌کارگیری از این تکنیک — تاثیر آن بر کاهش مصرف پهنای باند صفحه می‌باشد زیرا تا زمانی که کاربر صفحه را اسکرول نکند — تصاویر و ویدئوها برای او دانلود نخواهند شد.

به این نکته هم در نظر بگیرید که کاهش مصرف پهنای باند موجب کاهش هزینه­ پرداخت و نگهداری سرور نیز خواهد شد.

یک مزیت دیگر به‌کارگیری از تکنیک lazy load این است که اگر در سایت خود برای نمایش محتوا به کاربر از جاوا اسکریپت به‌کارگیری کرده باشیم، باید این موضوع را در نظر داشته باشیم که درصورت به‌کارگیری از تصاویر زیاد، تا زمانی که تمام آنها بارگذاری نشده باشند، اجرای اسکریپت­‌ها به تعویض خواهد افتاد.

چگونه می‌­توان از قابلیت لود تنبل (lazy load) در سایت به‌کارگیری کرد؟

برای به‌کارگیری از این تکنیک در سایت­‌های وردپرس به­ خصوص برای کمک به سئو سایت مرکز معاملهی، می­‌توانیم از چندین افزونه کمک بگیریم که عبارتند از:

• افزونه BJ Lazy Load
• افزونه Lazy Load by WP Rocket
• افزونه a3 Lazy Load
• افزونه Optimole
• افزونه Smush
• افزونه Lazy Loading XT

در ادامه مطلب مطلب مطلب مطلب امکانات هرکدام از این افزونه­‌ها برای قابلیت لیزی لود در سایت را شرح می­‌دهیم.

افزونه BJ Lazy Load

این افزونه که در CMS وردپرس به کار گرفته می‌­شود، از بهترین گزینه‌­ها برای دستیابی به قابلیت Lazy loading به ­خصوص برای کسانی است که کمتر می­‌خواهند درگیر مدیریت وب­‌سایت و کار با آن شوند. نکته قابل توجه در مورد این پلاگین میزان رضایت کاربران از آن هست — به ­گونه‌ای که اکثر به‌کارگیری­‌کنندگان به آن نظر مثبت داده‌­اند و نمره 4.1 از 5 را دریافت کرده است.

افزونه BJ Lazy Load قابلیت نصب آسانی دارد و کار کردن با آن نیز ساده و راحت است. از ویژگی‌­های این افزونه این پدیدار می‌شود که می‌توانید تعیین کنید کدام یک از ویدئوها و تصاویر موجود در وب­‌سایت از همان ابتدا دانلود شوند و به شکل lazy load لود نشوند.

اما از کلیدی‌ترین ویژگی­‌های این افزونه، قابلیت تصویر جایگزین است. به ­گونه‌­ای که از طریق آن می‌­توانید یک تصویر کم حجم در سایت آپلود کنید و تا زمانی که تصاویر موجود در هر صفحه برای کاربر در حالت لود نشده هستند — تصویر جایگزین را مشاهده کند.

افزونه Lazy Load by WP Rocket

این پلاگین یکی دیگر از ابزارهایی است که به شما این امکان را می­‌دهد تا زمانی که روی تصویری اسکرول نکرده‌­اید، نمایش داده نشود، هم‌چنین به‌کارگیری از آن نیز رایگان وجود دارد. علاوه بر تصاویر سایر موارد موجود در صفحه همچون متن — آواتار و iFrame ها را نیز بررسی می­‌کند.

این افزونه قابلیت‌­های متعددی دارد که برخی از آن­ها عبارتند از: Gzip، CDN، Object Cache، رابط کاربری ساده، هوشمند در درک مطلب و غیره.

افزونه a3 Lazy Load

با به‌کارگیری از افزونه a3 Lazy Load که تاکنون بیش از 200 هزار نصب فعال داشته، می­‌توانید بدون نیاز به تخصص خاصی به راحتی از قابلیت Lazy load در سایت خود به کار ببرید. هم‌چنین به‌کارگیری از آن نیز در وردپرس رایگان است.

از این افزونه می‌­توانید برای بارگذاری سریع‌­تر تصاویر، ویدئوها و iframeها به کار ببرید. اما نکته قابل توجه در خصوص این افزونه — سازگاری بالای آن با ووکامرس برای سایت‌های تجارت الکترونیک است.

افزونه Optimole

این افزونه رایگان امکان بهینه سازی 1GB تصاویر در ماه را به کاربران می‌­دهد و تاکنون بیش از 80 هزار نصب فعال داشته می‌باشد.

این پلاگین ویژگی‌­های دیگری نیز دارد که برخی از آن­ها عبارتند از: پشتیبانی انواع تصاویر، امکان متمایز کردن برخی از تصاویر از لیزی لود، بهینه­‌سازی خودکار تصاویر، سازگاری با ویرایشگرهایی مانند المنتور.

افزونه Smush

شاید از اصلی­‌ترین دلایل محبوبیت این افزونه برای دسترسی به لیزی لود، قابلیت استفاد آسان از آن باشد. هم‌چنین نسخه رایگان آن نیز تمام امکانات لازم برای بهینه‌سازی تصاویر را در اختیار شما قرار می­‌دهد — اگر نیاز به امکانات بیشتری داشتید می‌­توانید نسخه پرو آن را خریداری کنید.

افزونه Smush که تاکنون بیش از یک ملیون نصب فعال داشته، قابلیت­‌های متعددی را در اختیار ما قرار می­‌دهد که مهم‌­ترین آن­ها عبارتند از: امکان پشتیبانی از فایل­­‌های تصویری PNG و JPEG و هم‌چنین GIF، امکان تشخیص تصاویری که حجم زیادی دارند، بهینه‌سازی اتوماتیک درهنگام بارگذاری کردن، بهینه‌سازی تصاویری که حجم خیلی زیادی دارند، سازگاری با پروتکل HTTPS.

در نسخه پریمیوم این افزونه نیز امکان فشرده‌­سازی بالا، تغییر سایز تصاویر به صورت اتوماتیک و بهینه‌سازی نامحدود تصاویر وجود دارد.

افزونه Lazy Loading XT

با وجودی که این افزونه 5 سال است که به روزرسانی نشده و این یک نکته منفی در به‌کارگیری از پلاگین­‌ها هست، اما تاکنون حدود 2000 نصب فعال داشته و اکثر به‌کارگیری‌کنندگان از آن راضی هستند. از مهم‌­ترین ویژگی­‌های این افزونه که باعث محبوبیت آن شده — این است که علاوه بر بهینه­‌سازی تصاویر کمک می‌کند تا کدهای css — html و جاوا اسکریپت را نیز فشرده‌­سازی کنید و از این طریق سرعت سایت را افزایش دهید.

با تکنیک لیزی لود، بهینه‌سازی سایت خود را بهبود ببخشید

در این مطلب از بلاگ فروشگاه ساز تک‌وب به این موضوع پرداختیم که تکنیک لیزی لود (lazy load) چیست؟ جالب است بدانید که چه کاربردهایی دارد و چگونه می‌­توانیم از آن در وب­سایت به‌کارگیری کنیم تا سرعت سایت را افزایش دهیم و در نهایت رضایت کاربران را جلب کنیم. چند نمونه از پلاگین­‌های پرکاربرد که برای به‌کارگیری از این قابلیت به­ خصوص در هنگام راه‌اندازی فروشگاه آنلاین به آن‌­ها نیاز خواهید داشت، معرفی کردیم.

اگر تجربه‌­ای در زمینه به‌کارگیری از تکنیک لیزی لود دارید و یا سوالی درخصوص آن دارید می‌­توانید در بخش کامنت­‌ها، پیام خود را با ما و دیگران به اشتراک بگذارید. هم‌چنین اگر قصد طراحی یک سایت فروشگاهی جذاب برای کاربران‌تان با رعایت همه نکات مورد پسند گوگل را دارید — می­‌توانید با تیم متخصص و کاربلد تک‌وب بگیرید. کارشناسان ما پاسخگوی شما همراهان خواهند بود.

شروع فروش آنلاین با تک‌وب

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