Acessibilidade e criação de conteúdo UX
Quando decidi que começaria a alimentar minha página com conteúdos relacionados à criação de conteúdo UX, acessibilidade foi o primeiro tema que me meio veio à mente. Mas, se você me segue, deve ter notado que este não é o meu primeiro artigo por aqui…
Posterguei bastante essa publicação. Quando comecei a escrever, vi que isso não só envolvia a Camila profissional, mas também cutucava a Camila da vida pessoal. A irmã de uma criança com deficiência severa. Consciente e minimamente envolvida na causa PcD. E o que parecia ser um incentivo para eu escrever sobre o assunto, se tornou uma barreira que, estranhamente, me impedia de seguir adiante. Mas aqui estou, finalmente, escrevendo sobre algo que eu não sei tudo e que nem sempre consigo aplicar tudo que sei. Mas se é compartilhando que se aprende, bora lá!
“Algumas pessoas pensam que ‘acessibilidade’ é apenas uma lista de verificação, que trata-se apenas de atender aos requisitos legais ou do projeto. E essa é uma percepção que gostaríamos de mudar. Porque, realmente, acessibilidade não é uma lista de verificação. É sobre pessoas. É sobre pessoas reais com deficiência poderem usar seus sites, aplicativos e tecnologia digital. É sobre experiência do usuário.” — Shawn Lawton Henry, Accessibility Evangelist na W3C Web Accessibility Initiative (WAI) / MIT.
A primeira coisa que ouço quando questiono pontos relacionados à acessibilidade em um projeto é que “tem que ver se pessoas com deficiência são o nosso público” ou que “tem que ver a porcentagem dos nossos usuários que têm deficiência, né”.
Aparentemente, muitos profissionais ainda não entenderam que pessoas com deficiência não são, sempre, um nicho de público que atingimos quando queremos. Mas são, sim, parte de todo e qualquer público (amo essa redundância) que pensemos em atingir. Só no Brasil, elas representam pouco mais de 6% da população. O que dá, por cima, 13 milhões de pessoas.
Além disso, quando falamos em acessibilidade, não estamos falando apenas de pessoas com deficiência, mas também de pessoas:
- Idosas;
- Não familiarizadas com a web;
- Não nativas no idioma do seu site ou aplicativo;
- Pouco ou nada alfabetizadas;
- Com baixa conexão à internet;
- Com limitações situacionais, seja estando em movimento, em um ambiente barulhento ou com pouca luz.
“O poder da web está em sua universalidade. O acesso para todos, independente de deficiência, é um aspecto essencial.” — Tim Berners-Lee, inventor da World Wide Web
Mas pulando a parte que precisamos convencer nossos colegas que acessibilidade importa, vamos ao que está ao nosso alcance enquanto redatores: a escrita.
Escrever de forma acessível, em seus diversos contextos, cenários e condições não é uma tarefa difícil, mas requer atenção para não cairmos no modo automático — e não acessível.
Use estruturas de cabeçalho
Imagine que você precisa comprar bolachas de cereal sem glúten, mas ao entrar no supermercado para fazer a compra, vê apenas corredores repletos de produtos. Sem placas sinalizando quais as seções e sem sinalizações, nas prateleiras, de quais produtos estão ali. Você precisa andar pelos corredores em busca da seção “biscoitos e bolachas” e quando a encontra, precisa olhar para todas as prateleiras em busca dos produtos sem glúten.
É assim que um usuário de leitor de tela se sente quando entra em uma página em que o conteúdo não é sinalizado com as heading tags — os H1, H2, H3… já bem conhecidos por quem produz conteúdo para SEO.
A navegação por cabeçalhos é uma das formas que os usuários de leitores de telas utilizam para escolher o conteúdo que desejam consumir em uma página. Por isso, sem as marcações nos títulos e subtítulos, o leitor de tela entende tudo como um grande bloco de texto.
Leitura por cabeçalhos, quando eles estão estruturados:
Leitura de conteúdo sem estruturas de cabeçalhos:
Inclua textos alternativos nas imagens
Pessoas que não enxergam, obviamente, não conseguem consumir o conteúdo de uma imagem. Por isso, inclua textos alternativos nessas imagens.
- Inclua textos alternativos significativos.
- Considere o contexto em que a imagem está aplicada, pois sua descrição pode depender dele.
- Evite subjetividades, como “parece ser”, “dando a entender”, e adjetivos, que demonstram interpretações pessoais sobre a imagem.
- Para ícones, crie rótulos informativos curtos, com 1 a 3 palavras.
- Para infográficos adicione, antes da imagem, um link âncora para o texto alternativo, que deverá estar na mesma página do infográfico. O texto alternativo deverá ser mais longo e em formato de texto dissertativo, não de descrição.
- Ao criar as descrições, pergunte-se: é possível mentalizar a imagem somente ouvindo essa descrição?
- Imagens meramente decorativas devem ser ignoradas pela tecnologia assistida. Para isso, peça ajuda aos devs!
Imagine que você acessou, com a ajuda de um leitor de tela, um tutorial 100% visual de transferência bancária pelo app do banco:
✔️ Ilustração da tela do aplicativo, mostrando o seguinte passo a passo: acesse o aplicativo e clique em “Transferência”, no menu à esquerda. Depois, digite o valor que deseja transferir e clique em Continuar”.
❌ Imagem da primeira etapa do passo a passo para fazer transferência pelo aplicativo.
Intitule hiperlinks e botões de forma não genérica
Outra maneira de navegação que pessoas usuárias de leitores de tela utilizam é a navegação por links e botões. Então, quando usamos textos genéricos nos botões, tudo que fornecemos a essas pessoas são informações genéricas. Quando, idealmente, elas precisam saber exatamente para onde vão ao clicar em um link ou botão.
Criar rótulos significativos também ajuda a retirar uma possível ambiguidade entre os conteúdos. Numa página de assinatura de serviço onde há um campo para assinatura de newsletter, “assine” pode não ter somente um destino.
Evite números ou símbolos no lugar de letras
Sim, isso se refere ao X e @, que são usados na tentativa de neutralizar o gênero das palavras.
Por ser impronunciável, o X e o @ não são inclusivos para aqueles que usam leitores de tela, que podem ouvir “meninquis” e “menin arroba s”, ao se depararem com “meninxs” e “menin@s”, por exemplo. Além disso, eles também dificultam a compreensão por pessoas dislexas ou que têm dificuldades de compreensão e leitura.
Para ver dicas sobre redação neutra de gênero, veja o Manual para o uso não sexista da linguagem.
Ou para refletir sobre linguagem inclusiva e diversidade, esse texto do Fabricio Souza.
Forneça legendas ou transcrições para recursos multimídias
Forneça transcrições de áudio para conteúdo somente de áudio, como um podcast. Já para conteúdos em vídeo, forneça legendas, transcrições de sons ambientes e descrições de conteúdos visuais, se eles forem relevantes para o conteúdo.
Por exemplo, em um curta-metragem de suspense, além das legendas, transcreva “rangido de porta” e descreva “vulto passa pela janela”, pois são acontecimentos importantes para trazer suspense à cena.
Seja claro e específico nos textos de erro e ajuda
Mensagens de erro e ajuda devem ser claras e fáceis de entender, seguindo a fórmula já conhecida em UX writing:
- Diga o que aconteceu e porque aconteceu, sem jargões e termos técnicos.
- Guie o usuário para um próximo passo, seja ele a solução do problema ou uma nova tarefa que faça sentido naquele momento.
Imagine o seguinte cenário: um usuário daltônico dicromático está tentando logar em um site, mas recebe o aviso de “dado incorreto”. O campo que apresenta o dado incorreto está vermelho, porém, tudo que o usuário vê são campos cinzas.
O que poderia ajudar esse usuário a completar a tarefa sem esforço?
Um texto de erro especificando qual dado está incorreto e deve ser corrigido. Mas se isso não é feito, o usuário precisa continuar tentando corrigir o que não sabe que está errado. Uma experiência não muito agradável, hum?!
Ainda sobre formulários, considere as seguintes recomendações para campos obrigatórios:
- Campos obrigatórios devem ser sinalizados como tal.
- Em caso de não preenchimento, as mensagens de erro devem ser apresentadas junto ao campo. Mas se apresentadas no topo da página, devem especificar a qual campo se referem, como no exemplo acima.
- Também é recomendável incluir uma notificação de erro no título da página para que o usuário de leitor de tela perceba que seu formulário não foi enviado por erro de preenchimento e, assim, possa corrigi-lo.
- Dê instruções para o usuário sobre como preencher corretamente os campos.
Escreva de forma simples
A leiturabilidade, ou nível de facilidade de leitura, como também é chamado, busca medir quanta energia o leitor terá que gastar para compreender um conteúdo.
É considerado um texto com boa leiturabilidade aquele que exige do leitor as habilidades de leitura de um estudante do 9º ano escolar brasileiro ou menos. Apesar disso, todos os leitores se beneficiam do texto com boa leiturabilidade, especialmente pessoas dislexas ou com baixo grau de instrução.
Você pode ler mais sobre leiturabilidade e suas fórmulas aqui.
E também pode ler sobre a adaptação para a língua portuguesa na página 14 deste estudo aqui.
Para escrever de forma simples e garantir a boa leiturabilidade do seu texto, considere:
- Usar palavras curtas, simples e familiares para os usuários.
- Evitar frases longas.
- Evitar jargões e expressões técnicas.
- Priorizar a linguagem informal/popular.
- Quebrar o conteúdo em blocos, agrupando por similaridade quando ele for denso.
- Usar voz ativa e tempos verbais consistentes.
- Expandir siglas nas primeiras vezes que elas aparecerem em seu texto.
Você também pode trabalhar a edição em 4 etapas, descrita por Torrey Podmajersky em seu livro Redação Estratégica para UX. Neste processo, em cada etapa, trabalhamos uma das características desejáveis para um texto UX: significativo, conciso, dialógico e claro.
Significativo
Crie o esboço do seu conteúdo certificando-se que ele é significativo para o negócio e para o usuário, transmitindo tudo o que ambos precisam.
Conciso
Agora, é hora de reduzir a quantidade de texto. Para isso, experimente criar diversas versões para a mesma ideia, mudando as palavras e a organização delas. Lembre-se das leis da psicologia que podem ser aplicadas à escrita UX.
Dialógico
Com algumas versões do conteúdo em mãos, é hora de ler em voz alta, verificar se soa bem ou não, se soa repetitivo e se atende ao tom de voz da marca. Aqui, considere também a leitura das tecnologias assistivas, que sinalizam, por exemplo, os elementos da interface antes do conteúdo em si. Se, por exemplo, você apresenta um CTA com o texto “Assine o serviço”, o leitor de tela lê “link: assine o serviço”. E se puder testar o conteúdo em um leitor de tela, melhor ainda!
Claro
Por fim, é hora de rever o objetivo do texto, o contexto do usuário e a voz da marca. Tente, aqui, mostrar o conteúdo a outras pessoas da equipe para coletar feedbacks do quão claro está o seu texto.
Se depois de tudo isso, o conteúdo ainda for complexo ou não for possível sua tradução para uma linguagem mais simples, crie um conteúdo suplementar que esclareça o conteúdo principal. Ele pode ser:
- Uma versão em áudio.
- Uma ilustração.
- Um resumo do conteúdo, que pode ser um parágrafo único ou tópicos com os principais pontos do texto. Lembre-se de usar frases mais curtas, palavras mais simples e as outras dicas para escrever conteúdo simples.
Ufa, chegamos ao fim! E não sei se te agradeço ou te parabenizo por ter chegado até aqui 😅
Como falei lá no início, esse é um assunto que ainda não conheço a fundo, por isso, muitas recomendações relevantes para redatores UX podem ter ficado de fora… Então, se você conhece outros critérios de sucesso ou se tem alguma contestação sobre meu texto, vamos conversar!
Todas as recomendações deste texto têm como fonte as Diretrizes de Acessibilidade para Conteúdo Web (WCAG).
