أرشيف التصنيف ‘قابلية الاستخدام’

لا تعرف ماذا تعني قابلية الاستخدام? قم بقراءة موضوع "ماهي قابلية الاستخدام؟"

أين المشكلة؟ #5

سلسلة “أين المشكلة؟” هي سلسلة خفيفة تحتوي مواضيعها على صورة من موقع أو تطبيق، و المطلوب منك اكتشاف مشكلة أو أكثر في الصورة المتضمّنة من ناحية قابلية الاستخدام. قد تكون المشكلة خلل واضح في قابلية الاستخدام، أو طريقة غير عملية لعرض المحتوى، أو غير ذلك.

صورة اليوم هي من الجزء الأعلى لموقع امبراطورية وحيد:

صورة من موقع امبراطورية وحيد

صورة من موقع امبراطورية وحيد (اضغط للعرض بحجمها الأصلي)

وجدت خمسة مشاكل في هذه الصوره، فهل يمكنك تحديدها؟

شاركنا بما تجده في التعليقات.

9 طرق سهلة لتطوير تصميم موقعك بشكل كبير

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

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

اضغط على الصورة لعرضها بحجمها الطبيعي

يرجى ملاحظة اني ساستخدم كلمة “عنصر” للإشارة الى أي عنصر يكون عادة في صفحات الانترنت من عناوين وصور ونصوص وما الى ذلك.

فلنبدأ:

أكمل قراءة بقية الموضوع »

موقع التأمينات الاجتماعية الجديد يدعو للفخر

تفاجأت ليلة أمس عند قيامي بزيارة موقع المؤسسة العامة للتأمينات الاجتماعية بتغيير كامل لتصميم وهيكلة الموقع، وهو في الحقيقة موقع متقدّم 10 سنوات ضوئية (على الأقل) عن المواقع الحكومية الأخرى.

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

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

تصنيف المعلومات حسب نوع الزوار في الموقع

تصنيف المعلومات حسب نوع الزوار في الموقع

نفس الأمر قاموا به في النماذج والاسئلة الشائعة كما ترى هنا:

صورة قائمة الاجراءات والنماذج

صورة قائمة الاجراءات والنماذج

حاولت الحصول على بعض المعلومات التي تهمّني من الموقع، وبالفعل كانت التجربة أسهل بمراحل من الموقع السابق.

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

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

ماذا عنك انت؟ ماهو انطباعك عن موقع التأمينات الاجتماعية الجديد؟

شاركنا برأيك في التعليقات.

أسوأ 5 مواقع سعودية حكومية في عام 2009

كتبت سابقاً عن نيتي لاختيار اسوأ موقع عربي لعام 2009، ولكن بعد التفكير في الأمر تبيّن لي صعوبته وذلك لوجود عدد مهول من المواقع العربية (السيئة)، فقررت حصرها في المواقع السعودية الحكومية (اي التابعه لجهات حكومية)، وذلك لان عددها محدود.

قضيت ليلة أمس اكثر من ساعة مررت بها على 135 موقع حكومي (استناداً على دليل الردادي للمواقع الحكومية)، وكانت في الحقيقة تجربة محزنة ومقرفة لي كمتخصص في مجال تطوير مواقع الانترنت الحديثه. واخترت في النهاية منها 5 مواقع تمثّل الاسوأ من ناحية قابلية الاستخدام (او سهولة الاستخدام)، و من ناحية تجربة المستخدم ككل. تم تصفّح جميع المواقع في متصفّح Firefox.

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

5. صندوق التنمية العقارية فرع المنطقة الشرقية

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

صورة الصفحة الرئيسية للموقع (اضغط للتكبير)

الموقع: http://www.aqarea.com/content.htm

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

أكمل قراءة بقية الموضوع »

موقع “خدماتي”: مثال لعدم تفهّم الشركات لاحتياجات عملائها

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

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

دعني لك أوضح لك مشكلة الموقع: هذه هي واجهة موقع خدماتي حالياً (بعد تسجيل الدخول):

الشكل الحالي لموقع خدماتي

الشكل الحالي لموقع خدماتي (اضغط الصورة لتكبيرها)

بغض النظر عن مسألة ان خدماتييبدو كموقع عادي وليس كتطبيق، الموقع يضع روابط لجميع الخصائص أمام المستخدم، وكل رابط يجبر المستخدم على المرور بأكثر من خطوة للحصول على ما يريد (معرفة مبلغ الفاتورة فقط يتطلب 4 نقرات كل مره!). أيضاً تم وضع الروابط جميعها بشكل وكأنها جميعها لها نفس الأولويه وتستخدم بنفس التكرار، مع ان ذلك غير صحيح فعلياً. فـ”الفاتورة الالكترونية” على سبيل المثال تستخدم أكثر بكثير من “تأسيس الهاتف”، وبالتالي يجب وضعها بشكل أبرز.

ما يمكن فعله هنا لتطوير الموقع واقناع العديد من العملاء باستخدامه هو أن تجعل الشركة الحصول على المعلومة من خدماتي أسهل بكثير من الاتصال على 902 او 907 (ارقام الشركه المجانيه). على سبيل المثال، بدلا من دفن تفاصيل الفاتورة في داخل التطبيق، يمكن للشركة عرضه في الصفحة الرئيسية بشكل سهل وعملي يساعد العميل على متابعة مصروفاته والتعامل معها مثل:

التطوير المقترح لموقع خدماتي

التطوير المقترح لموقع خدماتي (اضغط الصورة لتكبيرها)

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

بالطبع، يمكننا القيام بالمزيد لتطوير الصفحة الرئيسية، ولكن قمت بتطوير بسيط جداً لتوضيح الفكرة.

ما رأيك انت؟ هل ترى فرقاً بين الصورتين في الأعلى من ناحية سهولة الاستخدام؟ وهل تعتقد ان اقتراحي سيزيد من استخدام العملاء لموقع خدماتي؟

شاركنا برأيك في التعليقات.

“منتدى” متخصص في تطوير سهولة استخدام المواقع

أحببت أن أشاركك كقاريء ومهتم في قابلية الاستخدام (usability) وتجربة المستخدم (user experience) عموماً في موقع رائع اكتشفته مؤخراً يمكنه أن يساعدك في الاجابة على أي تساؤل في هذا المجال الجديد نسبياً، وهو موقع UX Exchange.

الموقع باللغة الانجليزية انجليزي، وهو فعلياً ليس “منتدى” (استخدمت كلمة منتدى لتقريب الفكرة فقط)، وانما هو موقع مبني على نظام الاسئلة والأجوبه (ويستخدم نظام موقع Stack Overflow الشهير)، ويزوره نخبه من المتخصصين في مجال تجربة المستخدم (user experience) بشكل عام. فان كانت لديك اية اسئلة في هذا المجال (سواء عن معلومة قرأتها في كتاب أو طلب مساعدة لمشكلة واجهتها في موقعك) فيمكنك أن تطرحها هناك، وسيتم تنقيح وتطوير الأجوبة التي تحصل عليها من قبل الأعضاء انفسهم (باضافة ملاحظات عليها، و بالتصويت لها أو ضدها)، وبذلك تضمن الحصول على أفضل اجابة لسؤالك.

وبالطبع، يمكنك دائماً كتابة سؤالك هنا ان كانت اللغة تعيقك عن استخدام ذلك الموقع.

بالمناسبة، هل تعتقد ان افتتاح موقع عربي للمساعدة في هذا المجال سيصبح مفيداً بشكل عام؟ أم انه لم يأتي وقتها بعد  لقلة المتخصصين والمهتمين في هذا المجال؟

شاركنا برأيك في التعليقات.

كيف يضر استخدام الفلاش بموقعك

يعتبر جيكوب نيلسونو الكثير من مصممي الوب المحترفين أن الفلاش (flash) و الإضافات الأخرى مثل سلفرلايت (Silverlight) مرض على الإنترنت، حيث أنها تقنيات مغلقة و ليست مفتوحة و حرة، مثلاً يمكن لـ أدوبي أو مايكروسوفت أن تطلب من مستخدمي إضافاتها مبلغاً معيناً مما يجعل موقع (يوتوب) youtube أو غيره مغلق لمعظم شرائح المستخدمين، و لكن موقع مثل (يوتوب) يقوم بدراسة استخدام وسائل أخرى لعرض مقاطع الفيديو بدون اللجوء إلى فلاش الآن للابتعاد من احتمالية حصول كارثة كهذه.

هناك 3 نقاط ذكرها (جيكوب) عن سبب كون فلاش (والاضافات الشبيهه به) سيء لقابلية الاستخدام و هي:

1. تحفّز لإساءة تصميم مواقع الانترنت

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

أكمل قراءة بقية الموضوع »

أين المشكلة؟ #4

سلسلة “أين المشكلة؟” هي سلسلة خفيفة تحتوي مواضيعها على صورة من موقع أو تطبيق، و المطلوب منك اكتشاف مشكلة أو أكثر في الصورة المتضمّنة من ناحية قابلية الاستخدام. قد تكون المشكلة خلل واضح في قابلية الاستخدام، أو طريقة غير عملية لعرض المحتوى، أو غير ذلك.

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

صورة نموذج التسجيل

صورة نموذج التسجيل

وجدت ثلاث مشاكل في هذا النموذج، فهل يمكنك معرفتها؟

شاركنا بما تجده في التعليقات.

ست اعتقادات خاطئة عن مجال قابلية الاستخدام

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

1. الدكتور جيكوب نيسلن يمثّل هذا المجال

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

2. قاعدة الثلاث نقرات

يعتقد الكثير من الناس ان من أهم القواعد في مجال قابلية الاستخدام هي قاعدة الثلاث نقرات (three-click rule)، و هي قاعدة تنص على أن الوصول لأي محتوى مهم في الموقع يجب أن لا يتطلّب أكثر من ثلاث نقرات، وهذا في الواقع غير صحيح لأسباب شرحتها في موضوع “كم نقرة يجب أن يتطلبها الوصول للمحتوى المطلوب؟“.

3. قابلية الاستخدام هي أهم عامل في نجاح الموقع

وهذه الفكره سائده عند المتحمّسين لهذا المجال. نعم، الاهتمام بقابلية الاستخدام سيساعد كثيراً في نجاح موقعك، و لكن هناك (على الأقل) 5 أشياء أخرى لا تقل أهمّية عن قابلية الاستخدام.

4. المتخصص يجب أن يكون دائما على صواب

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

5. يستطيع المتخصّص أن يصلح واجهة أي موقع مباشرة

كثيراً ما يطلب مني أصحاب المواقع بأن أقوم بإصلاح واجهات مواقعهم “على السريع” أو “كتابة تقارير سريعة” عن واجهة الموقع، ولكنني في كثير من الحالات لا أستطيع القيام بذلك (أو بالجودة المطلوبه على الأقل).فقبل أن أصلح واجهة موقع علي كمتخصّص أن أعرف المزيد عن الموقع أولاً مثل هدفه و الشريحة التي يستهدفها والمهام التي يقوم بها مستخدمي الموقع بشكل متكرّر.

و في حال كان الموقع تابع لشركه، فقد أحتاج إلى التحدّث مع أشخاص من أقسام مختلفة لمعرفة وجهة نظرهم وكيف يمكنني أن أجعل الموقع يساعدهم في تسهيل عملهم وتحقيق أهدافهم، فآرائهم لا تقل أهميّة عن رأيي الشخصي كمتخصّص.

6. لا يطوّر قابلية استخدام موقع انترنت الا المتخصّصين فقط

و هذا غير صحيح اطلاقاً، فمجال قابلية الاستخدام مبني على المنطق وعلى علوم النفس، ولا يتطلّب خبرة مسبقة مثل تصميم الجرافيكس أو البرمجه على سبيل المثال. يمكن لأي شخص بتطوير قابلية استخدام موقعه بعدّة طرق مثل القيام باختبار قابلية الاستخدام بنفسه، أو تطبيق اختبار الخمس ثواني على تصميم موقعه، أو قراءة كتاب Don’t Make Me Think الممتع و تطبيق مباديء قابلية الاستخدام المذكورة به.

لن تحصل على نفس نتائج عمل المتخصص على موقعك بالطبع، ولكنّك بالتأكيد ستقوم بتطويره للأفضل.

لديك اسئلة أو اضافات؟ شاركنا بها في التعليقات.

ثلاث مشاكل في: موقع مصرف الإنماء

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

المشكلة الأولى: نشاط مفرط في عناصر الصفحة الرئيسية

الصفحة الرئيسية للموقع

جزء من الصفحة الرئيسية للموقع (اضغط الصورة لتكبيرها)

مع ان الصفحة الرئيسية قصيرة و بسيطة، الا انها تحتوي على 5 اجزاء متحرّكة (المربعين الأزرقين، الصورة الرئيسية، الأخبار و شريط الأسهم). شخصياً لا أحبّذ استخدام الحركة الا عند محاولة لفت انتباه الزائر لشيء مهم حدث في الصفحة (تحذير، تنبيه عن خطأ قام به…الخ)، فاستخدام الكثير من العناصر المتحرّكة تشتّت الزائر. هناك أيضاً معلومات مفيدة نسبياً في المربعات الزرقاء (آخر موعد قبل البدء باستخدام رقم الآيبان للتحويل و دوام الخميس) في المربعات الزرقاء التي قد لا ينتبه لها الزائر أو لا يستطيع قرائتها بسرعة، مما قد يجبره إلى الانتظار حتى تظهر تلك المعلومات مره أخرى.

فائدة: حاول قدر الامكان أن تجعل الحركة محدودة بالعناصر التي “يجب” أن يراها الزائر (كما ذكرت التحذيرات و التنبيهات على سبيل المثال). و عند اضطرارك لاستخدام العناصر المتحركه لعرض معلومات معيّنة، فوفّر للزائر طريقة للتحكم بها بحيث يمكنه الرجوع لمعلومه معيّنه أو ايقاف الحركة عندها حتى يتمكن من قرائتها.

المشكلة الثانية: استخدام مصطلحات مبهمة ومتعارضة

الشريط الجانبي الخاص بمصرفية الأفراد

الشريط الجانبي الخاص بمصرفية الأفراد

في الشريط الجانبي توجد قائمة “مصرفية الأفراد” تضم تحتها ثلاث روابط:

  • الخدمات المصرفية للأفراد
  • التسجيل للشركاء غير المسجّلين
  • فتح حساب لشركاء المستقبل

لاحظ كيف وصف العملاء بكلمة “أفراد” في الرابط الأول و من ثم وصفهم بكلمة “شركاء” في الرابطين التاليين، مما يوحي ان تلك الروابط غير مرتبطة ببعضها البعض. وكلمة “شركاء” عموماً لا تستخدم عادة لوصف عملاء بنك، فشخصياً عندما رأيتها اعتقدت ان روابط “الشركاء” هي لمن يرغب في مشاركة البنك في شيء معيّن (أسهم، مشاريع…الخ)، أي يعمل كشريك، ولكن يبدو ان مسؤولي الموقع فضّلوا الجانب التسويقي على الجانب العملي.

يمكن أيضاً ملاحظة مشكلة مشابهة في قائمة التصفّح الرئيسية في أسماء الأقسام، فأسماء مثل “الهوية” و “تفائل” و “أفكار” هي اسماء مبهمة وقد تعني شيء مختلف لكل زائر.

قائمة التصفّح الرئيسية

قائمة التصفّح الرئيسية

أكمل قراءة بقية الموضوع »