Conteúdos em texto, seja para site, aplicativo, arte estática ou até um documento online, permitem diversas opções de formatação. Mas nem todas são acessíveis. O alinhamento justificado, por exemplo, pode parecer uma boa ideia, mas representa uma grande barreira para pessoas disléxicas. Quer saber mais? Confira o texto que criamos com informações do artigo “Text/Typographical Layout”, do site em inglês WebAIM.
Alinhamento do texto
Um conteúdo em texto permite diversas opções de alinhamento: alinhado à esquerda ou à direita, centralizado ou justificado (alinhado em ambas as margens).
Os navegadores alinham o texto dos sites para a esquerda por padrão. Isso porque, quase sempre, essa é a forma mais fácil de se ler. A exceção fica apenas para alguns idiomas asiáticos e do Oriente Médio que, convencionalmente, são lidos verticalmente (de cima para baixo) ou horizontalmente (da direita para a esquerda).
Por isso, para garantir um conteúdo acessível a todas as pessoas, o alinhamento à esquerda é a opção indicada.
Longos blocos de texto centralizados resultam em novas linhas começando em localizações ligeiramente diferentes. Isso pode demandar um esforço adicional durante a leitura e dificultar bastante a absorção do conteúdo, por exemplo, por pessoas neurodivergentes.
Já o texto totalmente justificado obriga cada linha a se estender para ambas as margens (esquerda e direita), ajustando o espaçamento entre palavras e letras. Embora a apresentação resultante possa, primeiramente, se mostrar mais organizada, essas variações de espaçamento prejudicam a legibilidade. Além disso, textos com essa formatação podem criar buracos brancos – padrões de espaços vazios não intencionais que desviam o olhar do fluxo natural do texto. Mais uma barreira que pode impactar consideravelmente a compreensão de pessoas com diversas deficiências cognitivas.
Algumas circunstâncias, como títulos centralizados ou uma data alinhada à direita em um documento, por exemplo, podem ser apropriadas, porém elas devem ser tratadas como exceções.
Margens, preenchimento e espaço em branco
- Espaço em branco para destacar o conteúdo
Documentos com espaço vazio ou “espaço em branco” ao redor dos blocos de texto são geralmente mais fáceis de ler e digitalizar. O espaço ajuda quem está lendo a focar no texto e a criar um layout mais limpo. No entanto, quando o texto chega ao limite da área de visualização, o documento pode parecer mais confuso, desordenado, as linhas do texto podem ficar mais longas, e algumas pessoas podem encontrar mais dificuldade nessa leitura.
Ao criar um design para telas pequenas, a quantidade de espaço em branco entre as margens deverá ser limitada para garantir uma área satisfatória para o conteúdo.
- Espaço em branco para diferenciar os parágrafos
Parágrafos e outros conteúdos de bloco de texto devem ser facilmente distinguíveis uns dos outros. Navegadores de site, por padrão, inserem um espaço vertical (como uma linha em branco) entre parágrafos.
Um método alternativo para diferenciar parágrafos é eliminar esse espaço que geralmente é inserido entre os blocos de texto e aplicar um pequeno recuo de texto no início do parágrafo. Esse é um recurso bastante utilizado, por exemplo, nos materiais impressos (como livros e revistas).
Comprimento da linha
Linhas longas de texto (muitos caracteres por linha) exigem mais esforço para se identificar o início da próxima linha e acompanhar o raciocínio.
O comprimento de linha é afetado pelo tipo de letra, o tamanho do texto e o espaçamento da palavra ou letra, bem como pelo tamanho de exibição e as configurações do dispositivo que a pessoa está usando. Embora não haja um número universalmente ideal de caracteres por linha, em geral, o recomendado é buscar algo entre 50 e 120 caracteres por linha.
Em páginas web responsivas (que se adaptam ao tamanho da tela do dispositivo em uso) é possível restringir larguras mínimas e máximas, e larguras variáveis para garantir que o comprimento das linhas esteja adequado.
Elementos decorativos
- Sublinhado
O uso de sublinhados em links de sites existe desde o começo da web. Por isso, utilizá-lo para outros propósitos na internet, provavelmente, irá confundir quem navega pelo seu site. Da mesma forma que links que não estão sublinhados podem não ser tão óbvios.
- Excluir <del>, inserir <ins> e tachar <s>
O texto excluído pode ser sinalizado utilizando o elemento <del>, o que faz com que ele apareça tachado (risco no meio da palavra). O elemento <s> também deixa esse efeito de risco nas letras. Já o texto inserido num documento pode ser identificado utilizando o <ins>. Porém, essas opções, usadas normalmente em documentos legais/jurídicos para mostrar mudanças de uma versão para outra, não são acessíveis, pois os leitores de tela nem sempre conseguem reconhecer esses elementos.
O mesmo acontece com o uso do código line-through na propriedade text-decoration do CSS, usado por quem programa. Por criar apenas o efeito visual de risco, isso não é transmitido para quem navega com o leitor de telas, o que, com certeza, vai atrapalhar a compreensão da mensagem.
- Textos animados
Textos que piscam ou rolam pela tela, como em um letreiro, devem ser evitados. Isso porque podem distrair e irritar pessoas neurodiversas. Além disso, se o texto em rolagem possuir um link, por exemplo, pessoas com habilidades motoras finas e limitadas podem não conseguir clicar.
* Este conteúdo contou com o apoio de Luciana Quintão de Moraes, poeta, graduada em Letras e voluntária do Movimento Web para Todos.