كيف تجعل المخططات مقروءة لمصابي عمى الألوان

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

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

القاعدة الجوهرية: لا يمكن أن يكون اللون الإشارة الوحيدة

يشترط معيار النجاح 1.4.1 في WCAG ألا يكون اللون الوسيلة البصرية الوحيدة لنقل المعلومة أو للدلالة على إجراء أو لطلب استجابة أو لتمييز عنصر بصري. وفي رسوم البيانات يعني ذلك أن يظل بمقدور القارئ تمييز الفئات أو السلاسل أو الحالات أو المعنى من دون التعرّف على درجة لونية.

ومن البدائل الجيدة:

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

ويعتمد أفضل مزيج على نوع المخطط وعلى ما إذا كان القارئ يحتاج إلى لمحة سريعة أم إلى قيم دقيقة.

ابنِ المخطط حول السؤال

قبل اختيار الألوان، اكتب جملة واحدة تحدّد الرسالة الأساسية للمخطط. مثلًا: «نمت المبيعات في كل المناطق، وكان أقوى نمو في الغرب». ثم تحقّق مما إذا كان بإمكان القارئ الإجابة عن ذلك السؤال لو رأى المخطط بتدرّجات الرمادي.

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

قدّم التسميات المباشرة على المفتاح البعيد

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

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

طابِق الإشارات المتعدّدة مع نوع المخطط

المخططات الخطية

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

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

المخططات العمودية

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

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

مخططات الانتشار والفقاعات

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

الخرائط والخرائط الحرارية

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

صمّم من أجل التباين لا من أجل اختلاف الدرجات فحسب

قد تختلف الألوان في الدرجة وتتقارب في الإضاءة، فتندمج في تدرّجات الرمادي أو تحت اختلاف في رؤية الألوان. والتباين مهم بوجه خاص للخطوط الرفيعة والعلامات الصغيرة وحدود المخطط والنص.

وبالنسبة إلى الكائنات الرسومية غير النصية اللازمة لفهم المخطط، تستخدم إرشادات WCAG للتباين غير النصي عتبة 3:1 عمومًا مقابل الألوان المجاورة. ويظل السياق مهمًا، وقد تنقل التسمية أو الجدول المكافئ المعلومة من دون أن يضطر القارئ إلى تمييز الرسم بمفرده. فتعامل مع فحص التباين كجزء من مراجعة التصميم، لا كبديل عن التسميات والإشارات المتعدّدة.

استخدم فاحص التباين لاستكشاف التباين بين المقدمة والخلفية لنص الواجهة والعناصر البصرية البسيطة. ثم افحص المخطط كاملًا: فالتخطيطات الحقيقية تُدخِل تجاورًا وخطوطًا رفيعة وحالات تمرير وطبقات لا يلتقطها فحص زوج لوني واحد.

أعطِ القرّاء البيانات وراء الصورة

المخططات ملخّصات لا بدائل عن الوصول إلى البيانات. وحين يحمل مخطط قرارًا أو ادعاءً مهمًا، أدرِج واحدًا أو أكثر مما يلي:

• جدولًا قريبًا يضم الفئات والقيم
• ملخّصًا مكتوبًا موجزًا للاستنتاج الأساسي
• تنزيلًا ميسّر الوصول، مثل ملف CSV
• وصفًا مطوّلًا للعلاقات البصرية المعقّدة
• تلميحات يمكن الوصول إليها بلوحة المفاتيح أو عرضًا للبيانات قابلًا للتركيز في المخططات التفاعلية

وهذا يحسّن سهولة الاستخدام لمستخدمي قارئات الشاشة ولمن لا يميّزون كل ترميز بصري. كما يتيح للقارئ التحقّق من الرسالة من دون تقدير ارتفاعات الأعمدة أو قطاعات الدائرة.

قائمة مراجعة عملية للمخططات

استخدمها قبل نشر تقرير أو عرض تقديمي أو لوحة معلومات أو مقال:

• هل يوضّح العنوان موضوع المخطط والفترة الزمنية؟
• هل يمكن تمييز كل سلسلة أو فئة من دون الاعتماد على اللون وحده؟
• هل القيم الجوهرية مسمّاة أو متاحة في جدول أو موصوفة في نص قريب؟
• هل تتمتّع الخطوط والعلامات والأعمدة وعناصر المفتاح بتباين كافٍ حيث تتلامس أو تتداخل؟
• هل التسميات مقروءة عند التكبير الاعتيادي وعلى شاشة صغيرة؟
• هل يتجنّب المخطط تسميات الحالة الحمراء/الخضراء الملتبسة مثل «جيد» و«سيئ» من دون نص أو أيقونة؟
• هل يستطيع مستخدم لوحة المفاتيح الوصول إلى معلومات المخطط التفاعلي؟
• هل تكشف مراجعة بتدرّجات الرمادي أو بمحاكاة رؤية الألوان عناصر ملتبسة؟

اختبر بمحتوى حقيقي ومع أشخاص حقيقيين

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

ويمكن لـمحاكي رؤية الألوان لدينا أن يساعد المصمّمين على استكشاف كيف قد تبدو صورة تحت عدد من اختلافات رؤية الألوان الشائعة. وتعامل معه كخطوة مراجعة إضافية لا كبديل عن أبحاث المستخدمين أو تقييم WCAG.

وللاطلاع على إرشادات أوسع للواجهات، راجع التصميم لمصابي عمى الألوان.

مثال: تحسين مخطط حالة

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

1. تضيف كلمة الحالة إلى كل عمود: «ضمن الهدف» أو «معرّض للخطر» أو «متأخّر».
2. تستخدم أيقونة في التسمية، مثل علامة صح أو مثلث تحذير أو سهم، مع نص يشرحها.
3. تستخدم أنماطًا أو حدودًا كإشارة بصرية ثانية.
4. تعرض النسبة الفعلية والقيمة المستهدفة.
5. توفّر جدولًا أسفل المخطط يضم القسم والقيمة الحالية والهدف والحالة.

ويظل اللون يسرّع قراءة النمط لكثير من المستخدمين. غير أنه لم يعد الطريق الوحيد إلى الفهم.

الخلاصة

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