פורמטי תמונות מודרניים ב-WordPress: מעבר ל-WebP ו-AVIF לחיסכון של 30-50%

JPG ו-PNG מבזבזים 30-50% משקל מיותר. WebP ו-AVIF נתמכים על ידי כל דפדפן מודרני - כך מבצעים מעבר.

תמונות הן 60-80% ממשקל הדף הממוצע. JPG ו-PNG הם פורמטים מהשנים 1992 ו-1996 בהתאמה - הם עובדים, אבל לא יעילים. WebP (מ-Google, 2010) חוסך 25-35% מגודל הקובץ באותה איכות נראית לעין. AVIF (מ-AOMedia, 2019, מבוסס AV1) חוסך 40-50% נוספים. בדף טיפוסי עם 10 תמונות זה הבדל של מאות KB עד מספר MB - שמתורגמים ישירות ל-LCP מהיר יותר ולציון Core Web Vitals טוב יותר.

למה זה משנה

נתוני התמיכה ל-2026 - WebP נתמך ב-Chrome, Edge, Firefox, Safari 14+, Opera, ו-Android browser. כיסוי גלובלי 97%+. AVIF נתמך ב-Chrome 85+, Firefox 93+, Safari 16.4+, Edge 121+. כיסוי 92%+. שני הפורמטים מאפשרים <picture> fallback ל-JPG/PNG עבור מי שלא תומך - אין סיכון לאבד גולשים.

ההשפעה על Core Web Vitals מורגשת בעיקר ב-LCP. תמונת hero של 200KB JPG הופכת ל-130KB WebP או ל-100KB AVIF. בחיבור 4G של 5Mbps זה הבדל של 100-200ms ב-LCP - בדיוק ההפרש בין "טוב" (≤2.5s) ל-"דורש שיפור". בנוסף, פחות bytes ברשת = פחות bandwidth ב-CDN = חיסכון בעלויות (Cloudflare/Bunny/Fastly מחשבים לפי GB).

עבור WooCommerce ואתרי e-commerce עם עשרות תמונות מוצרים בעמוד - ההשפעה דרמטית עוד יותר. קטלוג של 24 מוצרים יכול לרדת מ-4MB משקל תמונות ל-2MB. גולשי נייד שיכולים לטעון את העמוד = גולשים שקונים.

איך לזהות

פתח דף בית, F12 > Network > סנן Img. הסתכל על העמודה Type. אם רובן jpeg או png ולא webp או avif - יש מקום לשיפור. PageSpeed Insights ירשום "Serve images in next-gen formats" עם רשימה של תמונות מועמדות.

בדיקת שרת: האם הוא יודע להגיש WebP גם כשהקובץ במקור JPG?

curl -I -H "Accept: image/webp" https://YOUR-SITE/wp-content/uploads/IMAGE.jpg

אם הוא מחזיר Content-Type: image/webp - יש לך תוסף שעושה auto-conversion. אם image/jpeg - לא.

איך לתקן

שלוש שיטות מקובלות:

שיטה 1: תוסף המרה אוטומטית - Imagify, ShortPixel, או Converter for Media. הם ממירים כל העלאה חדשה ל-WebP/AVIF, שומרים בקובץ נלווה, ומגישים אותו דרך .htaccess או <picture> tag כש-Accept header של הדפדפן תומך.

שיטה 2: Cloudflare Polish (תכנית Pro של Cloudflare, $20/חודש) - ממיר ב-edge בלי לגעת בקבצי המקור. מועיל אם לא רוצים להוסיף תוסף.

שיטה 3: jpg לטוב או רע - אם אין תקציב לתוספים בתשלום ולא רוצים Cloudflare Pro, לפחות הרץ אופטימיזציה ל-JPG/PNG (Smush חינמי) - הם יכולים לרדת ב-30-50% גם בלי שינוי פורמט.

פעולת bulk להמרת המדיה הקיימת: רוב התוספים מציעים "Bulk Optimize" שיכול לקחת שעות באתר עם אלפי תמונות. הרץ אותו בערב/בלילה.

טעויות נפוצות

הטעות הראשונה: למחוק את ה-JPG/PNG המקוריים אחרי המרה - אין fallback למי שלא תומך, ובאם פעם תרצה לעבור לפורמט אחר יהיה לך רק WebP. שמור תמיד את המקור. הטעות השנייה: לשכוח לבדוק שה-server באמת מגיש WebP. רוב התוספים יוצרים את הקבצים אבל לא מתקנים את .htaccess אוטומטית. הטעות השלישית: להמיר תמונות שצריכות להישאר PNG (לוגואים עם שקיפות, אייקונים) ל-JPG - תאבד את הרקע השקוף. סנן לפי alpha channel.

בדיקה לאחר תיקון

פתח שוב את DevTools - העמודה Type לתמונות צריכה להראות webp או avif ב-90%+ מהמקרים. הרץ PageSpeed Insights - האזהרה "Serve images in next-gen formats" צריכה להיעלם, ו-LCP צריך לרדת ב-15-30%. בדוק WebPageTest - גרף Visual Progress צריך להגיע ל-Speed Index יותר מהר. ב-Cloudflare/CDN, בדוק שה-cache hits עולים - WebP גם נשמר ב-cache.

טיפ: Safari עד גרסה 16.3 לא תומך ב-AVIF, אבל כן ב-WebP. אם אתה מסתכל על קהל עם הרבה משתמשי iPhone ישנים, וודא שהתוסף מגיש WebP ל-Safari ולא AVIF, או שיהיה fallback מסודר.