Esta tradução ainda não foi revista editorialmente. A versão alemã é vinculativa. Deutsche Fassung →
Barrierefreiheit
Porque é que a sequência dos conteúdos no código tem de estar correcta?
A sequência no código tem de estar correcta, porque os programas de leitura lêem uma página exactamente nesta sequência — independentemente de como os conteúdos são dispostos no ecrã. Se o preço aparecer antes do nome do produto no código, um visitante cego ouve primeiro «89 euros» e não sabe para quê. A ordem visível e a ordem do código têm de corresponder.
Duas vistas da mesma página
Cada sítio Web existe de duas formas: uma vez como design visível no ecrã e uma vez como código, em que os conteúdos estão um atrás do outro. As técnicas modernas de design podem separar as duas — um elemento que está bem no fundo do código pode aparecer opticamente no canto superior esquerdo. Para visitantes que vêem, isto é invisível. Um programa de leitura porém segue o código rigidamente. Um exemplo: a sua lista de preços mostra três pacotes lado a lado, mas no código todos os três títulos estão primeiro, depois todos os três preços, depois todas as três descrições. O visitante cego ouve «Base, Conforto, Premium, 29 euros, 59 euros, 99 euros» — e não consegue mais atribuir os preços aos pacotes.
Assim o nosso núcleo de medição verifica a sequência
A ferramenta de verificação axe-core reconhece sinais técnicos individuais que indicam uma sequência perturbada — por exemplo, marcações que arrancam elementos do fluxo de leitura. Se a sequência de leitura em voz alta de uma página concreta faz sentido, uma máquina porém só pode avaliar de forma limitada: para isso, tem de compreender o conteúdo. O nosso núcleo de medição segue aqui o seu princípio de que um andamento discreto não é uma isenção — o que a automação não consegue decidir com segurança, o relatório indica como «verificar manualmente». No padrão ouro, um verificador deixa-se dar a página em sequência de código e julga se o conteúdo continua compreensível.
Beispiele
Reihenfolge per CSS umgestellt
<div style="display:flex; flex-direction:column-reverse">
<p>Schritt 2: Termin bestätigen</p>
<p>Schritt 1: Termin wählen</p>
</div><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.
- Peça à sua agência que reveja as páginas mais importantes uma vez sem design — apenas como sequência de código.
- Verifique as listas de preços e tabelas de comparação com particular cuidado: o design separa informações relacionadas com mais frequência ali.
- Ao reformar, verifique se os conteúdos são inseridos no código onde pertencem funcionalmente — não onde é tecnicamente cómodo.
- Teste após maiores alterações de design com a tecla Tab: se a marcação salta para cá e para lá, a sequência de código geralmente também está incorrecta.
- seuqencia-significativa-do-conteudo