التعامل مع الصور – مجلة الامه العربيه

الفصل الخامس

التعامل مع الصور

من أجل الحفاظ على صفحات ويب صغير الحجم وسهلة التداول عبر شبكة الانترنت سوف نتعرف الآن على الأنواع المختلفة من ملفات الصور لكي نتعرف على أفضل هذه الأنواع للاستخدام في صفحات الويب ويكون ذلك من خلال عرض للأنواع المختلفة من ملفات الصور مثل:

* صور GIF

* صور JPEG

* صورPNG

من حيث مستوي الجودة و الحجم و قابلية هذه الأنواع للضغط و تقليل الحجم دون التأثير الملحوظ على مستوى جودة هذه الصور، كما سنتعرف أيضًا على الاستخدامات المختلفة لكل نوع من هذه الأنواع من الصور الذي يفضل استخدام هذا النوع فيها دون غيره من باقي أنواع الصور الأخرى.

أولاً: صور GIF

ظهر هذا النوع من الصور Graphic Interchange Format(GIF) في بداية الثمانيذات من القرن الماضي كنوع من الملفات لنقل الصور عبر شبكات الاتصال، وفي التسعيذات من القرن الماضي تم تعديل هذا النوع من الصور لكي يناسب الاستخدام عير شبكة الانترنت، ويتميز هذا النوع من الصور بتعرف غالبية متصفحات الإنترنت عليه، وعلى هذا الأساس تعبر غالبية الصور الموجودة الآن على شبكة الإنترنت من هذا النوع.

ويتميز هذا النوع من الصور بالإضافة إلي تعرف غالبية متصفحات الانترنت عليه بشكل افتراضي يتميز أيضًا بقابلية هذا النوع من الصور بالضغط وتقليل مساحته بنسبة كبير دون أن يؤثر ذلك تأثيرًا ملحوظًا على جودة الصورة، كما يتميز هذا النوع من الصور أيضًا لدعمه للألوان الشفافة.

ولكن يعاب على هذا النوع من الصور أنه بالنسبة للصور المعقدة ذات التفاصيل الكثيرة إذا ما تم ضغط هذه الصور وتقليل مساحتها فإن هذه الصور تفقد الكثير من تفاصيلها، حيث تكون الصور ذات المساحات اللونية المتشابهة والتفاصيل القليلة أكثر قابلية للضغط عن الصور المعقدة كثير التفاصيل كما يوضح ذلك الشكل التالي:

صورة ذات تفاصيل أكثر غير قابلة للضغط صورة ذات تفاصيل اقل قابلة للضغط

ويتم ضغط الصور من نوع GIF لتقليل حجم هذه الصور لتسهيل عملية تداولها عبر شبكة الإنترنت عن طريق تقليل عدد الألوان التي تحتوي عليها هذه الصور لأقل عدد من الألوان الضرورية لإظهار تفاصيل الصورة، وإزالة الألوان الغير ضرورية بالصورة لإظهار تفاصيلها فيمكن مثلاًَ تقليل الصورة التي تحتوي على ملايين الألوان إلي صورة تحتوي فقط على 256 لون أو صور تحتوي فقط على 128 لون أو صورة أحادية اللون تحتوي على الأبيض و الأسود فقط كما يوضح ذلك الشكل التالي:

صورة تحتوي على ملايين الألوان تم تخفضها إلى ١٥٦ لون

صورة تحتوي على ملايين الألوان تم تخفضها إلى 64 لون

تخفيض حجم الألوان بالصورة عن طريق تقليل عدد الألوان بها

وهناك نوع من أنواع صور GIF غير مترابط أو غير متشابك يتم تحميله من شبكة الإنترنت تدريجيًا في شكل خطوط أفقية من البيكسيلات حيث يتم تحميل الصورة من الشبكة على شكل خطوط أفقية من اعلي إلي أسفل حيث

يقوم متصفح الإنترنت بعرض هذه الصور خطأ بخط تدريجيًا حتى تكتمل الصور تمامًا، و هناك نوع آخر من صور GIF مترابط يتم تحميله من شبكة الإنترنت مرة واحدة، ويقوم الإنترنت بعرض الصورة غير واضحة المعالم في أول الأمر عندما تكون الصورة غير مكتملة بعد، وبعد ذلك تكتمل الصورة و تظهر كل تفاصيلها عندما تكتمل عملية تحميلها من الشبكة ومن هذا النوع من الصور المترابطة هو الصور المتحركةGIF Animated وتميز الصور المترابطة التي يتم تحميلها مرة واحدة من شبكة الإنترنت في أن هذا النوع من الصور يمكن أن يعطي زائر الموقع فكرة عن محتويات الصورة أثناء تحميلها من الشبكة وقبل أن تكتمل الصورة تمامًا، وبوضح الشكل التالي الطريقة التي يتم تحميل صور GIF المترابطة وغير المترابطة بها:

صورGIF المترابطة صور GIF الغير مترابطة التي يتم تحميلها مرة واحدة من الشبكة التي يتم تحميلها تدريجيًا من الشبكة

وكل من نوعي صور GIF المترابطة والغير مترابطة الموضحة في الشكل السابق له استخداماته الخاصة، ففي الصور الكبير الحجم التي تستخدم في الصفحة كالخلفيات يفضل الكثير من المصممون استخدام الصور المترابطة أما في الأيقونات والصور الصغيرة والأزرار يفضل استخدام الصور الغير مترابطة حيث سيتم فتح هذه الصور في الصفحة بشكل أسرع لصغر حجمها أما الصور الكبيرة الحجم التي تأخذ وقتًا أكبر في فتحها على الشبكة فيفضل استخدام الصور المترابطة حيث قد لا يلاحظ زائر الموقع الصورة أثناء اكتمالها.

كما تدعم صور GIF كما ذكرنا الألوان الشفافة حيث يمكن باستخدام أحد برامج الصور المتطورة اختيار أحد الألوان في الصورة و جعله شفافًا كما يوضح الشكل التالي فقط تم اختيار احد ألوان الموجودة في الصور وتحويله إلي لون شفاف.

دعم صور GIF للألوان الشفافة

ولكن يعاب على خاصية تخفيف احد الألوان بعينها في صور GIF أنها ليست اختيارية بمعني أنك لا تستطيع التحكم في تخفيف اللون في جزء من الصورة دون باقي أجزاء الصورة، ففي حالة تخفيف أحد الألوان الموجودة في الصورة يتم تخفيف كل المناطق التي تأخذ هذا اللون، فكما يوضح الشكل التالي، أنه بتخفيف اللون الموجود في أحد المناطق من الصورة تم تخفيف نفس اللون في كل أجزاء الصورة.

صورة GIF ذات خلفية صفراء

تخفيف اللون الأصفر بخلفية الصورة

تخفيف اللون في كل الأجزاء بالصورة

فكما يوضح الشكل السابق أن تخفيف اللون الموجود في خلفية الصورة أدي إلي تخفيف اللون في كل المناطق بالصور التي تحمل نفس اللون.

وتوجد مشكلة أخرى لتخفيف بعض الألوان في صور GIF وهو أن تخفيف ألوان صور GIF يؤدي إلي خشونة حواف هذه الصورة وظهور زوائد بهذه الصورة كما يوضح الشكل التالي وتظهر هذه الزوائد بشكل أكبر عند استخدام الصورة مع خلفية بينها و بين الصور درجة تباين كبيرة.

تخفيف ألوان صور GIF يؤدي إلى ظهور زوائد حول حدود الصورة