نظرة عامة
الهدف هو "أصغر ولكن لا يزال حادًا". تقليل الحجم بدون فقدان حقيقي محدود، ولكن يمكنك جعل الصور أخف بشكل ملحوظ بدون فقدان جودة ملحوظ من خلال تغيير الحجم وضبط الضغط بذكاء.
خطوة بخطوة
- حدّد أقصى عرض تحتاجه الصورة للعرض (مثل 1200 بكسل لرؤوس المقالات).
- غيّر الحجم إلى ذلك العرض مع الحفاظ على نسبة الأبعاد.
- صدّر الصورة بصيغة WebP (أو JPG) مع إعداد جودة مناسب.
نصائح عملية
- بالنسبة للصور الفوتوغرافية، جرّب WebP أو JPG بجودة حوالي 0.8–0.9 وقم بالمراجعة بصريًا.
- بالنسبة لواجهات المستخدم/الرسومات، فضّل PNG أو WebP بدون فقدان للحفاظ على الحواف الواضحة.
- لا تكبر الصور الصغيرة — التكبير لن يضيف تفاصيل حقيقية.
الإعدادات الشائعة
حالة الاستخدام | العرض المستهدف | الصيغة |
---|---|---|
رأس المقال | 1200–1600 px | WebP أو JPG (جودة ≈80–90) |
صورة المحتوى | 800–1200 px | WebP أو JPG (جودة ≈75–85) |
صورة مصغّرة/بطاقة | 400–800 px | WebP أو JPG (جودة ≈70–80) |
الشعارات/أصول واجهة المستخدم | ملاءمة دقيقة للبكسل | PNG أو WebP بدون فقدان |
جرّبها الآن
الأسئلة الشائعة
ما هي أسرع طريقة لتقليل حجم الملف؟
غيّر الحجم أولاً إلى أبعاد العرض الفعلية، ثم اختر WebP/JPG بجودة متوسطة. المراجعة البصرية أفضل من الاعتماد على الأرقام الثابتة.
هل أحتاج لأحجام مختلفة لشاشات الريتنا؟
إذا كان موقعك يقدّم أصولًا بدقة 2×، صدّر الصور بحجم مضاعف لحجم CSS (مثل 1600 بكسل لمكان 800 بكسل) ودع الصور المتجاوبة تختار النسخة المناسبة.
هل سيقلل تحويل صور PNG إلى JPG من الحجم؟
عادةً نعم — يتم ضغط الصور الفوتوغرافية بشكل أفضل باستخدام الصيغ ذات الفقدان. احتفظ بـ PNG للرسومات ذات الألوان المسطحة وواجهات المستخدم.
قد يعجبك أيضًا: JPG مقابل PNG مقابل WebP · أفضل 5 أدوات مجانية