المكاسب:
- القدرة على التحكم وتحسين تباين الألوان والنص البديل والوصول إلى لوحة المفاتيح ومعايير WCAG مع دعم الذكاء الاصطناعي
- القدرة على إنشاء نصوص إمكانية الوصول والتحقق منها مثل تجربة قارئ الشاشة والنص البديل وتسميات النماذج باستخدام الذكاء الاصطناعي
- فهم الحد الأقصى للتحقق من صحة توصيات إمكانية الوصول الخاصة بالذكاء الاصطناعي باستخدام التكنولوجيا المساعدة الحقيقية واختبار المستخدم
إمكانية الوصول (a11y للاختصار) هي قدرة المنتج على استخدامه من قبل الجميع، بما في ذلك الأفراد ذوي الإعاقة: يمكن للمستخدم ضعيف البصر التنقل باستخدام قارئ الشاشة (برنامج مساعد يحول النص إلى كلام)، ويمكن للشخص الذي يعاني من صعوبات حركية القيام بأي شيء باستخدام لوحة المفاتيح، ويمكن للشخص المصاب بعمى الألوان تلقي المعلومات دون الاعتماد على اللون. التصميم الشامل أوسع نطاقًا: فهو يضع التنوع البشري في مركز التصميم، بما في ذلك العمر واللغة والثقافة والإعاقة المؤقتة (الذراع المكسورة) أو الإعاقة السياقية (الشاشة في الشمس). إن إمكانية الوصول ليست "إضافية" ولكنها مسؤولية أساسية ومتطلب قانوني في معظم البلدان. يعد الذكاء الاصطناعي بمثابة أداة فحص مسبق ومولد مسودة قوية في هذا المجال؛ ولكن إمكانية الوصول الحقيقية لا يتم تأكيدها إلا من خلال التكنولوجيا المساعدة الفعلية واختبار المستخدم.
WCAG ومناطق التحكم الرئيسية
WCAG (إرشادات إمكانية الوصول إلى محتوى الويب) هي مجموعة من المعايير المقبولة دوليًا لإمكانية الوصول؛ يتم استهداف مستوى AA بشكل عام. ولها أربعة مبادئ: يجب أن يكون المحتوى قابلاً للإدراك، ويجب أن تكون الواجهة قابلة للاستخدام، ويجب أن تكون المعلومات مفهومة وسليمة من الناحية الفنية. مجالات السيطرة الأكثر شيوعا في الممارسة العملية هي:
- تباين الألوان: هل الفرق بين النص والخلفية كافٍ؟ (بالنسبة إلى AA، نسبة 4.5:1 على الأقل في النص العادي.)
- نص بديل (نص بديل): هل تحتوي الصور على نص مكافئ يشرحها لقارئ الشاشة؟
- الوصول إلى لوحة المفاتيح: هل يمكن فعل أي شيء بدون استخدام الماوس؟ هل ترتيب التركيز منطقي؟
- معلومات اللون فقط: عبارات مثل "املأ الحقول الحمراء" تستبعد المستخدم المصاب بعمى الألوان.
- تسميات النماذج: هل يحتوي كل حقل إدخال على تسمية سيقرأها قارئ الشاشة؟
- هدف اللمس: هل الأزرار كبيرة بما يكفي للضغط عليها بشكل مريح بالأصابع؟
يستطيع الذكاء الاصطناعي إجراء فحص أولي سريع في العديد من هذه المجالات: يمكنك تقديم بعض النصوص والسؤال "هل التباين كافٍ؟"، وإعطاء وصف للصورة، واطلب "اقتراح نص بديل"، وإعطاء وصف للواجهة، والسؤال "ما هي مشكلات الوصول إلى لوحة المفاتيح".
تحذير: مجرد أن الذكاء الاصطناعي يقول "يبدو أنه يمكن الوصول إليه" لا يضمن إمكانية الوصول. يلتقط الفحص التلقائي بعض أخطاء WCAG فقط؛ وسيظهر الباقي مع الاستخدام الفعلي.
النص البديل: سر النص البديل الجيد
يستبدل النص البديل الصورة للمستخدم ضعاف البصر. ينقل النص البديل الجيد وظيفة الصورة ومعناها، وليس تفاصيلها الزخرفية. يجب أن يكون النص البديل لأيقونة "إضافة إلى سلة التسوق" هو "إضافة إلى سلة التسوق" وليس "صورة عربة التسوق" لأن الإجراء يهم المستخدم. الذكاء الاصطناعي جيد في إنشاء الخطوط العريضة للنص الفرعي، ولكن لأنه لا يعرف السياق، فقد ينتج نصًا وصفيًا بشكل مفرط أو غير ذي صلة. تسأل كل نص بديل "لماذا توجد هذه الصورة هنا؟" اقتصاص مع السؤال.
مرئية
نص فرعي ضعيف
نص فرعي قوي
رمز سلة التسوق (زر)
"رمز سلة التسوق، اللون الرمادي"
"أضف إلى السلة"
صورة المنتج
"صورة"
"معطف الشتاء الأزرق، منظر أمامي"
خط زخرفي
"خط الزينة"
(اتركها فارغة - ديكور)
الرسومات
"صورة بيانية"
"مبيعات 2024: زيادة كل ربع سنة"
اللغة والنطاق الشاملان
لا تقتصر إمكانية الوصول على الضوابط الفنية؛ اللغة شاملة أيضًا. النص الذي يفترض الجنس ("المستخدم وزوجته")، أو يستبعد على أساس القدرة ("النظرة"، أو "السمع بسهولة")، أو يحتوي على افتراضات ثقافية سوف يستبعد بعض المستخدمين. يستطيع الذكاء الاصطناعي مسح النص من هذا المنظور، لكن يجب عليك التأكد من أن اللغة "المحايدة" التي يقترحها تظل طبيعية ومفهومة؛ قد يؤدي التصحيح الزائد إلى جعل النص غريبًا.
ثلاث حالات صغيرة
الحالة 1 - تم اكتشاف أخطاء التباين مبكرًا. طلب فريق من الذكاء الاصطناعي مسح ألوان النص في 20 شاشة وقرر أن التباين كان أقل من عتبة AA في 7 أماكن. تم إجراء التصحيحات دون الخوض في التطوير؛ تم تجنب تكلفة التصحيح اللاحق. لكن الفريق لم يتخط بعد اختبار قارئ الشاشة الفعلي.
الحالة 2 - تم تصحيح المعلومات المتعلقة بالألوان فقط. أظهر أحد النماذج حقول خطأ ذات حدود حمراء فقط. لقد أشار الذكاء الاصطناعي إلى هذا؛ أضاف الفريق أيضًا نصًا وأيقونات لكل خطأ. يمكن الآن لمستخدمي Colorblind رؤية الخطأ. الدرس المستفاد: اللون وحده لا يمكنه نقل المعلومات.
الحالة 3 - الموافقة المضللة بواسطة الذكاء الاصطناعي. تخطى أحد المصممين اختبار قارئ الشاشة لأنه وصف الذكاء الاصطناعي بأنه "يمكن الوصول إليه". في الاختبار الحقيقي، اتضح أن ترتيب التركيز كان مشوشًا ولم تتم قراءة بعض الأزرار على الإطلاق. الدرس المستفاد: التأكيد التلقائي هو البداية؛ الاختبار الفعلي للتكنولوجيا المساعدة إلزامي.
مطالبات قابلة للنسخ
قم بإجراء مسح مسبق لوصف الواجهة هذا للتأكد من إمكانية الوصول: 1) هل هناك معلومات يتم نقلها بناءً على اللون فقط؟ 2) هل هناك تسمية نصية لكل عنصر قابل للنقر؟ 3) هل هناك أي عناصر لا يمكن الوصول إليها عبر لوحة المفاتيح؟ 4) هل ترتيب التركيز منطقي؟ قم بإدراج كل مشكلة واقتراح. أضف ملاحظة "مطلوب اختبار حقيقي". الوصفة: <<نص>>
اقتراح نص بديل لهذه الصور. القاعدة: نقل وظيفة/معنى الصورة، وليس التفاصيل الزخرفية. اكتب الإجراء لأيقونات الأزرار. بالنسبة للصور المزخرفة، قل "يجب ترك النص البديل فارغًا". السياق ووصف الصورة: <<قائمة>>
تحقق من هذه النصوص بحثًا عن لغة شاملة: هل هناك افتراضات تتعلق بالجنس، أو لغة إقصائية قائمة على القدرة (مثل "أرى"، "أسمع")، أو افتراضات ثقافية؟ اقتراح البدائل التي تظل طبيعية؛ لا تبالغ في التصحيح.النصوص: <<قائمة>>
اكتب خطأ يمكن الوصول إليه ونص تسمية لهذا النموذج: تسمية مرئية لكل حقل، ووصف لقارئ الشاشة، ورسالة تصف الخطأ، بغض النظر عن اللون (نص + رمز). الصوت والنبرة: <<بطاقة>>حقول النموذج: <<قائمة>>
موجه ضعيف / موجه قوي
ضعيف: "اكتب نصًا بديلًا لهذه الصورة."
النتيجة: "صورة" أو نص وصفي مفرط يفتقد الوظيفة.
Strong: "اقترح نصًا بديلًا لهذه الصور؛ وانقل وظيفة/معنى الصورة؛ واكتب الإجراء لأيقونات الأزرار؛ وضع علامة على الرموز المزخرفة كـ "يجب تركها فارغة"."
النتيجة: نصوص فرعية دقيقة وموجهة نحو الوظيفة.
الفرق: موجه قوي يجلب التركيز الوظيفي + اتفاقية الزر + التمييز الزخرفي.
الأخطاء الشائعة
- الخلط بين الموافقة على الذكاء الاصطناعي كضمان لإمكانية الوصول. إنه ليس بديلاً عن الاختبار الحقيقي.
- مجرد تحميل المعلومات إلى اللون. يفتقد مستخدمو Colorblind المعلومات.
- شرح الصورة وليس الوظيفة في النص البديل. يجب كتابة إجراء لرمز الزر.
- ترك إمكانية الوصول لآخر. إذا لم يتم البدء في مرحلة الإطار السلكي، فسيكون تصحيحه لاحقًا مكلفًا.
- لغة مبالغ فيها. إن اللغة الشاملة التي تفقد طبيعتها تعوق أيضًا إمكانية الفهم.
باختصار
تعني إمكانية الوصول أن المنتج متاح للجميع؛ إنها ليست إضافة، بل هي مسؤولية أساسية، وفي معظم الأماكن، مسؤولية قانونية. يعد الذكاء الاصطناعي ذا قيمة باعتباره اختبارًا مبدئيًا سريعًا ومولد مسودة للتباين والنص البديل والوصول إلى لوحة المفاتيح والمسح الشامل للغة. لكن الموافقة التلقائية تكتشف فقط بعض أخطاء WCAG؛ يتم تأكيد إمكانية الوصول الفعلية من خلال الاختبار باستخدام قارئات الشاشة ومستخدمي التكنولوجيا المساعدة الحقيقيين. استخدم النموذج كمتصفح أمامي، واحصل على الدليل من الاختبار الحقيقي.
مهمة التطبيق
- قم بإجراء مسح مسبق لوصف الواجهة لسهولة الوصول إليه عند المطالبة الأولى.
- قم بتصحيح المعلومات المستندة إلى الألوان أو العناصر غير المسماة فقط.
- أنشئ نصوصًا بديلة موجهة نحو الوظائف للمرئيات التي تظهر على شاشتك باستخدام المطالبة الثانية.
- تحقق من النصوص الخاصة بك بحثًا عن لغة شاملة مع المطالبة الثالثة.
- إذا كان ذلك ممكنًا، جرّب الاختبار الفعلي باستخدام قارئ الشاشة ولاحظ ما يفتقده الفحص التلقائي.
قائمة مرجعية
- [ ] قمت بإجراء مسح مسبق للتباين والوصول إلى لوحة المفاتيح والتسميات.
- [ ] لم أترك المعلومات بناءً على اللون فقط.
- [ ] كتبت النصوص الفرعية بطريقة وظيفية وتركت النصوص الزخرفية فارغة.
- [ ] لقد قمت بإجراء تحكم شامل في اللغة، وحافظت على طبيعتها.
- [ ] لم أعتبر الموافقة التلقائية ضمانًا لإمكانية الوصول.
- [ ] لقد خططت/نفذت اختبارًا فعليًا للتكنولوجيا المساعدة.