WCAG کنٹراسٹ چیکر — AA/AAA آن لائن _

WCAG کنٹراسٹ چیک چند سیدھے مراحل سے گزرتا ہے۔ کچھ بھی آپ کے براؤزر سے باہر نہیں جاتا۔

1. آپ پیش منظر اور پس منظر کا رنگ درج کرتے ہیں۔ ٹول hex، rgb()، hsl()، یا نامی CSS رنگوں کو ان کے سرخ، سبز اور نیلے چینل ویلیوز میں پارس کرتا ہے۔
2. ہر RGB چینل کو sRGB ٹرانسفر فنکشن کا استعمال کرتے ہوئے لینیئرائز کیا جاتا ہے۔ یہ گاما-انکوڈڈ ڈسپلے ویلیوز کو لینیئر روشنی کی شدت میں تبدیل کرتا ہے۔
3. لینیئر ویلیوز کو انسانی آنکھ کی ہر چینل کے لیے حساسیت کے مطابق وزن دیا جاتا ہے — 0.2126 سرخ کے لیے، 0.7152 سبز کے لیے، 0.0722 نیلے کے لیے۔ مجموعہ رنگ کی نسبتہ روشنی ہے۔
4. کنٹراسٹ تناسب (L1 + 0.05) ÷ (L2 + 0.05) ہے، جہاں L1 ہلکے رنگ کی روشنی ہے اور L2 گہرے رنگ کی روشنی ہے۔ اضافی 0.05 فارمولے کو خالص سیاہ کے لیے بھی درست رکھتا ہے۔
5. تناسب کا WCAG حدود سے موازنہ کیا جاتا ہے: AA عام متن کو کم از کم 4.5:1، AA بڑے متن کو 3:1، AAA عام متن کو 7:1، اور AAA بڑے متن کو 4.5:1 درکار ہے۔ بڑے متن کا مطلب کم از کم 18pt یا 14pt بولڈ ہے۔

FAQ

WCAG کنٹراسٹ چیکنگ کے بارے میں عام سوالات۔

AA اور AAA میں کیا فرق ہے؟

AA زیادہ تر ویب مواد کے لیے کم از کم مطابقت کی سطح ہے۔ اس کے لیے عام متن کے لیے کم از کم 4.5:1 اور بڑے متن کے لیے 3:1 کنٹراسٹ تناسب درکار ہے۔ AAA ایک اعلیٰ معیار ہے جس کے لیے عام متن کے لیے 7:1 اور بڑے متن کے لیے 4.5:1 درکار ہے۔ آپ AAA کو کلیدی مواد جیسے نیوز سائٹ پر باڈی کاپی کے لیے نشانہ بنا سکتے ہیں، جبکہ بقیہ ڈیزائن کے لیے AA استعمال کر سکتے ہیں۔ برانڈ رنگوں کے ساتھ ہر جگہ AAA پورا کرنا مشکل ہو سکتا ہے، لہٰذا بہت سی ٹیمیں پوری سائٹ پر AA کو نشانہ بناتی ہیں اور جہاں ممکن ہو کلیدی متن کو AAA تک بڑھا دیتی ہیں۔

WCAG کے تحت "بڑے متن" سے کیا مراد ہے؟

WCAG 2.x بڑے متن کی تعریف عام وزن کے لیے کم از کم 18 پوائنٹ (24px)، یا بولڈ وزن کے لیے 14 پوائنٹ (تقریباً 19px) کرتا ہے۔ وہ علامات اور آئیکن جو فونٹ فیس کا حصہ ہیں وہی حدود کی پیروی کرتے ہیں۔ اگر آپ کو یقین نہیں ہے کہ آپ کے UI پر کون سی حد لاگو ہوتی ہے، تو دونوں چیک کریں — AA Large کی حد کم (3:1) ہے، لہٰذا زیادہ تر رنگ جوڑے جو AA Normal میں فیل ہوتے ہیں حقیقتاً AA Large پاس کر لیتے ہیں جب متن کافی بڑا ہو۔

میرا رنگ جوڑا AA Large کیوں پاس کرتا ہے لیکن AA Normal میں فیل ہو جاتا ہے؟

کیونکہ AA Large کو صرف 3:1 تناسب درکار ہے جبکہ AA Normal کو 4.5:1 درکار ہے۔ WCAG بڑے متن کے لیے کم حد مقرر کرتا ہے کیونکہ بڑے حروف کم کنٹراسٹ کے باوجود پڑھنے میں آسان ہوتے ہیں۔ ایک رنگ جوڑا جو مثلاً 4.0:1 اسکور کرتا ہے وہ AA Large (3:1 حد) پاس کرتا ہے لیکن AA Normal (4.5:1 حد) میں فیل ہو جاتا ہے۔ سفید پس منظر پر پیش منظر کے طور پر استعمال ہونے والے ہلکے برانڈ رنگوں کے ساتھ یہ بہت عام ہے۔

کیا میں رسائی کی آڈٹنگ کے لیے صرف اس ٹول پر بھروسہ کر سکتا ہوں؟

یہ ٹول ایک چیز چیک کرتا ہے — دو ٹھوس رنگوں کے درمیان WCAG 2.x کنٹراسٹ تناسب۔ حقیقی رسائی میں مزید شامل ہے: فوکس انڈیکیٹرز، فونٹ سائز اور وزن، رنگ بطور معلومات پہنچانے کا واحد طریقہ، اور اسکرین ریڈرز اور زوم ٹولز کے ساتھ مطابقت۔ اس کنٹراسٹ چیک کو دیگر آڈٹ طریقوں کے ساتھ استعمال کریں تاکہ آپ کی ایپلیکیشن کی رسائی کی مکمل تصویر حاصل ہو۔

ان پٹ رنگ کی کون سی فارمیٹس قبول کرتا ہے؟

آپ 3، 4، 6، یا 8 ہندسوں والے hex کوڈز (# کے ساتھ یا بغیر)، rgb() اور rgba() ویلیوز قدیم کوما سنٹیکس یا جدید اسپیس سے الگ کردہ سنٹیکس میں، hsl() اور hsla() کسی بھی معیاری ہیو یونٹ (deg, rad, grad, turn) کے ساتھ، hsv()، hwb()، اور CSS Color Module Level 4 سپیک کے 150 نامی CSS رنگوں میں سے کوئی بھی پیسٹ کر سکتے ہیں۔ رنگ مکمل طور پر آپ کے آلے پر پارس کیا جاتا ہے۔