Developer Toolsمدقق إمكانية الوصول لألوان واجهة المستخدم
تحقق من امتثال مجموعات ألوان واجهة المستخدم لمعايير إمكانية الوصول WCAG. تحقق من نسب التباين للامتثال AA و AAA في الوقت الفعلي.
مدقق مجموعة الألوان
معاينة
نص عادي (14px)
نص كبير (18px+)
مرجع إرشادات WCAG
معيار WCAG AA
- • النص العادي: الحد الأدنى لنسبة التباين 4.5:1
- • النص الكبير (18px+ أو 14px+ غامق): الحد الأدنى 3:1
- • مطلوب لمعظم الامتثال القانوني
- • يغطي معظم احتياجات إمكانية الوصول
WCAG AAA المحسّن
- • النص العادي: الحد الأدنى لنسبة التباين 7:1
- • النص الكبير: الحد الأدنى 4.5:1
- • أعلى معيار لإمكانية الوصول
- • موصى به للواجهات الحرجة
الأدوات ذات الصلة
حول هذه الأداة
كيف تعمل
- تحسب نسب التباين بين ألوان المقدمة والخلفية
- تُقيّم الامتثال مع إرشادات إمكانية الوصول WCAG 2.1
- تختبر متطلبات حجم النص العادي والكبير
- توفر معاينة بصرية في الوقت الفعلي لمجموعات الألوان
- تدعم رموز الألوان السداسية العشرية المكونة من 3 و6 أرقام
حالات الاستخدام الشائعة
- مصممو UI/UX لضمان أنظمة الألوان الشاملة
- المطورون للتحقق من خيارات ألوان الواجهة
- مراجعو إمكانية الوصول للتحقق من معايير الامتثال
- مصممو العلامات التجارية لإنشاء لوحات ألوان شاملة
- مصممو الويب للوفاء بمتطلبات إمكانية الوصول القانونية
الأسئلة الشائعة
ما هي إمكانية الوصول للألوان ولماذا هي مهمة؟
تضمن إمكانية الوصول للألوان أن مجموعات الألوان توفر تباينًا كافيًا للأشخاص ذوي الإعاقات البصرية، بما في ذلك عمى الألوان وضعف البصر. إنها ضرورية لجعل مواقع الويب والتطبيقات قابلة للاستخدام من قبل الجميع.
ما هي معايير WCAG AA وAAA؟
يتطلب WCAG AA نسبة تباين 4.5:1 للنص العادي و3:1 للنص الكبير. أما AAA فأكثر صرامة، ويتطلب 7:1 للنص العادي و4.5:1 للنص الكبير. يعد AA المعيار القانوني لمعظم متطلبات الامتثال.
كيف أعرف إذا كانت مجموعة الألوان الخاصة بي تجتاز معايير إمكانية الوصول؟
أدخل ألوان المقدمة (النص) والخلفية في الأداة. ستحسب نسبة التباين وتُظهر ما إذا كانت تستوفي معايير AA أو AAA للنص العادي والكبير.
ما الذي يُعدّ "نصًا كبيرًا" في إرشادات إمكانية الوصول؟
النص الكبير هو 18pt (24px) أو أكبر للنص العادي، أو 14pt (18.67px) أو أكبر للنص الغامق. هذه الأحجام لها متطلبات تباين أقل (3:1 لـ AA، 4.5:1 لـ AAA).
هل يمكنني اختبار مجموعات ألوان متعددة في آنٍ واحد؟
نعم! استخدم زر "إضافة إلى قائمة المقارنة" لحفظ مجموعات الألوان ومقارنة أزواج متعددة جنبًا إلى جنب. هذا مفيد عند تصميم أنظمة الألوان.
ما هي تنسيقات الألوان التي تدعمها الأداة؟
تدعم الأداة رموز الألوان السداسية العشرية بتنسيقات 6 أرقام (#000000) و3 أرقام (#000). يمكنك إدخال الألوان يدويًا أو استخدام منتقي الألوان للتحديد البصري.
لماذا بعض الألوان المختلفة بصريًا لها نفس نسبة التباين؟
تُحسب نسب التباين بناءً على السطوع وليس الصبغة. الألوان ذات السطوع المتساوي ستحصل على نسب تباين متطابقة.
ماذا أفعل إذا كانت ألوان علامتي التجارية لا تلبي معايير إمكانية الوصول؟
لديك عدة خيارات: ضبط درجة سطوع أحد الألوان، إضافة حدود أو مخطط للنص، استخدام الألوان للنص الكبير فقط، أو تخصيصها للعناصر الزخرفية.
هل تنطبق معايير إمكانية الوصول على جميع عناصر الموقع؟
تنطبق متطلبات التباين على النص وصور النص ومكونات واجهة المستخدم. لا تنطبق على العناصر الزخرفية أو الشعارات أو المكونات غير النشطة/المعطلة.
ما مدى دقة حسابات التباين؟
تستخدم الأداة الصيغة الرسمية لـ WCAG 2.1 لحساب السطوع النسبي ونسب التباين. الحسابات دقيقة رياضيًا.
هل يمكنني استخدام هذه الأداة لتصميم تطبيقات الهاتف المحمول؟
بالتأكيد! تنطبق إرشادات WCAG على التطبيقات المحمولة وكذلك مواقع الويب. تستشهد منصات الهاتف المحمول (iOS وAndroid) بمعايير WCAG في إرشاداتها.
ماذا أفعل إذا كنت بحاجة إلى اختبار ألوان غير رموز hex؟
تدعم الأداة حاليًا رموز الألوان السداسية العشرية. لتنسيقات RGB أو HSL أو غيرها، استخدم أداة Color Picker Converter لتحويل التنسيقات أولًا.