in English

رسائی

بوٹسٹریپ کی خصوصیات اور قابل رسائی مواد کی تخلیق کے لیے حدود کا ایک مختصر جائزہ۔

بوٹسٹریپ ریڈی میڈ اسٹائلز، لے آؤٹ ٹولز، اور انٹرایکٹو اجزاء کا استعمال میں آسان فریم ورک فراہم کرتا ہے، جس سے ڈویلپرز کو ایسی ویب سائٹس اور ایپلیکیشنز بنانے کی اجازت ملتی ہے جو بصری طور پر دلکش، فعال طور پر بھرپور، اور باکس سے باہر قابل رسائی ہوں۔

جائزہ اور حدود

بوٹسٹریپ کے ساتھ بنائے گئے کسی بھی پروجیکٹ کی مجموعی رسائی کا انحصار مصنف کے مارک اپ، اضافی اسٹائل اور اسکرپٹنگ پر ہوتا ہے جسے انہوں نے شامل کیا ہے۔ تاہم، بشرطیکہ ان کو صحیح طریقے سے لاگو کیا گیا ہو، بوٹسٹریپ کے ساتھ ایسی ویب سائٹس اور ایپلیکیشنز بنانا بالکل ممکن ہونا چاہیے جو WCAG 2.1 (A/AA/AAA)، سیکشن 508 اور اسی طرح کے قابل رسائی معیارات اور تقاضوں کو پورا کرتی ہوں۔

ساختی مارک اپ

بوٹسٹریپ کی اسٹائلنگ اور ترتیب کو مارک اپ ڈھانچے کی وسیع رینج پر لاگو کیا جا سکتا ہے۔ اس دستاویز کا مقصد ڈویلپرز کو بوٹسٹریپ کے استعمال کو ظاہر کرنے کے لیے بہترین پریکٹس کی مثالیں فراہم کرنا ہے اور مناسب سیمنٹک مارک اپ کی وضاحت کرنا ہے، بشمول وہ طریقے جن سے ممکنہ رسائی کے خدشات کو دور کیا جا سکتا ہے۔

انٹرایکٹو اجزاء

بوٹسٹریپ کے انٹرایکٹو اجزاء جیسے کہ موڈل ڈائیلاگ، ڈراپ ڈاؤن مینو اور حسب ضرورت ٹول ٹپس — کو ٹچ، ماؤس اور کی بورڈ استعمال کرنے والوں کے لیے کام کرنے کے لیے ڈیزائن کیا گیا ہے۔ متعلقہ WAI - ARIA کرداروں اور صفات کے استعمال کے ذریعے، یہ اجزاء معاون ٹیکنالوجیز (جیسے اسکرین ریڈرز) کا استعمال کرتے ہوئے قابل فہم اور قابل عمل ہونے چاہئیں۔

چونکہ بوٹسٹریپ کے اجزاء جان بوجھ کر کافی عام ہونے کے لیے ڈیزائن کیے گئے ہیں، اس لیے مصنفین کو مزید ARIA کردار اور صفات کے ساتھ ساتھ JavaScript کے رویے کو بھی شامل کرنے کی ضرورت پڑ سکتی ہے تاکہ ان کے جزو کی درست نوعیت اور فعالیت کو زیادہ درست طریقے سے بیان کیا جا سکے۔ یہ عام طور پر دستاویزات میں نوٹ کیا جاتا ہے۔

رنگ کے برعکس

رنگوں کے کچھ مجموعے جو فی الحال بوٹسٹریپ کے ڈیفالٹ پیلیٹ کو بناتے ہیں — بٹن کی مختلف حالتوں، الرٹ کی مختلف حالتوں، فارم کی توثیق کے اشارے جیسی چیزوں کے لیے پورے فریم ورک میں استعمال کیا جاتا ہے— ناکافی رنگ کے تضاد کا باعث بن سکتا ہے (4.5:1 کے تجویز کردہ WCAG 2.1 ٹیکسٹ کلر کنٹراسٹ تناسب کے نیچے اور WCAG 2.1 نان ٹیکسٹ کلر کنٹراسٹ تناسب 3:1 )، خاص طور پر جب ہلکے پس منظر کے خلاف استعمال کیا جائے۔ مصنفین کی حوصلہ افزائی کی جاتی ہے کہ وہ رنگ کے اپنے مخصوص استعمال کی جانچ کریں اور جہاں ضروری ہو، دستی طور پر ان ڈیفالٹ رنگوں میں ترمیم/توسیع کریں تاکہ مناسب رنگ کے تضاد کے تناسب کو یقینی بنایا جا سکے۔

بصری طور پر پوشیدہ مواد

وہ مواد جو بصری طور پر پوشیدہ ہونا چاہیے، لیکن اسکرین ریڈرز جیسی معاون ٹیکنالوجیز کے لیے قابل رسائی رہنا چاہیے، .sr-onlyکلاس کا استعمال کرتے ہوئے اسٹائل کیا جا سکتا ہے۔ یہ ان حالات میں کارآمد ہو سکتا ہے جہاں اضافی بصری معلومات یا اشارے (جیسے کہ رنگ کے استعمال سے ظاہر ہونے والے معنی) کو بھی غیر بصری صارفین تک پہنچانے کی ضرورت ہوتی ہے۔

<p class="text-danger">
  <span class="sr-only">Danger: </span>
  This action is not reversible
</p>

بصری طور پر پوشیدہ انٹرایکٹو کنٹرولز کے لیے، جیسے روایتی "اسکپ" لنکس کو کلاس .sr-onlyکے ساتھ ملایا جا سکتا ہے ۔ .sr-only-focusableیہ اس بات کو یقینی بنائے گا کہ ایک بار توجہ مرکوز کرنے کے بعد کنٹرول نظر آتا ہے (دیکھنے والے کی بورڈ صارفین کے لیے)۔

<a class="sr-only sr-only-focusable" href="#content">Skip to main content</a>

کم حرکت

بوٹسٹریپ میں prefers-reduced-motionمیڈیا فیچر کے لیے سپورٹ شامل ہے ۔ براؤزرز/ماحول میں جو صارف کو کم حرکت کے لیے اپنی ترجیح بتانے کی اجازت دیتے ہیں، بوٹسٹریپ میں زیادہ تر CSS منتقلی کے اثرات (مثال کے طور پر، جب کوئی موڈل ڈائیلاگ کھلا یا بند ہو، یا carousels میں سلائیڈنگ اینیمیشن) غیر فعال ہو جائیں گے، اور معنی خیز اینیمیشنز ( جیسے اسپنرز) کی رفتار کم ہو جائے گی۔

اضافی وسائل