পরীক্ষা করুন যে সমস্ত কাস্টম নিয়ন্ত্রণের একটি উপযুক্ত role রয়েছে এবং যেকোন প্রয়োজনীয় ARIA বৈশিষ্ট্য রয়েছে যা তাদের বৈশিষ্ট্য এবং অবস্থা প্রদান করে। উদাহরণ স্বরূপ, একটি কাস্টম চেকবক্সের প্রয়োজন একটি role="checkbox" এবং aria-checked="true|false" এর অবস্থা সঠিকভাবে জানাতে।
কাস্টম কন্ট্রোলের জন্য কখন অনুপস্থিত শব্দার্থবিদ্যা প্রদান করা সর্বোত্তম তা বোঝার জন্য কীভাবে ARIA এবং HTML ব্যবহার করবেন তা শিখুন।
কিভাবে পরীক্ষা করা যায়
সমস্ত কাস্টম ইন্টারেক্টিভ কন্ট্রোলে উপযুক্ত ARIA ভূমিকা আছে কিনা তা পরীক্ষা করতে, Chrome DevTools অ্যাক্সেসিবিলিটি ফলক বা একটি স্ক্রিন রিডার ব্যবহার করে পৃষ্ঠাটি পরীক্ষা করুন৷
JAWS এবং NVDA হল Windows এর জন্য দুটি জনপ্রিয় স্ক্রিন রিডার। ভয়েসওভার হল ম্যাকওএস-এ তৈরি স্ক্রিন রিডার।
CSS-এর সাহায্যে, আপনি একটি <div> এবং <button> উপাদানগুলিকে একই ভিজ্যুয়াল সুবিধাগুলি বোঝাতে স্টাইল করতে পারেন, তবে স্ক্রিন রিডার ব্যবহার করার সময় অভিজ্ঞতাটি খুব আলাদা। একটি <div> শুধুমাত্র একটি সাধারণ গ্রুপিং উপাদান, তাই একজন স্ক্রিন রিডার শুধুমাত্র <div> এর পাঠ্য বিষয়বস্তু ঘোষণা করে। <button> একটি "বোতাম" হিসাবে ঘোষণা করা হয়, এটি ব্যবহারকারীর কাছে একটি শক্তিশালী সংকেত যে এটি এমন কিছু যা তারা যোগাযোগ করতে পারে।
এছাড়াও শব্দার্থবিদ্যা এবং স্ক্রিন রিডার দেখুন।
কিভাবে ঠিক করবেন
এই সমস্যার সর্বোত্তম সমাধান হল কাস্টম ইন্টারেক্টিভ নিয়ন্ত্রণগুলি সম্পূর্ণভাবে এড়ানো। উদাহরণস্বরূপ, একটি <div> প্রতিস্থাপন করুন যা একটি বোতামের মতো কাজ করে একটি প্রকৃত <button> দিয়ে।
<button>Learn more</button>
আপনি যদি অবশ্যই একটি <div> ব্যবহার করেন, role="button" এবং aria-pressed="false" যোগ করুন।
<div role="button" aria-pressed="false">Learn more</div>
এখন স্ক্রীন রিডাররা <div> এর ভূমিকা এবং ইন্টারেক্টিভ অবস্থা ঘোষণা করে।
কেন এই ব্যাপার
আপনি আগে সহায়ক প্রযুক্তি ব্যবহার না করে থাকলে, সহায়ক প্রযুক্তি ব্যবহারকারীদের জন্য আপনার বিষয়বস্তু কীভাবে পারফর্ম করে তা হয়তো আপনি জানেন না। আদর্শভাবে, আপনি এমন ব্যবহারকারীদের সাথে কথা বলতে পারেন যারা নিয়মিত সহায়ক প্রযুক্তি ব্যবহার করেন এবং আপনার ওয়েবসাইট বা ওয়েব অ্যাপ্লিকেশন কীভাবে কার্য সম্পাদন করে সে সম্পর্কে প্রতিক্রিয়া শেয়ার করতে পারেন।
সহায়ক প্রযুক্তি ব্যবহারকারীরা আপনার বিষয়বস্তু কীভাবে অনুভব করেন তা বোঝার আরেকটি উপায় হল সহায়ক প্রযুক্তির মাধ্যমে পরীক্ষা করা । একটি স্ক্রিন রিডার ব্যবহার করা আপনাকে আপনার বিষয়বস্তু কীভাবে লেবেল করা হয়েছে এবং নেভিগেশনে কোনো বাধা আছে কি না সে সম্পর্কে আপনাকে আরও স্পষ্ট বোঝা দিতে সাহায্য করে।
সম্পদ
আপনি কাস্টম কন্ট্রোলের ARIA ভূমিকা নিরীক্ষার জন্য সোর্স কোড দেখতে পারেন