כיצד ליישם טעינה עצלה עבור תמונות וסרטונים בוורדפרס
למה חשובה טעינה עצלנית
ללא טעינה עצלה, כל המדיה בדף נטענת באופן מיידי - גם אם היא עדיין לא גלויה על המסך. זה גורם ל:
- משקל עמוד גבוה יותר
- זמן טעינה ראשוני ארוך יותר
- ציוני ביצועים גרועים יותר ב-PageSpeed Insights
טעינה עצלנית פותרת זאת על ידי טעינת מדיה בלבד כשהמשתמש גולל מטה. זה משפר מהירות וחוסך רוחב פס.
טעינה עצלה לתמונות בוורדפרס
מאז גרסה 5.5, וורדפרס מוסיפה אוטומטית את loading="עצלן" תכונה לתמונות שהוכנסו דרך העורך. אתה לא צריך שום תוספים כדי להפעיל את זה.
כיצד לבדוק אם זה עובד:
- לחץ לחיצה ימנית על תמונה ← בדוק אלמנט
- לְחַפֵּשׂ:
<img src="..." loading="lazy"> - אם התכונה חסרה - בדוק את סימון התמונה של ערכת הנושא שלך או השתמש בתוסף
עֵצָה:
כמה נושאים ישנים יותר עוקפים או פוסלים loading="עצלן". במקרה זה, אתה יכול להוסיף אותו באופן ידני באמצעות מסננים או לעבור לנושא מודרני.
טעינה עצלה עבור YouTube וסרטונים
iframes וסרטונים משובצים של YouTube יכולים להאט משמעותית את מהירות הדף. השתמש בשיטות הבאות:
- השתמש בתמונת תצוגה מקדימה (פוסטר) וטען את ה-iframe רק בלחיצה
- תוספים כמו WP YouTube Lyte אוֹ עומס עצלן לסרטונים
- השתמש בתמונה ממוזערת קלת משקל והחלף אותה ב-iframe באופן דינמי באמצעות JavaScript
HTML מציין מיקום לדוגמה:
תוספים מומלצים לטעינה עצלנית
- a3 עומס עצלן - קל משקל וניתן להגדרה
- WP Rocket (פרימיום) - טעינה עצלנית של מדיה מלאה עם אופטימיזציה
- Perfmatters - כולל עומס עצלן ומנהל סקריפטים
בעיות פוטנציאליות שכדאי לצפות בהן
- תמונות או סרטונים "צצים" מאוחר מדי - השתמש במרווח מתאים
- מנועי חיפוש לא רואים מדיה - סורקים מודרניים תומכים בטעינה עצלה, אבל בודקים תוכן קריטי
- מדיה שבורה עבור דפדפנים ישנים יותר - בדוק חזרה במידת הצורך
בדיקת ביצועי עומס עצל
- לְהִשְׁתַמֵשׁ Page Speed Insights ← ראה זמן טעינת תמונה מופחת
- Chrome DevTools → רשת → סינון לפי מדיה → גלול וצפה בהתנהגות הטעינה
רוצה לעשות את זה נכון?
טעינה עצלנית היא פשוטה אך חזקה. תן ל-SpeedWP Pro לבדוק את אתר הוורדפרס שלך עבור נפיחות מדיה, בעיות עומס עצלות וחוסמים נסתרים - הכל בביקורת אחת בחינם.