Componenten

Meldingen

De feedback meldingen worden gebruikt om expliciet informatie terug te koppelen aan de gebruiker. Per type informatie wordt een andere melding gebruikt.

Toegankelijkheid

  • Wanneer een feedbackmelding een dynamische melding is, dan moet deze in een container geplaatst worden met het attribuut role="alert" zodat het door de screenreader als melding wordt voorgelezen en het verschijnen van een melding in het element wordt opgemerkt door de screenreader.
  • Het is ook handig het attribuut aria-atomic="true" toe te voegen, zodat de hele inhoud van de container wordt voorgelezen er iets van de inhoud wijzigt.
  • Deze container moet ook wanneer de feedbackmelding niet zichtbaar is aanwezig zijn in de DOM bij het laden van de pagina.
  • Meldingen die al op de pagina staat bij het laden van de pagina moeten meestal niet als dynamische melding worden geïmplementeerd.
  • Het icoon in de melding heeft een visually-hidden tekstalternatief.
  • Wanneer er een kop in de melding aanwezig is, dan hangt het kopniveau af van de plek op de pagina waar de melding gebruikt wordt. In de onderstaande voorbeelden wordt hierom niveau h3 gebruikt.

Infomelding

De melding .feedback-info wordt gebruikt om informatie op een pagina uit te lichten, zonder dat hier een urgentie aan mee wordt gegeven en zonder dat hier een actie aan vooraf is gegaan.

Succesmelding

De melding .feedback-success wordt gebruikt om de gebruiker te benadrukken dat de actie die hij uitgevoerd heeft succesvol voltooid is. Deze melding wordt vaak aan het einde van een wizard getoond.

Waarschuwingsmelding

De melding .feedback-warning wordt gebruikt om de gebruiker te waarschuwen, waarbij de melding niet blokkerend is in het proces.

Foutmelding

De melding .feedback-error wordt gebruikt om de gebruiker te informeren over een fout. Deze feedback meldingen worden veel gebruikt in formulieren om server-side meldingen weer te geven. Het betekent vaak dat de beoogde actie van de gebruiker mislukt is.

Compacte feedback voor backoffice

In backoffice applicaties kan het nodig zijn om een meer compacte weergave van een melding te tonen in schermen met een hoge informatiedichtheid. Alle type meldingen kunnen compact worden weergegeven door de class .compact aan de standaard melding toe te voegen.