جرب أدوات تحسين محركات البحث

مدقق التباين

مدقق تباين ألوان WCAG لحساب نسبة تباين النص.

نسبة التباين 21:1

نص عادي

WCAG AA: Pass

WCAG AAA: Pass

مثال للنص العادي - 16px

نص كبير

WCAG AA: Pass

WCAG AAA: Pass

مثال على نص كبير 18 نقطة/24 بكسل

الكائنات الرسومية ومكونات واجهة المستخدم

WCAG AA: Pass

احسب نسبة التباين لحجم النص العادي.
احسب نسبة التباين لحجم النص الكبير.
احسب نسبة التباين لمكونات واجهة المستخدم.
حدد اللون من منتقي الألوان
قم بإعداد إضاءة الألوان

كيفية استخدام مدقق التباين

اختر لون الخلفية
اختر لون الواجهة
اضبط الإضاءة إذا لزم الأمر
تحقق من التدقيق للنص العادي والكبير

التعليمات

كيف يعمل مدقق التباين؟

تحتاج إلى تقييم لون النص والخلفية. وفقًا لإرشادات WCAG 2.1، هذه هي: نص كبير - يتطلب النص الذي لا يقل حجمه عن 18 بكسل نسبة تباين تبلغ 3:1؛ نص صغير - يتطلب النص الذي يقل حجمه عن 18 بكسل نسبة تباين 4. 5:1.

لماذا يجب أن يحتوي موقع الويب الخاص بي على تباين ألوان كافٍ؟

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

ماذا تعني إمكانية الوصول إلى موقع الويب؟

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

هل يجب أن تتوافق الصور ومقاطع الفيديو مع متطلبات تباين ألوان WCAG؟

تتطلب بعض الرسومات ومكونات الواجهة نسبة تباين لا تقل عن 3:1. ومع ذلك، لا يشمل ذلك الشعارات أو الصور الزخرفية أو ملفات الوسائط العامة.

المنتجات

المواقع الإلكترونية

حول

language

مدقق التباين

مدقق تباين ألوان WCAG لحساب نسبة تباين النص.

نص عادي

نص كبير

الكائنات الرسومية ومكونات واجهة المستخدم

كيفية استخدام مدقق التباين

التعليمات

كيف يعمل مدقق التباين؟

لماذا يجب أن يحتوي موقع الويب الخاص بي على تباين ألوان كافٍ؟

ماذا تعني إمكانية الوصول إلى موقع الويب؟

هل يجب أن تتوافق الصور ومقاطع الفيديو مع متطلبات تباين ألوان WCAG؟