Escrever conteúdo acessível

Um texto acessível é um bom texto. Ele faz com que seu conteúdo seja consumido mais fácil por todos. Eis algumas dicas sobre como escrever com a acessibilidade em mente.

Escrever de forma simples

A documentação é tão boa quanto o que as pessoas podem obter com ela. Se o texto for muito complicado, não será possível usá-lo. Uma linguagem simples aumenta a acessibilidade.

Mantenha sua escrita simples e concisa com estas dicas:

Estrutura do cabeçalho

Os títulos são essenciais na criação de conteúdo acessível. É fornecido aos usuários de leitor de tela a capacidade de pular diretamente para um conteúdo específico, que pode poupar seu tempo.

Trabalhe com o sistema no qual você está escrevendo. Todas as ferramentas populares, como o Microsoft Word, o PowerPoint e o Open Office oferecem estilo e opções de formatação que ajudam você a criar a estrutura apropriada em seus documentos. Use as opções de estilo e de formatação oferecidos em sua ferramenta de edição de conteúdo de preferência.

Exemplo: Título 1 (

)

Os números no estilo de título criam um contexto estrutural para o leitor de tela e ajudam a usuário sem visão a compreender o conteúdo mesmo se não puderem ver as quebras visuais no documento.

Exemplo:

Acessibilidade na educação

Acessibilidade na Blackboard

Mais sobre a elaboração no conteúdo acessível

Enfatizar conteúdo

Leitores de tela não identificam estilos de fonte, incluindo o seguinte:

  • Cor
  • Negrito
  • Itálico
  • Sublinhado
  • Tachado

Use esses estilos para fornecer quebras visuais. Não os use como a única forma de indicar importância ou comunicar informações.

Exemplo: O texto em vermelho se parece com um alerta. Usuários de leitores de tela não saberão se o texto está em vermelho. Eles não fazem ideia de que isso é um alerta.

Quando precisar dar dicas visuais importantes, lembre-se de usar uma alternativa acessível. Use um ponto de exclamação no final de sua frase se for importante. Os leitores de tela destacam pontos de exclamação e de interrogação na entonação. Isso quer dizer que a ferramenta não lerá “ponto de interrogação” — ela lerá em tom de questionamento conforme lê uma pergunta em voz alta.

Exemplo: De novo, não use estilos de fonte sozinho para indicar importância!

Imagens

Pergunte-se qual é o propósito de uma imagem. É para que o visual da página fique atraente? Ou para dar a um usuário com visão uma referência visual do que esperar? A imagem é algo que todos os usuários precisam consumir para entender seu conteúdo?

Se você não sabe o significado ou o propósito da imagem, não a utilize! Ela será uma informação desnecessária que confundirá os alunos com dificuldades de aprendizado.

Texto alternativo

Se você estiver usando um LMS ou site para comunicar informações, aparecerá um campo para texto alternativo, ou texto alt, ao carregar uma imagem. Em imagens decorativas, deixe o campo texto alt em branco. O leitor de tela ignorará a imagem nesse caso. Uma imagem é decorativa quando ela não adiciona informações na página.

Saiba mais sobre imagens decorativas no site de iniciativa de acessibilidade da Web

Exemplo: Se você tiver uma imagem mostrando as ferramentas em uma Interface de usuária (IU), descreva como chegar lá e o que tem na página. Veja um exemplo de descrição de uma imagem na página.

Se você não quiser que o leitor de tela pule a imagem, inclua o texto alt em suas imagens. Você não precisa dizer "Imagem de", pois as ferramentas auxiliares já sabem que se trata de uma imagem. Seja conciso, claro e descritivo.

Não use o mesmo texto alt para todas as imagens, como "Imagem ilustrando o texto associado". Não faz sentido e gera confusão.

Em imagens complexas, mantenha o texto alt curto com 6 ou 7 caracteres e inclua uma legenda sob a imagem que esteja visível a todos e forneça uma descrição clara.

Infográficos

Infográficos requerem um texto alternativo. Essa é uma narrativa que conta a mesma história que os usuários obtêm de forma visual. O texto alternativo deve estar na página logo depois do infográfico. Inclua um link de âncora na parte superior da página para visualizar o texto alternativo.

Veja um exemplo de um infográfico com um texto alternativo.

Texto em imagens

Em relação às diretrizes WCAG, o texto não deve ser incluído como parte de uma imagem. Explique a imagem no texto da página em vez disso.

Links

É importante criar seus links descritivos. Cada link deve descrever o que o usuário encontrará ao clicar nele. Essa é a chave para a ferramenta de Lista de links que os leitores de tela fornecem. Essa ferramenta apenas relaciona os links em uma página e mais nada. Não existe outro contexto para o link.

Exemplo: Nesta página, a ferramenta Lista de links lerá apenas o seguinte: "Veja um exemplo de como descrever uma imagem na página", "exemplo de um infográfico com um texto alternativo", e assim por diante. Cada um descreve o que você espera encontrar ao selecioná-los.

  • Evite usar frases genéricas como "clique aqui" ou "veja mais". As ferramentas de Lista de links leem o texto do link exatamente como foi inserido. Quando o mesmo link se repete (imagine ouvir "clique aqui, clique aqui, clique aqui" repetidamente várias vezes), ele cria caos e confusão para os usuários. Eles precisam entender para onde vai o link e por que devem clicar lá? Links descritivos fornecem esse contexto.
  • Endereços da Web ou URLs não são considerados informativos e não devem ser usados. O leitor de tela lê cada letra individualmente. Em vez disso, deixe o texto descritivo.
  • Abrir links em uma nova janela pode causar desorientação. Mantenha o mínimo. Diga aos usuários quando estiver usando uma nova janela.

Lista e tabelas

Deixe que as ferramentas com as quais cria conteúdo façam o trabalho. Use as ferramentas de travessão, lista numerada e tabela no editor de conteúdo. Ou visualize a fonte e use as tags de HTML corretas.

Listas

Listas de travessão criadas devidamente (

    ) informam aos usuários de leitor de tela quantos itens estão na lista de travessão.

    Listas de números criadas devidamente (

      ) informam ao usuário de leitor de tela quantos itens estão na lista numerada e leem o número de cada item.

      Tabelas

      Use listas em vez de tabelas quando puder! Tabelas podem ser acessíveis, mas usuários de leitores de tela precisam saber os comandos de tecla avançados para navegar por eles e compreendê-los.

      Use cabeçalhos de coluna (). Eles fazem com que o leitor de tela releia o título da coluna para cada célula à medida que o usuário navega pela tabela. Assim, o usuário tem o contexto do conteúdo de cada célula. Ao definir o nome das colunas e adicionar informações à célula, leve em consideração como cada célula será lida.

      Nunca use tabelas para criar um layout visual do conteúdo.

      Um exemplo de uma tabela acessível

      Comandos de tecla

      Existem normas padrão de comandos de tecla no conteúdo da Web. Por exemplo, você pode pressionar Tab para colocar o foco do seu computador no próximo botão. Não é necessário descrevê-los. Para ver uma lista de comandos globais, consulte este Guia de referência rápida de comandos de teclado do JAWS.

      Às vezes, desenvolvedores precisam criar comandos de tecla originais para seu produto. Por exemplo, o Blackboard Collaborate criou comandos de tecla originais para ligar e desligar o microfone. Documente esses comandos de tecla originais em seus tópicos.

      Instruções de clique e comandos de tecla são duas coisas diferentes e não devem estar no mesmo parágrafo. Se os comandos do Mac forem diferentes dos comandos de um PC, use duas frases no parágrafo do tópico de teclas.

      Exemplo 1

      Por padrão, você fica oculto e em silêncio após a conclusão da configuração. Clique nos ícones de microfone e de câmera para começar uma participação completa na reunião.

      Com o teclado, pressione Alt + M para ativar e desativar seu microfone. Pressione Alt + C para ligar e desligar a câmera.

      Exemplo 2

      Botões de navegação aparecerão quando você compartilhar uma apresentação, para que seja possível navegar pelos slides.

      No teclado, pressione Alt + Page Up para avançar para o próximo slide. Pressione Alt + Page Down para voltar. Em um Mac, pressione Alt + Fn + Seta para cima e Alt + Fn + Seta para baixo.

      Vídeo

      Os vídeos devem ser legendados. Para saber mais, consulte sobre legendar vídeos.