تحسين الصورة للويب: الدليل الكامل

يؤدي التحميل البطيء للصفحات إلى إيقاف التحويلات. تشير الدراسات إلى أن 40% من المستخدمين يغادرون موقعًا يستغرق أكثر من 3 ثوانٍ. السبب الأكبر؟ صور غير محسنة. يمكن لصورة واحدة بحجم 5 ميغابايت على صفحتك الرئيسية زيادة وقت التحميل حتى على الاتصالات السريعة.

قائمة التحقق من تحسين الصورة

الأبعاد الصحيحة — لا تشحن صورة بحجم 4000 بكسل حيث تعرض 800 بكسل
التنسيق الصحيح — WebP/AVIF الحديث، وJPG/PNG الاحتياطية
الضغط الصحيح — جودة تصل إلى 75%-85% للصور، وبدون فقدان للرسومات
التسليم الصحيح - التحميل البطيء ومجموعة srcset سريعة الاستجابة

الأبعاد الموصى بها في 2026

الصور الرئيسية: 1920×1080 (Full HD) أو 2560×1440 (2K) كحد أقصى
الجزء الرئيسي من مشاركة المدونة: 1200×675 (16:9)
صور المنتج: 1500×1500 مع دعم التكبير/التصغير، والعرض الافتراضي 800×800
الصور الرمزية: 256×256 (سيتم تصغير حجم الصور المصغرة)
فتح الرسم البياني (المشاركة الاجتماعية): 1200×630
الرمز المفضل: 32×32، 192×192، 512×512 PNG

قم بتغيير حجم الصور إلى هذه الأبعاد باستخدام أداة تغيير حجم الصورة قبل التحميل.

التنسيقات: متى تستخدم ماذا

WebP: الإعداد الافتراضي لـ 95% من صور الويب. أصغر بنسبة 25-35% من JPG بنفس الجودة. دعم المتصفح العالمي.
AVIF: أصغر حجمًا (50% أصغر من JPG). استخدم للصور البطل. المتصفحات الأحدث تدعمها.
JPG: صور فوتوغرافية بدون شفافية. توافق ممتاز.
PNG: الشعارات ولقطات الشاشة وأي شيء يتسم بالشفافية. ضياع.
SVG: رسومات متجهة وأيقونات ورسوم توضيحية بسيطة. حجم ملف صغير، وقياس لا نهائي.

يمكنك التحويل بين هذه التنسيقات باستخدام تحويل صور PDF7.

الضغط: ما مدى العدوانية الشديدة؟

بالنسبة للصور: ابدأ بجودة 85%. انخفض إلى 75% للصفحات ذات النطاق الترددي الحرج. أقل من 70%، تصبح القطع الأثرية مرئية. استخدم أداة ضغط الصور للعثور على التوازن الصحيح.

صور مستجيبة باستخدام srcset

لا تعرض صورة بدقة 2K على الهاتف. استخدم سمة srcset الخاصة بـ HTML:

يختار المتصفح أصغر صورة تناسبها. ستحتاج إلى 3 أحجام لكل صورة.

تحميل بطيء

أضف loading="lazy" إلى جميع الصور الموجودة أسفل الجزء غير المرئي. ولا تقوم المتصفحات الحديثة بتحميلها حتى يمرر المستخدم بالقرب منها، مما يوفر النطاق الترددي عند كل تحميل للصفحة.

قاعدة 100 كيلو بايت

استهدف الصور الفردية التي يقل حجمها عن 100 كيلوبايت. يمكن أن يصل حجم الصور الرئيسية إلى 200 كيلو بايت. إذا كان حجم الصورة الواحدة أكبر من 500 كيلو بايت، فقد أخطأت – أعد تغيير حجمها وأعد ضغطها.