Skip to content

Questa traduzione non è ancora stata rivista dalla redazione. Fa fede la versione tedesca. Deutsche Fassung →

Barrierefreiheit

Perché l'ordine dei contenuti nel codice deve essere corretto?

L'ordine nel codice deve essere corretto perché i programmi di lettura leggono una pagina esattamente in questo ordine — indipendentemente da come i contenuti sono disposti sullo schermo. Se il prezzo nel codice viene prima del nome del prodotto, un visitatore cieco sente prima „89 euro” e non sa a cosa serve. L'ordine visibile e l'ordine del codice devono corrispondere.

Due viste della stessa pagina

Ogni sito web esiste due volte: una volta come design visibile sullo schermo e una volta come codice in cui i contenuti sono uno dietro l'altro. Le tecniche di design moderno possono disaccoppiare i due — un elemento che nel codice sta in fondo può apparire visivamente in alto a sinistra. Per i visitatori che vedono, questo è invisibile. Un programma di lettura però segue il codice pedissequamente. Un esempio: il vostro listino prezzi mostra tre pacchetti affiancati, ma nel codice stanno prima tutti e tre i titoli, poi tutti e tre i prezzi, poi tutte e tre le descrizioni. Il visitatore cieco sente „Base, Comfort, Premium, 29 euro, 59 euro, 99 euro” — e non può più assegnare i prezzi ai pacchetti.

Come il nostro motore di misura verifica l'ordine

Lo strumento di prova axe-core riconosce singoli segnali tecnici che indicano un ordine disturbato — ad esempio marcature che strappano gli elementi dal flusso di lettura. Se l'ordine di lettura di una pagina specifica abbia senso dal punto di vista del contenuto, una macchina può però giudicare solo in misura limitata: per questo bisogna comprendere il contenuto. Il nostro motore di misura segue qui il suo principio che una corsa tranquilla non è un via libera — quello che l'automatica non può decidere con certezza, il rapporto segna come „controllare manualmente”. Con lo standard Oro, un controllore si fa emettere la pagina in ordine di codice e giudica se il contenuto rimane comprensibile così.

Beispiele

Reihenfolge per CSS umgestellt

Verstoß
<div style="display:flex; flex-direction:column-reverse">
  <p>Schritt 2: Termin bestätigen</p>
  <p>Schritt 1: Termin wählen</p>
</div>
Erfüllt
<div>
  <p>Schritt 1: Termin wählen</p>
  <p>Schritt 2: Termin bestätigen</p>
</div>

Vorleseprogramme lesen den Quelltext in seiner Reihenfolge. Was optisch umgedreht wird, kommt falsch herum an.

  • Chiedete alla vostra agenzia di guardare le pagine più importanti una volta senza design — solo come ordine del codice.
  • Controllate i listini prezzi e le tabelle di confronto particolarmente attentamente: lì il design separa le informazioni correlate più spesso.
  • Durante i ribassi fate attenzione che i contenuti nel codice siano inseriti dove appartengono dal punto di vista del contenuto — non dove è tecnicamente conveniente.
  • Testate dopo grandi cambiamenti di design con il tasto Tab: se il cursore salta avanti e indietro, di solito anche l'ordine del codice non è corretto.
  • Aggiungete l'ordine di lettura come criterio di accettazione nei contratti con la vostra agenzia.

Deutsche Fassung dieser Seite