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 deficiências cognitivas, linguísticas, de aprendizado e baixa visão podem ter dificuldade para processar o texto devido a outros elementos, como variações de fonte, tamanho, espaçamento e kerning, entre outros.

Este módulo analisa 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 família tipográfica e estilo pode ser decisiva no design de qualquer 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.

Escolher fontes comuns A maneira mais rápida de criar um design acessível é escolher uma família tipográfica comum (como Arial, Times New Roman, Calibri, Verdana, entre outros).

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

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 claramente definido e ter características únicas, para que 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 fontes do Google.

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 kerning, especialmente entre o par de letras r e n.

Tamanho da fonte e estilo tipográfico

Muitas vezes, as pessoas presumem 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 textos em itálico. Os leitores de tela geralmente ignoram os 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 é tornar os elementos críticos distintos 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ência, porque eles têm dificuldade em manter o lugar e seguir o fluxo da cópia.

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 artificial, o que dificulta a localização dos limites de 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 de parágrafo, que cria "rios de espaço" dentro do texto.

Pontos principais de tipografia acessíveis

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 uma cópia legível, sempre devo usar um alto contraste entre a cópia 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 fontes são as melhores 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.
Famílias tipográficas 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 usar fontes artísticas e scripts elaborados.