يتم تحديد حجم وجودة الصورة للاستخدام على صفحة الويب من خلال عدة عوامل مختلفة.
الحجم المادي (Physical Size)
يعتمد الحجم المادي للصورة على أمرين: حجم الصورة على الشاشة وحجم الملف. بشكل عام، يتم التعامل مع حجم الملف كمسألة منفصلة.
حجم الملف (File Size)
هذا هو حجم الملف على القرص الصلب (hard drive) أو الخادم (server).
الدقة (Resolution)
الدقة (Resolution) تشير إلى عدد البكسلات في الصورة. يتم تحديد الدقة أحيانًا من خلال عرض وارتفاع الصورة بالإضافة إلى إجمالي عدد البكسلات في الصورة.
نوع الملف (File Type)
يوجد أساسًا X أنواع من الصور الشائعة على الإنترنت: jpeg,gif,png و (لـ أيقونات المفضلة/favicons وهي الأيقونات بجوار العنوان) ico.
الحجم المادي للصورة هو معلومات نحتاج إلى معرفتها من أجل تحديد مقدار "المساحة" التي ستشغلها الصورة على صفحة الويب. إذا كان قالب ووردبريس (WordPress Theme) الخاص بك يحتوي على منطقة محتوى ذات عرض ثابت يبلغ 600 بكسل والصورة التي تريد استخدامها بحجم 800، فإن الصورة ستدفع الشريط الجانبي وتخطيط صفحة الويب لتغيير مكانها، مما يؤدي إلى إفساد التصميم الخاص بك. يجب تقييد الصور داخل عرض 600 بكسل ليصل إلى هذا العرض الأقصى من أجل حماية تخطيط صفحتك. الأمر متروك لك لتحديد الحجم الذي يجب أن تكون عليه من هناك، بما يتناسب مع التخطيط العام والأنماط الخاصة بك.
حجم الملف يحدد الوقت المستغرق لتحميل صفحتك؛ فكلما زاد حجم الملف - وغالبًا ما يزداد بسبب جودة دقة الصورة العالية - كلما استغرق تحميله وقتًا أطول. غالبًا ما لا يمتلك الأشخاص الصبر للانتظار خلال أوقات التحميل الطويلة لصفحات الويب، لذا فإن الحفاظ على أحجام ملفاتك منخفضة يسرع من أوقات الوصول إلى صفحة الويب الخاصة بك. عادةً، يجب الاحتفاظ بالصور الكبيرة عالية الجودة بين 100 كيلوبايت و60 كيلوبايت. أما الصور الأصغر فيجب أن تكون أقرب إلى 30 كيلوبايت أو أقل.
دقة الصورة تحدد وضوحها. ومع ذلك، كلما كانت الدقة أعلى، كلما زاد حجم الملف، لذا عليك إجراء تنازل أو تسوية بين الجودة وحجم الملف.
لحسن الحظ، تحتوي أنواع الملفات المختلفة الأكثر استخدامًا على الإنترنت على ميزات ضغط (compression). عند حفظ الملف كأحد هذه الأنواع، فإنه يقوم بتكثيف أو ضغط معلومات البيانات في ملف الصورة. يمكن لمتصفحات الإنترنت فك ضغط هذه المعلومات لعرض الصورة على الشاشة. تتيح لك بعض برامج رسومات الجرافيك تعيين معدل الضغط للتحكم في جودة الصورة (وحجم الملف) في وقت حفظها. اعتمادًا على استخدامك للصور على موقعك، قد اضطر إلى التجربة للوصول إلى النسبة الصحيحة التي تحافظ على جودة الدقة جيدة مع الحفاظ على حجم ملف صغير.
تستخدم مواقع الويب أربعة أنواع ملفات شائعة. نهاية اسم الملف (تسمى الامتداد أو extension) توضح نوعه. أحد الأنواع، ico، مخصص لإنشاء ملف أيقونة المفضلة (favicon) - ولكن عادة لا يتم القيام بذلك إلا عند إعداد موقع الويب لأول مرة. الأنواع الثلاثة الأخرى تُستخدم للصور العامة:
jpg(JPEG) جيد للصور الفوتوغرافية. حفظ الصورة بصيغةjpgيزيل التفاصيل من الصورة. تتيح لك محررات الصور الجيدة التحكم في مقدار التفاصيل التي تتم إزالتها ("الضغط"). تحتاج الصور المختلفة إلى درجات ضغط مختلفة؛ والقيام بذلك بعناية وعرض النتيجة يمكن أن يمنحك صورة قابلة للاستخدام بحجم ملف صغير.gifقد يكون سيئًا للصور الفوتوغرافية. إنه أفضل لفنون الخط (line art)، مثل الشعارات، ذات المساحات الصلبة من نفس اللون.pngمخصص لكل من الصور الفوتوغرافية وفنون الخط. يقوم بضغط الصور دون فقدان التفاصيل، ولكنه عادة ما ينتج عنه ملفات صور أكبر من ملفات JPEGs. ومع ذلك، فإن بعض المتصفحات القديمة لا تدعمpngبشكل كامل.
إذا لم تكن متأكدًا من نوع الملف الأفضل لصورة معينة، فحاول حفظ الصورة بأكثر من نوع ومقارنة أحجام الملفات. استخدام النوع الصحيح يمكن أن يحدث فرقًا كبيرًا! هناك المزيد من المعلومات في دليل أنواع وصيغ ملفات الصور (Image file type and format guide).
تغيير حجم الصور (Resizing Images)
لا تتيح لك جميع حزم برامج الجرافيك تغيير حجم الصور، على الرغم من أن معظمها يفعل ذلك. تحقق من جدول المحتويات أو الفهرس لبرنامج الرسومات الخاص بك للبحث عن مصطلحات تغيير الحجم (resize)، الحجم (size)، تحويل (transform)، تصغير (reduce)، أو تكبير (enlarge)، وكلها مرادفات لنفس الشيء. إذا لم يكن البرنامج يحتوي على هذه الميزة، فقد تحتاج إلى البحث عن برنامج مختلف.
عملية تغيير حجم الصور بسيطة إلى حد ما. عادة ما توجد طريقتان:
1) يمكنك تغيير حجم الصورة من خلال استخدام الأدوات المتوفرة التي تسمح لك بتحريك حواف الصورة يدوياً لتشوه الصورة أو تغيير حجمها. الطريقة الأفضل هي الإمساك بالزاوية، وليس الحفة، لتغيير حجم الصورة. "مقَبض (handle)" الزاوية سيقوم عادةً بتغيير حجم الصورة مع الحفاظ على نسبة الارتفاع إلى العرض الإجمالية. تحقق من دليلك للحصول على تعليمات محددة.
2) الطريقة الأخرى تتضمن ببساطة تحديد الحجم النهائي للصورة. تتيح لك برامج الرسومات المتقدمة تعيينه بأبعاد دقيقة أو نسبة مئوية للتصغير أو التكبير.
بعد تغيير حجم الصورة، قد تصبح الصورة أصغر، ولكنها قد تصبح أيضًا خارج التركيز (blur) قليلاً. يمكنك شحذ تركيز الصورة الصغيرة باستخدام ميزة الشحذ/التوضيح (sharpen) في برنامجك.
عندما تقوم بضبط صورتك الصغيرة ذات الحجم الصغير أو صورتك المصغرة الجديدة بدقة، قم بتصدير الصورة كملف jpg, gif, أو png.
