মডিউল ৪: টেবিল

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

  • প্রতিবন্ধী ব্যক্তিরা টেবিলে (table) উপস্থাপিত তথ্য বুঝতে এবং নেভিগেট করতে যে কৌশলগুলো ব্যবহার করে তা ব্যাখ্যা করা
  • যথোপযুক্ত HTML উপাদান ব্যবহার করে টেবিল, টেবিল শিরোনাম এবং ডেটা সেলগুলির (data cell) জন্য মার্কআপ লিখা এবং প্রয়োজনে WAI-ARIA বৈশিষ্ট্যগুলি ব্যবহার করা
  • জটিল এবং অনিয়মিত টেবিলের ডেটা সেলগুলোর সাথে টেবিল শিরোনাম (table headers) যুক্ত অতিরিক্ত কাঠামোর জন্য মার্কআপ লিখা
  • যে পরিস্থিতিতে টেবিলের বর্ণনা প্রয়োজন তা চিহ্নিত করুন এবং উপযুক্ত কৌশল ব্যবহার করে টেবিলের বর্ণনা চিহ্নিত করা
  • জটিল টেবিল সেলে শিরোনাম এবং ডেটা সেলের মধ্যে সম্পর্ক বিষয়ে তথ্য প্রদানের জন্য কোডার এবং ডিজাইনারদের জন্য সম্পর্কিত প্রয়োজনীয়তা বর্ণনা করা

বিষয়: সরল টেবিল (Simple Tables)

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

ছাত্রদের সক্ষম হতে হবে:

  • কিভাবে টেবিল মার্কআপ সহায়ক প্রযুক্তি যেমন, যেমন টেক্সট-টু-স্পীচ, হেডার এবং ডেটা সেলে তথ্য সংযুক্ত করতে দেয় তা ব্যাখ্যা করা
  • কিভাবে টেবিল মার্কআপ অভিযোজিত কৌশলগুলিকে সমর্থন করে, যেমন কাস্টম স্টাইল শীট ব্যবহার করে টেবিল প্রদর্শন করা এবং বিভিন্ন স্ক্রীন আকারে দেখানো
  • HTML উপাদান  বা এলিমেন্ট দ্বারা তৈরী ডাটা টেবিল সনাক্ত করা
  • HTML উপাদান  বা এলিমেন্ট  th ব্যবহার করে টেবিল হেডারের জন্য মার্কআপ সনাক্ত করা এবং লিখা
  • HTML উপাদান td ব্যবহার করে টেবিল ডেটা সেলগুলির জন্য মার্কআপ সনাক্ত করা এবং লিখা
  • ডেটা উপস্থাপনের পরিবর্তে লেআউটের উদ্দেশ্যে ব্যবহৃত টেবিলগুলি সনাক্ত করা এবং HTML স্ট্রাকচার ব্যবহার

বিষয়: জটিল টেবিল

জটিল টেবিলে একাধিক বা অনিয়মিত সারি বা কলাম হেডার থাকে। জটিল টেবিলের গঠন ও বিন্যাস জানাতে অতিরিক্ত কৌশলের ব্যবহার ব্যাখ্যা করতে পূর্ববর্তী বিষয়ের উপর ভিত্তি করে সরল টেবিল তৈরি করুন। এর মধ্যে রয়েছে HTML উপাদান col এবং colgroup, HTML অ্যাট্রিবিউট স্কোপ এবং headers এবং WAI-ARIA অ্যাট্রিবিউট aria-sort।

ছাত্রদের সক্ষম হতে হবে:

  • এইচটিএমএল অ্যাট্রিবিউট স্কোপ ব্যবহার করে টেবিল হেডারের দিকনির্দেশের জন্য মার্কআপ সনাক্ত করা এবং লিখা
  • HTML উপাদান col এবং colgroup ব্যবহার করে বিভিন্ন কলাম বিস্তৃত শিরোনামগুলির জন্য মার্কআপ সনাক্ত করা এবং লিখা
  • HTML উপাদান row এবং rowgroup ব্যবহার করে বেশ কয়েকটি সারি বিস্তৃত হেডারগুলির জন্য মার্কআপ সনাক্ত করা এবং লিখা
  • HTML উপাদানের thead, tbody, এবং tfoot ব্যবহার করে টেবিলের অংশগুলির জন্য মার্কআপ সনাক্ত করা এবং লিখা
  • HTML অ্যাট্রিবিউট হেডার ব্যবহার করে সেলের জন্য অনিয়মিত হেডার বোঝাতে কোড লিখা
  • শিরোনামের (headers) জন্য কোড লিখা যা WAI-ARIA অ্যাট্রিবিউট aria-sort ব্যবহার করে ascending, descending, other, এবং none দিয়ে ডেটা সাজানোর  জন্য ব্যবহার করা
  • কোড লিখা যা ব্যবহারকারীরা শুধুমাত্র কীবোর্ড এবং ভয়েস ইন্টারঅ্যাকশন সহ বিভিন্ন ইনপুট পদ্ধতি ব্যবহার করে
  • কন্টেন্ট লেখকদের এবং ডিজাইনারদের জন্য যখন সম্ভব তথ্যের সহজ উপস্থাপনা প্রদানের জন্য সম্পর্কিত প্রয়োজনীয়তাগুলি বর্ণনা করা, যেমন জটিল টেবিলগুলিকে সহজ টেবিলে বিভক্ত করা যা বোঝা সহজ।

বিষয়: টেবিলের বর্ণনা

  • HTML এলিমেন্ট caption ব্যবহার করে টেবিলের বর্ণনার জন্য মার্কআপ লিখা
  • এমন পরিস্থিতি চিহ্নিত করা যেখানে টেবিলের বর্ণনা প্রদানের জন্য অন্যান্য কৌশল ব্যবহার করা প্রয়োজন, এবং নিম্নলিখিত কৌশলগুলি ব্যবহার করে টেবিলের বিবরণের জন্য মার্কআপ লিখা:
    • WAI-ARIA বৈশিষ্ট্য aria-labelledby এবং aria-describedby
    • HTML উপাদান বা এলিমেন্ট figure এবং figcaption
    • এইচটিএমএল অ্যাট্রিবিউট summary (ফলব্যাক উদ্দেশ্যে প্রস্তাবিত)
    • কন্টেন্ট লেখকদের অর্থপূর্ণ সারণী সারাংশ এবং বিবরণ লিখতে সম্পর্কিত প্রয়োজনীয়তা বর্ণনা করা

মডিউল ৫: ফর্ম