पाठ 15 / 25
सही तरीके से Lists
संरचना और संबंधों को transmit करने के लिए semantic list elements का उपयोग करें।
Ordered, unordered, description lists
Sequence के लिए <ol>, groups के लिए <ul>, definitions के लिए <dl> का उपयोग करें। स्क्रीन रीडर list की length और item position की घोषणा करते हैं।
<ol>
<li>Clarify requirements</li>
<li>Design mockups</li>
</ol>
<ul>
<li>Free shipping</li>
<li>30-day returns</li>
</ul>
<dl>
<dt>A11y</dt>
<dd>Accessibility</dd>
</dl>Navigation में Lists
Navigation menus को <nav> के अंदर <ul> या <ol> का उपयोग करना चाहिए। यह स्क्रीन रीडर को संरचना समझने में मदद करता है।
Lists को accessibly style करना
<li> elements को रखें भले ही आप CSS के साथ bullets को छिपाएँ। स्क्रीन रीडर अभी भी उन्हें ठीक से घोषित करते हैं।
Nested lists
Nested lists hierarchy को properly convey करते हैं। Screen readers nesting level की घोषणा करते हैं।