অ্যাক্সেসযোগ্যতা

অ্যাক্সেসযোগ্য বিষয়বস্তু তৈরির জন্য বুটস্ট্র্যাপের বৈশিষ্ট্য এবং সীমাবদ্ধতার একটি সংক্ষিপ্ত বিবরণ।

বুটস্ট্র্যাপ রেডিমেড স্টাইল, লেআউট টুলস এবং ইন্টারেক্টিভ উপাদানগুলির একটি সহজে ব্যবহারযোগ্য ফ্রেমওয়ার্ক প্রদান করে, যা ডেভেলপারদের এমন ওয়েবসাইট এবং অ্যাপ্লিকেশন তৈরি করতে দেয় যা দৃশ্যত আকর্ষণীয়, কার্যকরীভাবে সমৃদ্ধ এবং বাক্সের বাইরে অ্যাক্সেসযোগ্য।

ওভারভিউ এবং সীমাবদ্ধতা

বুটস্ট্র্যাপ দিয়ে তৈরি যেকোন প্রজেক্টের সামগ্রিক অ্যাক্সেসিবিলিটি নির্ভর করে লেখকের মার্কআপ, অতিরিক্ত স্টাইলিং এবং স্ক্রিপ্টিংয়ের উপর। যাইহোক, যদি এইগুলি সঠিকভাবে প্রয়োগ করা হয়েছে, তবে বুটস্ট্র্যাপের সাহায্যে ওয়েবসাইট এবং অ্যাপ্লিকেশন তৈরি করা সম্পূর্ণরূপে সম্ভব হওয়া উচিত যা WCAG 2.0 (A/AA/AAA), সেকশন 508 এবং অনুরূপ অ্যাক্সেসিবিলিটি মান এবং প্রয়োজনীয়তা পূরণ করে।

স্ট্রাকচারাল মার্কআপ

বুটস্ট্র্যাপের স্টাইলিং এবং লেআউট বিস্তৃত মার্কআপ স্ট্রাকচারে প্রয়োগ করা যেতে পারে। এই ডকুমেন্টেশনের লক্ষ্য হল ডেভেলপারদেরকে বুটস্ট্র্যাপের ব্যবহার প্রদর্শনের জন্য সর্বোত্তম অনুশীলনের উদাহরণ প্রদান করা এবং উপযুক্ত শব্দার্থিক মার্কআপ চিত্রিত করা, যেখানে সম্ভাব্য অ্যাক্সেসিবিলিটি উদ্বেগগুলি সমাধান করা যেতে পারে।

ইন্টারেক্টিভ উপাদান

বুটস্ট্র্যাপের ইন্টারেক্টিভ উপাদানগুলি—যেমন মোডাল ডায়ালগ, ড্রপডাউন মেনু এবং কাস্টম টুলটিপ—সচ, মাউস এবং কীবোর্ড ব্যবহারকারীদের জন্য কাজ করার জন্য ডিজাইন করা হয়েছে। প্রাসঙ্গিক WAI - ARIA ভূমিকা এবং গুণাবলী ব্যবহারের মাধ্যমে , এই উপাদানগুলিও সহায়ক প্রযুক্তি (যেমন স্ক্রিন রিডার) ব্যবহার করে বোধগম্য এবং কার্যকর হতে হবে।

যেহেতু বুটস্ট্র্যাপের উপাদানগুলি উদ্দেশ্যমূলকভাবে মোটামুটি জেনেরিক হওয়ার জন্য ডিজাইন করা হয়েছে, লেখকদের তাদের উপাদানের সুনির্দিষ্ট প্রকৃতি এবং কার্যকারিতা আরও সঠিকভাবে জানাতে আরও ARIA ভূমিকা এবং বৈশিষ্ট্যগুলির পাশাপাশি জাভাস্ক্রিপ্ট আচরণ অন্তর্ভুক্ত করতে হবে। এটি সাধারণত ডকুমেন্টেশনে উল্লেখ করা হয়।

রঙের বৈসাদৃশ্য

বেশিরভাগ রঙ যা বর্তমানে বুটস্ট্র্যাপের ডিফল্ট প্যালেট তৈরি করে — বোতামের বৈচিত্র্য, সতর্কতা বৈচিত্র্য, ফর্মের বৈধতা সূচকগুলির মতো জিনিসগুলির জন্য ফ্রেমওয়ার্ক জুড়ে ব্যবহৃত হয় — অপর্যাপ্ত রঙের বৈসাদৃশ্যের দিকে নিয়ে যায় (প্রস্তাবিত WCAG 2.0 রঙের বৈসাদৃশ্য অনুপাত 4.5: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 ট্রানজিশন ইফেক্ট (উদাহরণস্বরূপ, যখন একটি মোডাল ডায়ালগ খোলা বা বন্ধ করা হয়, বা ক্যারোসেলে স্লাইডিং অ্যানিমেশন) অক্ষম করা হবে।