WCAG رنگ کنٹراسٹ چیکر

استعمال کا طریقہ 3 مراحل
  1. عبارت کا رنگ چنیں۔
  2. پس منظر کا رنگ چنیں۔
  3. کنٹراسٹ کا تناسب اور WCAG AA اور AAA کے نتائج پڑھیں؛ مطلوبہ سطح پاس ہونے تک رنگ بدلیں۔
نمونہ پیش منظر عبارت (WCAG جانچ)
WCAG 2.1 آڈٹ کے نتائج
ٹول لوڈ ہو رہا ہے… 3 میں سے 0 حصے

ٹول تیار کیا جا رہا ہے۔ سست کنکشن پر اس میں چند سیکنڈ لگ سکتے ہیں۔

یہ ٹول کیسے کام کرتا ہے

یہ تناسب اسی طرح نکالا جاتا ہے جیسے رسائی کی ہدایات اسے متعین کرتی ہیں: ہر رنگ کو نسبتی روشنی میں بدلا جاتا ہے، جہاں تینوں چینلوں کو اس حساب سے وزن دیا جاتا ہے کہ آنکھ انہیں کتنا روشن دیکھتی ہے — سبز کا وزن نیلے سے کہیں زیادہ ہے — اور پھر دونوں روشنیوں کا 1 اور 21 کے درمیان تناسب نکالا جاتا ہے۔ ایک جیسے رنگ 1:1 دیتے ہیں؛ سفید پر سیاہ 21:1 دیتا ہے۔ یہ روشنی کے فرق کی پیمائش ہے، رنگ کے فرق کی نہیں، اور یہی وجہ ہے کہ دو رنگ خاصے الگ دکھنے کے باوجود ناکام ہو سکتے ہیں۔

دو حدیں بتائی جاتی ہیں: 4.5:1، جو عام متن کے لیے AA کی کم سے کم حد ہے، اور 7:1، جو بہتر AAA درجہ ہے۔ یہ اعداد عام سائز کے متن کے لیے ہیں، اور اکثر یہی سب سے زیادہ اہمیت رکھتے ہیں، کیونکہ پڑھنے میں آسانی کا فیصلہ متنِ اصل ہی پر ہوتا ہے۔

نتیجہ درست انداز میں پڑھنا

  • دکھائی گئی حدیں عام سائز کے متن کے لیے ہیں: بڑا متن — تقریباً 24px، یا موٹا ہو تو 19px — AA کے لیے 3:1 اور AAA کے لیے 4.5:1 پر پرکھا جاتا ہے۔ جو سرخی یہاں ناکام ہو، وہ اپنے اصل سائز پر کامیاب ہو سکتی ہے۔
  • انٹرفیس کے عناصر کی اپنی کم سے کم حد ہے: بٹن، کنارے، فوکس کے حلقے اور معنی رکھنے والے آئیکن اپنے گرد و پیش کے مقابلے میں 3:1 چاہتے ہیں۔ یہ متن سے کم درجہ ہے، مگر صفر نہیں۔
  • یہ تناسب رنگت کو سرے سے نظر انداز کرتا ہے: ملتی جلتی روشنی والے دو رنگ ناکام ہوتے ہیں چاہے وہ کتنے ہی مختلف دکھیں، اور بات یہی ہے — یہ ان قارئین کا نمونہ ہے جو ان رنگتوں میں فرق نہیں کر پاتے۔
  • انہی رنگوں کو جانچیں جو آپ واقعی استعمال کریں گے: کسی گریڈینٹ، تصویر یا نیم شفاف تہہ پر لکھے متن کا کوئی ایک پس منظر رنگ نہیں ہوتا۔ اوسط کے بجائے سب سے خراب مقام کا نمونہ لیں۔

اکثر پوچھے گئے سوالات

خاص طور پر WCAG رنگ کنٹراسٹ چیکر کے بارے میں۔ اس زمرے سے متعلق عمومی سوالات کے جواب زمرے کے صفحے پر موجود ہیں۔

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

نئے ٹولز، خصوصیات اور کارکردگی بڑھانے کے مشوروں کی اطلاع پانے کے لیے سبسکرائب کریں۔