HTML টেবিল ট্যাবুলার ডেটা (সংযুক্ত ডেটার সারি এবং কলাম) উপস্থাপন করে — লেআউটের জন্য নয়। একটি অ্যাক্সেসযোগ্য টেবিল সঠিক কাঠামো ব্যবহার করে যাতে স্ক্রিন রিডার প্রতিটি সেল সহ হেডার ঘোষণা করতে পারে।
Q2 Sales by Region
Region
Revenue
North
$12,000
South
$9,500
Total$21,500
<th> with scope — হেডার সেল চিহ্নিত করে। কলাম হেডারের জন্য scope="col", সারি হেডারের জন্য scope="row"। স্ক্রিন রিডার তারপর "North, Revenue: $12,000" ঘোষণা করে প্রসঙ্গ ছাড়াই সেল পড়ার পরিবর্তে।<caption> — পুরো টেবিলের জন্য একটি শিরোনাম, <table> এর প্রথম সন্তান; ব্যবহারকারীদের অভিমুখ করতে পড়া হয়।<thead>/<tbody>/<tfoot> — হেডার, বডি এবং সারসংক্ষেপ সারি গ্রুপ করুন; নেভিগেশনে সাহায্য করুন এবং মুদ্রণ করার সময় হেডার পুনরাবৃত্তি করতে দিন।<!-- ❌ this was 1990s practice — use CSS grid/flexbox instead -->
<table><tr><td>sidebar</td><td>content</td></tr></table>
লেআউট টেবিল স্ক্রিন রিডার বিভ্রান্ত করে (তারা ডেটা-টেবিল শব্দতত্ত্ব ঘোষণা করে) এবং নমনীয় নয়। পৃষ্ঠার লেআউটের জন্য CSS Grid/Flexbox ব্যবহার করুন।
সঠিক টেবিল শব্দতত্ত্ব (<th scope>, <caption>, বিভাগ) স্ক্রিন রিডার ব্যবহারকারীদের জন্য ডেটা টেবিল ব্যবহারযোগ্য করে তোলে — তারা প্রতিটি মানকে তার সারি এবং কলাম হেডারের সাথে সংযুক্ত করে।
<table> কে সম্পূর্ণ ট্যাবুলার ডেটার জন্য সংরক্ষণ করুন।