تحقيق مستوى AA: عتبات النص والنص الكبير

تلتزم معظم الفرق بالمستوى Level AA من WCAG فيما يتعلق بالتباين. فهو صارم بما يكفي لمساعدة المستخدمين الفعليين، وواقعي بما يكفي لإطلاق المنتجات.

بالنسبة إلى النص الأساسي، تتطلب AA نسبة 4.5:1 على الأقل. ويشمل ذلك الفقرات والتسميات ومعظم الكلمات في صفحتكم.

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

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

يؤثر الوزن: يُعد النص العريض كبيرًا عند حجم أصغر هو 18.66px، لأن الخطوط الأسمك يسهل على العين التقاطها.

تعرّف WCAG النص الكبير بأنه 18pt أو 14pt بالخط العريض، وهما ما يعادل 24px و18.66px في CSS. وتتولى الأدوات عادةً عملية التحويل نيابةً عنكم.

يجب أن تحقق الأزرار وحقول الإدخال ومؤشرات التركيز نسبة 3:1 مقابل محيطها وفق المعيار 1.4.11، حتى تظل عناصر التحكم ظاهرة.

هل تريدون ضمانات أقوى؟ يرفع AAA النص العادي إلى 7:1 والنص الكبير إلى 4.5:1، لكن معظم المنتجات تستهدف AA كخط أساس.

تتجاوز بعض العناصر القاعدة: فعناصر التحكم المعطلة والزخارف الخالصة وشعارات العلامات التجارية لا تخضع لحد أدنى للتباين.

إن placeholder الرمادي الباهت نص حقيقي، ولذلك يجب أن يحقق نسبة 4.5:1 أيضًا. تفشل معظم الإعدادات الافتراضية، لذا اجعلوها أغمق عمدًا.

يحقق هذا العنوان حجم النص الكبير، لذلك تكفيه نسبة 3:1 لاجتياز AA.

تذكروا الزوج التالي: 4.5:1 للنص العادي، و3:1 للنص الكبير أو أجزاء واجهة المستخدم. أتقنوا هذين الرقمين، وسيمر التباين لديكم باختبار AA. التالي: عدم الاعتماد على اللون وحده. 🎯