תמונה מהמצלמה או מ-Stock library שוקלת בדרך כלל פי 5-10 ממה שהאתר באמת צריך. JPG ב-quality 100 מהאייפון הוא 4-8MB; אותה תמונה ב-quality 80 (לא נראה הבדל) היא 400-800KB. בלי תוסף אופטימיזציה, כל הקבצים הללו עוברים דרך WordPress כמו שהם ומוגשים לכל גולש - מבזבז bandwidth, מאריך טעינה, ופוגע ב-LCP.
למה זה משנה
תמונה אחת של 2MB בעמוד hero יכולה להעיף את ה-LCP ל-5+ שניות במכשירי נייד עם 4G ממוצע. אותה תמונה ב-300KB - ה-LCP נשאר מתחת ל-2.5 שניות (יעד Core Web Vitals של Google). ההבדל: ציון "Good" מול "Poor" ב-PageSpeed Insights, ולכן השפעה ישירה על דירוג חיפוש (Google משתמש ב-Core Web Vitals כסיגנל ranking מאז 2021).
בנוסף, פחות bytes = פחות bandwidth ב-CDN ובאחסון, מה שיכול לחסוך לאתר עם תנועה גבוהה עשרות עד מאות שקלים בחודש. ובכלל - דף שנטען מהר משאיר רושם של "אתר מקצועי" לעומת "אתר עצלן" - עיני מקדם המכירה רואות את זה ישירות באחוזי המרה.
איך לזהות
הרץ PageSpeed Insights על הדף הראשי - הקטגוריות "Properly size images" ו-"Efficiently encode images" יציגו רשימה של תמונות שאפשר לחתוך. כל אחת תופיע עם החיסכון הצפוי בקילובייטים. אם הסכום הוא 500KB+ - יש כאן עבודה ברווח גבוה.
בדיקה ידנית: עבור לספריית מדיה, סדר לפי גודל קובץ. כל תמונה מעל 500KB דורשת תשומת לב. תמונות מעל 1MB - תקן מיד. בדוק גם את הגודל הפיזי בפיקסלים: תמונה ב-4000×3000 שמופיעה כ-800×600 בעמוד היא בזבוז (השרת מגיש 12 מגה-פיקסלים, הדפדפן מקטין ל-0.5 מגה-פיקסל).
איך לתקן
שלוש שכבות אופטימיזציה משלימות:
שכבה 1: דחיסה (lossy). התקן Smush (חינמי), Imagify (חינמי + פרימיום), או EWWW Image Optimizer (חינמי, מבצע הכל מקומית). הפעל "Auto-optimize on upload" כדי שכל תמונה חדשה תקבל טיפול. הרץ "Bulk Optimize" על המדיה הקיימת - יכול לקחת שעות באתרים עם אלפי תמונות.
שכבה 2: שינוי גודל. ב-Imagify והגדרות > מדיה, הגדר max width של 2000px. WordPress יקטין כל העלאה גדולה יותר. עבור פוסטים בלבד 1200-1600px מספיק.
שכבה 3: פורמט מודרני. WebP חוסך 25-35% נוספים מעבר ל-JPG דחוס. AVIF חוסך עוד 40-50%. ראה מאמר נפרד על image_format_mix.
בנוסף, הפעל lazy loading - WordPress 5.5+ עושה את זה אוטומטית עבור תמונות בתוכן הפוסט, אבל לעיתים תבניות שוברות את זה.
טעויות נפוצות
הטעות הראשונה: להגדיר quality נמוך מדי (60 ומטה) - הדחיסה תהיה גלויה לעין, במיוחד באזורי גרדיאנטים ובעור. quality 75-85 הוא הסטנדרט המקובל. הטעות השנייה: להפעיל אופטימיזציה אגרסיבית בלי לשמור backup של המקור. אם תרצה לעבור פורמט בעתיד, תהיה לך רק הגרסה המקושית. הטעות השלישית: לאופטם תמונות אבל לשכוח את גודל הפיקסלים - 800×600 ב-quality 60 שוקל 30KB, אבל אותה תמונה ב-4000×3000 ב-quality 60 עדיין שוקלת 800KB. החל את הקטנת המידות לפני הדחיסה.
בדיקה לאחר תיקון
הרץ שוב PageSpeed Insights. "Properly size images" ו-"Efficiently encode images" צריכים להיעלם או להיות מינימליים. LCP צריך לרדת ב-300-1500ms תלוי בכמה תמונה כבדה הייתה. בדוק WebPageTest - גרף Filmstrip צריך להראות שהדף מציג תוכן הרבה יותר מהר. הסכום הכולל של bytes ב-DevTools Network צריך לרדת ב-30-60%. Lighthouse Score בסעיף "Performance" צריך לעלות ב-10-25 נקודות.