মডিউল ২: মেনু

মডিউল শেখার মাধ্যমে শিক্ষার্থীরা সক্ষম হবে:

  • প্রতিবন্ধী ব্যক্তিরা মেনু ব্যবহারের যে কৌশলগুলি ব্যবহার করে তা ব্যাখ্যা করা
  • একটি পৃষ্ঠায় দেওয়া মেনু সনাক্ত করতে মার্কআপ এবং লেবেল (labels) লিখা
  • lists, sub-lists, এবং list items হিসাবে মেনু কাঠামোর জন্য মার্কআপ লিখা যাতে তাদের যৌক্তিক এবং শাব্দিক অর্থ থাকে
  • মেনু প্রদর্শিত হওয়ার জন্য এবং প্রয়োজন অনুসারে মেনু আচরণ করার জন্য স্টাইাল লিখা, উদাহরণস্বরূপ হোভার (hover) এবং ফোকাস (focus)
  • বিভিন্ন ভিউপোর্ট আকারের উপর নির্ভর করে আকার পরিবর্তন করার জন্য মেনুগুলির জন্য কোড লিখা
  • বিভিন্ন সহায়ক প্রযুক্তি ব্যবহার করে ফ্লাই-আউট মেনুর অবস্থা জানাতে কোড লিখা
  • ইন্টারেক্টিভ মেনুগুলির উপযুক্ত কীবোর্ড অপারেশনের জন্য কোড লিখা
  • অ্যাপ্লিকেশন মেনুর জন্য অতিরিক্ত মার্কআপ এবং কার্যকারিতার জন্য কোড লিখা
  • মেনুগুলির অ্যাক্সেসযোগ্য আচরণ নিশ্চিত করতে ডিজাইনারদের জন্য সম্পর্কিত প্রয়োজনীয়তাগুলি বর্ণনা করা

বিষয়: মেনু স্ট্রাকচার

  • কিভাবে সহায়ক প্রযুক্তি কাঠামোগত HTML এলিমেন্টগুলো প্রক্রিয়া করে, যেমন lists, sub-lists, and list items তা ব্যাখ্যা করা। প্রতিবন্ধী ব্যক্তিদের কিভাবে এই কাঠামোগুলি সাহায্য করে এবং তাদের একে অপরের সাথে সম্পর্ক তা তা ব্যাখ্যা করা
  • বিভিন্ন ধরনের মেনু যেমন vertical, horizontal, breadcrumb trails, এবং application menus বর্ণনা করা
  • কিভাবে মেনুতে HTML এলিমেন্ট nav এবং headings ব্যবহার করে তা সনাক্ত করা
  • তালিকা, উপ-তালিকা হিসাবে মেনুগুলির মার্কআপ লিখা, উদাহরণস্বরূপ HTML এলিমেন্ট ul, ol এবং li ব্যবহার করা
  • শুধুমাত্র কীবোর্ড, ভয়েস ইন্টারঅ্যাকশন এবং অন্যান্য ইনপুট ডিভাইস ব্যবহার করে মেনু কার্যকারিতা পরিচালনার জন্য কোড লিখা
  • মেনুর ফাংশন এবং উদ্দেশ্য অনুযায়ী প্রত্যাশিত জায়গায় মেনু প্রদর্শনের জন্য কোড লিখা

বিষয়: মেনু স্টাইলিং

  • ব্যাখ্যা করা যে কীভাবে উপযুক্ত CSS স্টাইল মেনুগুলিকে সনাক্ত করে এবং বোঝা সহজ করে তোলে এবং প্রতিবন্ধী ব্যক্তিদের জন্য অভিযোজিত কৌশল যেমন টেক্সট এর বা ফন্টের আকার পরিবর্তন এবং কাস্টমাইজেশন, স্ক্রীন ম্যাগনিফিকেশন এবং টাচ স্ক্রিন ব্যবহার করে আরও ব্যবহারযোগ্য করে তোলে।
  • প্রয়োজন অনুসারে মেনু প্রদর্শন করতে ষ্টাইল ব্যবহার করা, উদাহরণস্বরূপ উল্লম্ব, অনুভূমিক এবং ব্রেডক্রাম্ব ট্রেইল
  • WAI-ARIA প্রপার্টি aria-current="page" ব্যবহার করে বর্তমান মেনু আইটেমের অবস্থা জানাতে কোড লিখা
  • মেনু আইটেমের অন্যান্য অবস্থা জানাতে উপযুক্ত শব্দার্থ ব্যবহারের পাশাপাশি রঙ, আকৃতি এবং স্টাইল ব্যবহার করে কোড লিখা
  • যথাযথ মেনু টেক্সট এবং স্টাইল প্রদানের জন্য ডেভেলপার এবং ডিজাইনারদের জন্য সম্পর্কিত প্রয়োজনীয়তা বর্ণনা করা

বিষয়: ফ্লাই-আউট মেনু

  • Nested lists এবং list items ব্যবহার করে একটি menu item এবং এর submenus এর মধ্যে শ্রেণিবদ্ধ সম্পর্ক বোঝাতে মার্কআপ লিখা
  • WAI-ARIA অ্যাট্রিবিউট aria-haspopup ব্যবহার করে সাবমেনু আইটেম ধারণকারী আইটেমগুলির জন্য মার্কআপ লিখা
  • ফ্লাই-আউট মেনুগুলির জন্য কোড লিখা যা শুধুমাত্র কীবোর্ড এবং ভয়েস ইন্টারঅ্যাকশন সহ বিভিন্ন ইনপুট ডিভাইস সমর্থন করে
  • WAI-ARIA অ্যাট্রিবিউট aria-expanded ব্যবহার করে মেনু আইটেমগুলির দৃশ্যমান এবং লুকানো অবস্থা জানাতে কোড লিখা এবং সেই অনুযায়ী সম্পর্কিত লেবেল আপডেট করা
  • ফ্লাই-আউট মেনুগুলি বিভিন্ন পরিস্থিতিতে কার্যকরভাবে ব্যবহার করা যায় তা নিশ্চিত করার জন্য ডিজাইনারদের জন্য সম্পর্কিত প্রয়োজনীয়তা বর্ণনা করুন, যেমন স্ক্রীন ম্যাগনিফিকেশন এবং ভয়েস ইন্টারঅ্যাকশন ব্যবহার করা

>> মডিউল ৩: ছবি