2

for e.g. I have calendar dates drop down which has 31 numeric values listed. In accessibility testing, its shows violation.

I have found alternative solution <optgroup label="">, but it's not practically possible for this scenario. Current Scenario

<select class="" name="day" data-componentid="" id="">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">30</option>
</select>
7
  • Which tool you are using for this testing?
    – Diego
    Jun 7 '16 at 10:27
  • AMP tool for Firefox - SSB BART Group Jun 7 '16 at 10:37
  • Please add some more information about the error you are receiving. Jun 7 '16 at 11:27
  • Which Accessibility standards are you testing to?
    – SteveD
    Jun 7 '16 at 12:11
  • Form-> Ensure option elements in large lists are grouped -> If the option element contains more than twenty-five (25) select children flag as a violation. Accessibility standards AA 2.0 Jun 7 '16 at 12:55
5

I have no idea what your tool is unhappy about but there are no accessibility issues with drop-down fields containing 31 items, even when you use the value attribute.

I suspect you are misunderstanding one of the WCAG2.0 requirements, e.g. Technique H85 for Success Criterion 1.3.1 (Info and Relationships) https://www.w3.org/TR/WCAG20-TECHS/H85.html

As you can see from this technique, it is only saying if the data in your drop-down can be semantically grouped, use the optgroup element to create those groups because accessible readers have features to allow users to skim the groups.

So this is not even applicable to your situation, where there are no logical groupings, i.e. they are just sequential numbers from 1 to 31.

This is why accessibly testing tools are to be used with a lot of caution. They can only report on limited things and you need to have good accessibility knowledge to interpret their results.

From a usability perspective, selecting a number from 1 to 31 using a drop-down field is not very usable nor efficient for anybody (click to expand drop-down, scroll down list to find the number and click again).

This is why accessibility experts often say making something accessible improves usability, so consider using a different approach to selecting a date.

2
  • very nice and well explained answer
    – Devin
    Jun 7 '16 at 14:35
  • Great answer. One idea would be to allow users to either type in a date or pick from the list. Jun 7 '16 at 14:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.