Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Valt een accordion zonder een aria-expanded attribuut onder 4.1.3? #72

Open
JuliaZjochova opened this issue Aug 19, 2024 · 5 comments
Open

Comments

@JuliaZjochova
Copy link

Een accordion heeft geen aria-expanded attribuut. Na het openen van de accordion gaat de focus niet naar de eerste tekst binnen de accordion, maar gaat meteen door naar het volgende interactieve element (de volgende accordion knop). Is dit een statusbericht?

@rianrietveld
Copy link
Member

Een accordion geen aria-expanded attribuut.

Is dit een HTML-details/summery constructie? Dan verzorgen de browser/screen reader zelf al het uitspreken van de status.
Anders is het een ovetreding van 4.1.2 role name value. Omdat de waarde van de status (het open/dicht zijn van de accordion) niet wordt doorgegeven.

Na het openen van de accordion gaat de focus niet naar de eerste tekst binnen de accordion.

Dit is denk ik verwacht gedrag.
Alleen als er een focusable itlem zoals een link in de tekst staat moet daar de focus naar toegaan.
ZIe voor een codepen met demo van native HYML details/summary.

@JuliaZjochova
Copy link
Author

JuliaZjochova commented Aug 20, 2024

Nee, het is geen details/summary. Er kunnen meerdere SC worden afgekeurd. Ik wil graag specifiek weten over 4.1.3.

In de meeste accordions zie ik dat de focus naar de volgende trigger gaat en de tekstuele inhoud in de opengeklapte sectie overslaat. Is dit ook fout onder 4.1.3 als er geen aria-expanded op de accordion knop zit?

<div id="accordionGroup" class="accordion">
  <h3>
    <button>
        Personal Information
    </button>
  </h3>
  <div class="accordion-panel">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
    tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
    quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
    consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
    cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
    proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  <div>
   <h3>
    <button>
        General Information
    </button>
    </h3>
    <div class="accordion-panel">
      Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
      tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
      quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
      consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
      cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
      proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    <div>
  </div>

@rianrietveld
Copy link
Member

rianrietveld commented Aug 20, 2024

Nee, dit is geen statusbericht, maar het niet vermelden van de state van een element (open/dicht). Dus het valt onder 4.1.2. Of de onderstaande div open of dicht is, is een state van de property aria-expanded.

Een statusbericht is echt een melding over zichtbare berichten, voor alle gebruikers: Is een formulier succesvol verzonden, zijn er fouten, hoeveel zoekresultaten zijn er, is de tijdslimiet bijna verstreken?

En de focus is echt verwacht gedrag. Als de div open is kan de screenreadergebruiker het gewoon gaan lezen. Maar dan moet wel gemeld worden dat de accordion open is met aria-expanded :-)
Check wel of als er een link of een knop in de div staat of deze wel toestenbordfocus krijgt (anders fail voor 2.1.1)

@cstrobbe
Copy link
Collaborator

Ik sluit me aan bij Rian Rietveld. Het ontbreken van aria-expanded is het ontbreken van een "state" in de zin van SC 4.1.2 en heeft niets met statusberichten te maken (SC 4.1.3).

@rianrietveld
Copy link
Member

Hoi @JuliaZjochova is deze vraag voldoende beantwoord of heb je een andere mening?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants