معايير الصورة القابلة للإستخدام في الويب – الجزء الأول

كتبه أحمد مجدي 18 يناير 2014

في مقال سابق علي معمل ألوان ناقشنا مفهوم “قابلية إستخدام الصور في الويب” وكيف يمكن لصورة واحدة أن تؤثر تأثيراً جوهرياً على الطريقة التي يفهم بها المستخدم الموقع، فبعد أن تأكدنا من ان الصور ليست مجرد ديكور، كيف يمكن اذاً ان نختار الصور التي نستخدمها في تصميم الموقع؟ كيف يمكن أن ننقد الصور المعروضة بموقع الويب؟ وكيف نتأكد أنها قابلة للإستخدام فعلاً؟ هل هناك معايير يمكن أن تساعدنا أثناء الإختيار والتعامل مع الصور؟

James Chudley مؤسس مدونة PhotoUX المتخصصة في قابلية استخدام الصور، وضع عدة معايير مبدئية يمكن ان تساعد المصممين في اختيار الصور التي تحقق الغرض وتكون صالحة للإستخدام علي الويب، هذه المعايير جمعها James في “قائمة تحقق”؛ أطلق عليها أسم: Photo Usability Checklist v1.0، لتكون مرجع رئيسي لأي مصمم يقرر استخدام الصور في تصميم موقع الويب، سنناقش ونحلل بنودها في هذا المقال مع عدد من الاعتبارات الاخرى التي ستسهل عملنا عندما نتعامل مع الصور.

الصورة كقناة تواصل مع الجمهور

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

معايير الصورة القابلة للإستخدام

سنقسم معايير الحكم على الصورة القابلة للإستخدام إلى ثلاث أجزاء رئيسية:-

  1. هل الصورة مقروءة وصادقة أم انها صورة مفتعلة غير حقيقية؟ في المقال السابق ناقشنا مخاطر استخدام الصور الجاهزة Stocks وكيف أن المستخدمين لا يحبون الصور التي تبدو وكأنها مصطنعة أو تحتوي على أناس يفعلون الأشياء لا تفعل عادة في الحقيقية.. هذا المعيار أساسي في تحديد ما اذا كان الجمهور سيتقبل الصورة أم لا؟ – إذ ان اي صورة لا يمكن رؤيتها بشكل صحيح أو أنها تفتقر إلى المصداقية سيتم تجاهلها فوراً من قبل المستخدمين.
  2. ما هي الرسالة التي توصلها الصورة للجمهور؟ هذا المعيار يجعلك تفكر في الهدف الاصلي والرسالة التي ترغب أن تعبر عنها الصورة، والأهم من ذلك، كيف سيتم تفسير وفهم الصورة في الواقع من قبل المستخدمين؟
  3. كيف أن الصورة ستساعد المستخدم في المهمة التي أتى الموقع من أجلها؟ هل الصورة تقرب المستخدم من الهدف أم انها تشكل عائق وتهديد حقيقي ستمنعه من تحقيق هدفة من الموقع؟

الجزء الأول: هل الصورة مقروءة وصادقة أم انها صورة مفتعلة غير حقيقية؟

يغطي هذا الجزء أول أساسيات قابلية استخدام الصورة، ألا وهو المصداقية فالصورة التي تفتقر إلى المصداقية من المرجح أن يتم تجاهلها فوراً من قبل المستخدمين، لكي تتحقق من أن الصورة التي اخترتها حققت معيار المصداقية اسأل نفسك هذه الاسئلة:-

أ- هل يمكنك ان ترى بوضوح مضمون الصورة الفوتوغرافية؟ حجم الصورة، محتواها، هل العناصر التي بداخلها تمثل تناغماً مقبولاً أم لا؟

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

مثال لكيفية تطبيق هذا المعيار في الصور…

وضوح مضمون الصورة - حقوق الصورة لجريدة Boston.com
وضوح مضمون الصورة – حقوق الصورة لجريدة Boston.com

هذه الصورة من جريدة Boston وهي صورة لاحد الناجين من انهيار مبني في بنغلاديش، علي الرغم من وجود عدد كبير من الاشخاص (مواطنون – عمال انقاذ – افراد من الجيش) والعناصر (النقالة) فان الصورة تجبرك علي التركيز علي شئ واحد وهو الطفلة بالمنتصف -محور القصة- والتي توجد في بؤرة التركيز، دقة الصورة واضحة كما أن الناس لا ينتظرون التقاط الصورة، الجميع منهمك في إنقاذ الطفلة، لو حاولنا اعادة تحجيم الصورة بحذف أي عنصر منها ربما يؤثر هذا الاجراء علي مضمون القصة التي تريد أن توصلها الصورة. (معيار مضمون الصورة).

ب- هل الصورة صادقة أم انها مفتعله؟ إذا كنا نشكك ولو للحظة واحدة في صحة ومصداقية الصورة فنحن في الغالب لن نتقبل الرسالة التي تريد أن توصلها لنا الصورة.

  • حرفية التقاط الصورة: هل الصورة تبدوا كأن مصور محترف هو من التقطها؟ هذا البند مهم جداً في تقييمنا لمصداقية الصورة، المصور المحترف ينتبة لمعايير مثل التوازن، اتساع فتحة عدسة التصوير، البعد البؤري … الخ، أنت لست مطالباً بفهم هذه المعايير، لكن المصور المحترف هو من يفهمها، أنت تعتمد عليه في إلتقاط صورة إحترافية.
  • مطابقة العلامة التجارية: هل الصورة هي من نوع الصور التي تتوقع أن تراها من هذه العلامة التجارية؟ بعض العلامات التجارية والشركات الكبرى تتخذ “استايل” و إتجاه معين في الصور الدعائية التي تمثل علامتها التجارية، لا تجعل الصورة التي تضعها في الموقع لتمثل علامة تجارية ما لا تجعلها تبتعد عن النغمة السائدة التي تستخدمها الشركة دائماً.
  • الملائمة: هل الصورة مناسبة للسياق الذي ستعرض به؟
  • المصداقية: إلى أي مدى تم التلاعب بالصورة؟ هل يؤثر هذا على مصداقية الرسالة التي تنقلها الصورة؟
  • الأهمية: هل الصورة ذات صلة بالمحتوي الموجود في نفس الصفحة؟

مثال لكيفية تطبيق هذا المعيار في الصور…

مطابقة العلامة التجارية - صورة لإحدي اعلانات Nike
مطابقة العلامة التجارية – صورة لإحدي اعلانات Nike

من المعروف أن انشاء العلامات التجارية مرتبط بمفهوم Tone of Voice وهو مصطلح يعني بروح العلامة التجارية والنغمة التي تستخدمها الشركة للتواصل مع الجمهور وعرض علامتها بل وربطها باذهان الناس، أنت كمصمم عندما تعمل علي موقع لشركة ما يجب أن تطلع علي نغمة هذه الشركة ولغتها في التواصل أو شخصيتها امام الناس، من أنجح العلامات التجارية التي طبقت هذا المصطلح Nike فأغلب الصور التي تستخدمها تجسد رسالتها “Just Do it”، عندما تعمل على موقع لأحد العلامات التجارية يجب أن تضع هذا المفهوم نصب عينيك، هل الصورة التي أستخدمها بالموقع تسير على نفس طريق العلامة التجارية؟ هل تجسد رسالتها؟ نعم أعلم جيداً أن أغلب العلامات التجارية في عالمنا العربي -باستثناء العظمى منها- لا تهتم بهذا … لكن الحقيقة أن هذا ما يجب أن يكون وليس ما هو كائن!

سنناقش الجزئين الثاني والثالث من معايير الصورة القابلة للإستخدام في المقالات القادمة.

هذا خيال وليس واقع!

إستخدام الصور أمر حيوي وضروري في عملنا للويب، بعض المعايير التي تحقق أقصى إستفادة من الصور في المواقع قد لا نستطيع أن نطبقها في كل مشروع نعمل عليه فهناك صعوبات كلنا نعلمها ونعيشها في عملنا اليومي مع العملاء خاصة في الوطن العربي، لكن الواقع يقول أن هذا لن يستمر فالجودة تفرض نفسها وآتية لا محالة، اشحن مهارتك وتمكن من عملك. فالصور عامل مهم لنجاحك في “التواصل البصري” مع المستخدمين وهذه بعض الإحصائيات والحقائق التي تؤكد هذا…

  • 90٪ من المعلومات التي تنتقل إلى الدماغ مرئية، والمرئيات (صور- فيديو …) يتم معالجتها في الدماغ أسرع 60،000 مرة من معالجة النصوص. (المصدر : 3M Corporation and Zabisco)
  •  40٪ من الناس يستجيبون بشكل أفضل إلى المعلومات البصرية من النص العادي.  (المصدر:Zabisco)
  • في متاجر الويب، 63٪ من الزبائن يعتقدون أن جودة صور المنتجات أكثر تأثيراً علي قرارهم بشراء المنتج من المعلومات النصية الموجودة في صفحات عرض المنتجات. (المصدر:jeffbullas)

عن كاتب المقال

أحمد مجدي
مصمم لواجهات إستخدام، أمتلك مهارات في تجربة الإستخدام وخبرة معرفية وعملية عن التصميم الجرافيكي والتفكير التصميمي، عملت مع أصحاب الأعمال التجارية في الشركات الكبيرة، المتوسطة، الصغيرة والأفراد لبناء جسور بين إحتياجات المستخدمين وأهدافهم التجارية. تابعني على تويتر: @ahmedmagdi


كل مقالات الكاتب

اترك تعليقك على المقال 5 تعليقات

  • بن إسحاق سوفت

    ماهة الواجهات التفاعلية ؟
    هل هي الحركية أم شئ آخر ؟

  • محمد عيساني

    موضوع جدا رائع وقد يكون مرجعية لكثير من المصممين العرب الذين يريدون ان يكونو محترفين
    وكما اشرت انت البقاء للاصح.
    شكرا لك.

  • عالم ادسنس

    الظاهر ان لديك خبرة كبيرة في الكتابة
    فقد جعلتني اكمل المقال رغم نفوري منه من العنوان لانه ليس اختصاصي

  • Mohamed Saber

    الموضوع ممتاز جداً