Gruppering med fieldset

Silktide kontrollerar att grupper av relaterade alternativknappar eller kryssrutor är omslutna av ett fieldset. Fieldset-elementet talar om för att alternativen hör ihop och utgör en enda fråga.

I fungerar alternativknappar och kryssrutor som har samma name-attribut som en grupp – välj storlek eller välj tillbehör. Visuellt är grupperingen uppenbar eftersom alternativen ligger tillsammans, men i koden gör endast ett <fieldset> den uttrycklig.

<!-- Problem: relaterade alternativ utan någon gruppering -->
<label><input type="checkbox" name="fruit" value="apple"> Apple</label>
<label><input type="checkbox" name="fruit" value="banana"> Banana</label>

Varför detta är viktigt

En läser upp varje alternativ när det nås. Utan en grupp hör användaren ”Apple, kryssruta” och ”Banana, kryssruta” utan någon indikation på vilken fråga de besvarar – frågetexten kan ha lästs upp långt tidigare eller aldrig ha kopplats till alternativen. När alternativen omsluts av ett fieldset med en legend läses varje alternativ upp i sitt sammanhang, så att användaren alltid vet vad hen väljer.

Så här åtgärdar du det

Omslut varje uppsättning relaterade alternativ med ett <fieldset> och beskriv gruppen med en <legend>:

<!-- Åtgärdat: gruppen är tydlig och namngiven -->
<fieldset>
  <legend>Välj dina favoritfrukter</legend>
  <label><input type="checkbox" name="fruit" value="apple"> Apple</label>
  <label><input type="checkbox" name="fruit" value="banana"> Banana</label>
</fieldset>

Så här testar Silktide detta

Hitta alla alternativknappar och kryssrutor på varje sida.
Gruppera dem efter deras name-attribut.
För varje grupp med två eller fler medlemmar rapporteras varje medlem som inte finns inuti ett <fieldset>-element.

Felsökning

Mina alternativ är grupperade på ett annat sätt

Den här kontrollen letar specifikt efter ett <fieldset>-element som förälder. Grupperingar som bara uttrycks visuellt eller med annan uppmärkning, till exempel role="group", upptäcks inte. Fieldset-metoden har det bredaste stödet. Om du är säker på att din alternativa gruppering läses upp korrekt kan du resultatet.