Tipografia

Criar e projetar conteúdo acessível é mais do que apenas escolher uma fonte fácil de ler. Mesmo com famílias de fontes acessíveis, pessoas com baixa visão, dificuldades cognitivas, de linguagem e de aprendizagem podem ter dificuldade para processar o texto devido a outros elementos, como variações de fonte, tamanho, espaçamento e kerning, para citar alguns.

Este módulo analisa as considerações básicas de design para tornar seu conteúdo mais inclusivo e alcançar ainda mais pessoas.

Face de tipos

Um dos principais fatores que podem afetar a acessibilidade da cópia é a família tipográfica. Sua escolha de tipo de letra e estilo pode fazer ou quebrar qualquer design de página.

Pessoas com distúrbios de leitura, aprendizagem e atenção, como dislexia e TDAH, e pessoas com baixa visão podem se beneficiar do uso de famílias tipográficas acessíveis.

Escolha famílias tipográficas comuns O modo mais rápido de criar um design acessível é escolher uma família tipográfica comum (como Arial, Times New Roman, Calibri, Verdana e muitas outras).

Muitos estudos de tipografia com pessoas com deficiência mostram que fontes comuns levam a velocidades de leitura mais rápidas e um nível de compreensão mais profundo em comparação com fontes incomuns. Embora as famílias tipográficas comuns não sejam inerentemente mais acessíveis do que outras, algumas pessoas com deficiência têm mais facilidade para lê-las porque têm muita experiência trabalhando com (ou em torno de) essas famílias.

Além de escolher uma fonte comum, evite fontes ornamentadas ou escritas à mão, bem como aquelas com apenas um caso de caracteres disponível (por exemplo, apenas caracteres maiúsculos). Essas famílias tipográficas especiais com designs cursivos, formas estranhas ou características artísticas, como linhas finas, podem parecer bonitas, mas são muito mais difíceis de ler para algumas pessoas com deficiência do que as famílias tipográficas comuns.

Características das letras e espaçamento entre elas

A pesquisa sobre se os tipos serif ou sans serif são mais fáceis de ler é inconclusiva, mas alguns números, letras ou combinações podem confundir pessoas com dificuldades de aprendizagem e cognitivas. Para pessoas com esses tipos de deficiência, cada letra e número precisa ser definido claramente e ter características únicas, para que as letras não sejam confundidas com números.

Os infratores comuns de legibilidade são a letra maiúscula "I" (Índia), a letra minúscula "l" (alface) e o número "1". Da mesma forma, pares de letras como b/d, p/q, f/t, i/j, m/w e n/u às vezes podem ser invertidos da esquerda para a direita ou de cima para baixo para alguns leitores.

A legibilidade da cópia também diminui quando o espaçamento entre letras ou a justificação é muito próximo. Preste atenção especial ao espaçamento entre letras, especialmente entre o par de letras problemático r/n. Caso contrário, palavras como "yarn" podem mudar para "yam" ou "stern" para "stem", mudando completamente o significado da cópia.

Coleções de fontes de código aberto, como as Google Fonts, podem ajudar você a selecionar a fonte mais inclusiva para seu próximo design. Se você usa produtos da Adobe, pode incorporar famílias de fontes acessíveis de parceiros de fundição diretamente nos seus designs, incluindo algumas Google Fonts.

Ao procurar a próxima família tipográfica, preste atenção especial aos seguintes pontos:

  • Use fontes comuns sempre que possível.
  • Evite usar fontes elaboradas ou manuscritas e aquelas com apenas um tipo de caractere.
  • Escolha uma família tipográfica com características únicas, prestando atenção especial ao I maiúsculo, l minúsculo e 1.
  • Revise certas combinações de letras para garantir que elas não sejam uma imagem espelhada exata uma da outra.
  • Verifique o espaçamento entre letras, especialmente entre o par de letras r e n.

Tamanho da fonte e estilo tipográfico

As pessoas costumam presumir que escolher uma família de fontes acessível é tudo o que há para criar conteúdo inclusivo, mas também é importante considerar o tamanho da fonte e como o texto é estilizado em uma página.

Por exemplo, pessoas com baixa visão ou daltonismo podem não conseguir ler parte do texto se ele for muito pequeno, usando uma AT, como o zoom do navegador, para ler o texto. Outros usuários, como pessoas com dislexia ou distúrbios de leitura, podem ter dificuldade para ler texto em itálico. Os leitores de tela geralmente ignoram métodos de estilo, como negrito e itálico, para que a intenção desses estilos não seja transmitida a usuários cegos ou com baixa visão.

O que não fazer
h2 {font-size: 16px;}
O que fazer
h2 {font-size: 1rem;}

Como não é possível prever as necessidades de cada usuário, ao adicionar fontes aos sites e aplicativos da Web, considere estas diretrizes:

  • Os tamanhos de fonte base precisam ser definidos com um valor relativo (%, rem ou em) para permitir o redimensionamento.
  • Limite o número de variações de tipo de letra, como cor, negrito, TUDO EM MAIÚSCULAS e itálico, para aumentar a legibilidade. Em vez disso, use métodos para enfatizar palavras no texto, como asteriscos, traços ou destacando uma palavra específica.
  • Use marcações em vez de texto em imagens sempre que possível. Os leitores de tela não podem ler texto incorporado em imagens (sem código extra adicionado), e o texto incorporado também pode ficar pixelado quando ampliado por usuários com baixa visão.

Estrutura e layout

Embora o tipo de letra, o tamanho da fonte e o estilo tipográfico sejam importantes para a tipografia acessível, a estrutura e o layout da cópia em uma página podem ser igualmente importantes para a compreensão do usuário.

Layouts complexos podem ser uma barreira para pessoas com baixa visão, deficiências de leitura e 6, 1 milhões de pessoas nos EUA com TDAH. Esses tipos de deficiência dificultam que as pessoas mantenham o foco e sigam o fluxo da cópia devido à falta de caminhos lineares claros, de títulos ausentes e de elementos não agrupados.

Um aspecto importante dos designs de layout acessíveis é diferenciar elementos críticos uns dos outros e agrupar elementos semelhantes. Se os elementos estiverem muito próximos, pode ser difícil dizer onde um elemento começa e termina, especialmente se eles tiverem estilos semelhantes.

Pense no texto como uma coleção de tópicos individuais em um resumo. Isso vai ajudar a planejar a estrutura geral da página e permitir que você use títulos, subtítulos e listas sempre que apropriado.

Espaçamento

O espaçamento de parágrafos, frases e palavras ajuda os leitores a manter o foco no texto e contribui para a compreensão visual geral da página. Linhas longas de texto podem ser uma barreira para leitores com deficiências, já que eles têm dificuldade para manter o lugar e seguir o fluxo do texto.

Um bloco estreito de texto facilita a leitura da próxima linha.

Alinhamento do conteúdo

Outra frustração para muitas pessoas com deficiência é ler texto justificado. O espaçamento irregular entre as palavras em texto justificado pode causar a formação de "rios de espaço" na página, tornando o texto difícil de ler.

A justificação de texto também pode fazer com que as palavras sejam agrupadas ou esticadas de maneira não natural, dificultando a localização dos limites das palavras.

Felizmente, há diretrizes claras sobre espaçamento e ferramentas, como Good Line-Height e a Golden Ratio Calculator, para ajudar a tornar nossa cópia mais acessível. A incorporação dessas diretrizes ajuda pessoas com distúrbios de déficit de atenção, leitura e deficiências visuais a se concentrarem mais no texto e menos no layout.

Práticas recomendadas para estrutura e layout

Ao considerar a estrutura e o layout, faça o seguinte:

  • Use elementos como títulos, subtítulos, listas, números, blocos de citações e outros agrupamentos visuais para dividir a página em seções.
  • Use parágrafos, frases e espaçamento de palavras claramente definidos.
  • Crie colunas de texto com menos de 80 caracteres de largura (40 caracteres para logogramas).
  • Evite o alinhamento justificado do parágrafo, que cria "rios de espaço" na cópia.

Dicas de tipografia acessível

A tipografia acessível pode ser resumida a escolhas de design sensatas com base no seu conhecimento das necessidades dos usuários. Ao projetar e criar seu conteúdo, lembre-se deste módulo para ajudar a se comunicar claramente com o maior número de pessoas.

Teste seu conhecimento

Teste seus conhecimentos sobre como medir a acessibilidade

Para que o texto seja legível, sempre use alto contraste entre o texto e o plano de fundo.

Verdadeiro.
Embora o alto contraste seja útil para algumas pessoas com deficiências visuais, outras podem ter deficiências que dificultam a leitura de conteúdo com alto contraste.
Falso
Algumas pessoas com deficiência não conseguirão ler seu conteúdo se o contraste for muito alto. Se possível, permita que as configurações do sistema operacional do usuário determinem o contraste.

Quais são as melhores fontes para acessibilidade?

Fontes do sistema, como Arial e Verdana.
Tipografias comuns levam a velocidades de leitura mais rápidas e um nível de compreensão mais profundo em comparação com tipografias incomuns.
Tipos de letra acessíveis.
Coleções de fontes acessíveis, como a Google Foundry nas fontes da Adobe, podem ajudar você a selecionar a fonte mais inclusiva para seu próximo design.
Não faz diferença.
A seleção de fontes pode afetar a legibilidade. Evite fontes artísticas e scripts elaborados.