Acessibilidade digital para profissionais de marketing Parte 2: experiência do usuário e sites

Publicados: 2022-06-16

No primeiro post desta série sobre Acessibilidade Digital, abordamos os “o que e os porquês” da acessibilidade para profissionais de marketing. Agora é a vez dos “comos”.

Observe que limitamos intencionalmente nossas recomendações aos elementos que são bastante fáceis de implementar e relevantes para os profissionais de marketing. Esta série não é de forma alguma uma lista abrangente de todos os padrões que as empresas precisam conhecer quando se trata de conteúdo acessível. Se você deseja aprender sobre o âmago das diretrizes de acessibilidade e os critérios WCAG, confira o programa de e-learning TGPi. É uma opção individualizada que você pode usar para manter suas habilidades atualizadas ou se familiarizar com técnicas de acessibilidade e práticas recomendadas.

Vamos às recomendações!

Acessibilidade e experiência do usuário

Uma experiência de usuário suave e sem esforço é a Estrela do Norte para todo profissional de marketing. A facilidade com que um indivíduo pode concluir uma tarefa crítica e quão bem o conteúdo atende às expectativas tem uma grande influência sobre isso e fará ou quebrará seus esforços de marketing.

Faz sentido, certo? Se você quiser comprar algo online e encontrar um problema ao tentar inserir as informações do seu cartão de crédito, ou o item que você queria está esgotado, a qualidade da sua experiência do usuário cairá. Primeiro, porque você foi incapaz de realizar o que se propôs a fazer, e segundo, porque esperava ser capaz de realizá-lo, mas isso não estava nos planos. Esse golpe duplo quase certamente garantiria que você não retornaria a esse site específico!

Como profissional de marketing, você está bem sintonizado com a importância de uma experiência de usuário superior. Você pode até testá-lo (bom para você!) ou ter análises para medi-lo. Essas medidas são fundamentais para otimizar seu funil de marketing. No entanto, o que você pode não estar fazendo é testar a acessibilidade do usuário. (Se você não for, sem julgamento! É isso que esta série de posts pretende mudar.)

Jornadas do usuário

Uma jornada do usuário (também conhecida como fluxo do usuário ou caminho do usuário) é uma sequência de ações que um usuário realiza em seu site. Uma jornada crítica do usuário se alinha ao objetivo principal do seu site, como concluir uma compra, enviar um formulário, assistir a um vídeo, ler uma postagem etc.

Você deve sempre priorizar a correção de acessibilidade para suas jornadas essenciais do usuário por vários motivos.

Primeiro, embora você possa ter um conteúdo incrível em todo o seu site, se um usuário não conseguir concluir seu objetivo principal de visitar seu site, esse é um cliente que você perdeu para sempre.

Em segundo lugar, muitas pessoas com deficiência estão, infelizmente, acostumadas a enfrentar desafios ao fazer coisas que outras pessoas consideram garantidas. Eles geralmente os esperam, pois grande parte do mundo não foi criada com suas deficiências específicas em mente.

Em média, pequenas preocupações de acessibilidade no conteúdo tangencial provavelmente não os frustrarão a ponto de iniciar uma ação legal. Mas se eles são incapazes de fazer a única coisa que vieram realizar em seu site, você se abre para uma grande lata de risco legal, especialmente se você for uma marca sediada nos EUA.

Testando seus caminhos críticos de usuário

Então, como você testa seus fluxos de usuários críticos para acessibilidade? Se você optar pela rota manual, poderá realizar testes de usuário com pessoas com deficiência ou inspecionar o código para cada etapa usando uma ferramenta como o ARC Toolkit da TPGi (mais sobre isso posteriormente) para identificar falhas nas WCAG.

Embora o teste manual seja mais abrangente, se você deseja identificar imediatamente erros de acessibilidade em seus caminhos críticos de usuário, pode usar o recurso de fluxos de usuário do ARC Monitoring para verificar automaticamente a acessibilidade de cada componente. Você pode incluir todos os componentes e interações dinâmicas de uma jornada do usuário, de imagens a caixas de diálogo, para verificação, e poderá rastrear erros ao longo do tempo para ajudar a melhorar seus processos internos de correção.

Você pode emparelhar as informações adquiridas do Monitoramento de fluxos de usuários da ARC com suas outras ferramentas de análise, como o funil e as metas do Google Analytics, para identificar as barreiras que impedem os usuários de concluir a ação desejada.

Sites acessíveis

Um site é a loja ou escritório digital da sua empresa. Pode ser a primeira (ou única) impressão que um cliente em potencial tem da sua empresa, então você vai querer torná-la o mais atraente possível. Talvez você tenha alguns vídeos, ou muitas imagens para quebrar a monotonia, ou páginas e mais páginas de conteúdo valioso do blog. Todos esses são ativos fantásticos que os profissionais de marketing podem aproveitar para persuadir as pessoas a comprar seus produtos.

Garantir que todo esse conteúdo seja acessível pode parecer assustador, mas muitas das melhores práticas para conteúdo acessível são indistinguíveis das melhores práticas de marketing. Continue lendo para saber mais:

Texto do link descritivo

Todo bom profissional de marketing sabe que a clareza é essencial para uma comunicação excelente. Se você embelezar sua cópia com palavras fofas e que soam importantes (mas no final das contas sem sentido), sua mensagem se perderá. Da mesma forma, se você for muito cauteloso com suas explicações, um cliente pode não ter informações suficientes para entender o que você está dizendo.

O conteúdo de alta qualidade é um equilíbrio entre esses dois extremos e, sem surpresa, o link ou o texto âncora segue essas mesmas regras. O melhor texto de link dá ao usuário uma ideia do que esperar quando clicar. O texto do link descritivo é especialmente crítico para sua cópia de call-to-action. O que prepara melhor o usuário sobre o que ele encontrará ao clicar: “Clique aqui” ou “Baixe nosso whitepaper”? Obviamente, o último! (Se você escolheu o primeiro, talvez queira considerar uma nova carreira.)

Não há necessidade de consagrar seu CTA com palavras interessantes (“Baixe o maior whitepaper do mundo sobre a magia de Harry Houdini!”), mas é fundamental que as pessoas saibam no que estão se metendo.

Por que o texto do link é tão importante para a acessibilidade? Primeiro, ajuda muito as pessoas cegas ou com baixa visão com o conteúdo da página. (Isso também vale para pessoas com visão perfeita.) Os usuários com deficiência visual usam uma variedade de tecnologias assistivas para acessar conteúdo digital, como ferramentas de ampliação de tela para pessoas com baixa visão e leitores de tela para pessoas cegas. Como o próprio nome indica, um leitor de tela lê literalmente o que está na tela.

No entanto, leitores de tela como o JAWS permitem que os usuários pulem pela tela, lendo vários componentes em vez de passar por todo o HTML de cima para baixo. Quando um usuário passa de um componente para outro, o leitor de tela lê apenas o texto âncora dos links, não a cópia ao redor. Isso significa que se todos os seus links forem a mesma cópia “clique aqui”, um usuário de leitor de tela não terá ideia do que acontecerá se seguir esse link; eles são forçados a explorar o conteúdo ao redor para entender a que esse link se relaciona.

Além disso, os leitores de tela permitem que os usuários abram uma “lista de links”, o que lhes dá acesso rápido a todos os links em uma página da web. Este é um cenário comum em que o texto do link será lido fora do contexto circundante e onde coisas como “clique aqui” se tornam um problema real.

Texto alternativo para imagens

Texto alternativo, ou “texto alternativo”, descreve as imagens do seu site para que um usuário de leitor de tela possa ter uma ideia mais abrangente do conteúdo de cada página da web. Se você escolher imagens que funcionam como uma explicação visual, as pessoas que não podem vê-las ficarão perdidas se você renunciar ao texto alternativo.

No entanto, se você incluiu imagens por razões puramente estéticas (talvez você realmente goste de fotos de pessoas debruçadas sobre computadores) e você tem várias delas, você pode não querer adicionar texto alternativo para todas elas. Os leitores de tela lerão todo o texto alternativo de cada imagem, o que, se o texto não agregar valor ativamente à experiência, pode ser irritante. Se uma imagem pode ser considerada decorativa e não adiciona significado/compreensão adicional ao conteúdo da página, ela deve ser ocultada para tecnologia assistiva fornecendo um atributo alt vazio.

Sites bem estruturados

Utilize suas tags de cabeçalho adequadamente para que os leitores com deficiência visual e sem deficiência possam percorrer a página e obter uma compreensão básica do conteúdo e navegar facilmente. Siga as práticas recomendadas para cabeçalhos, como iniciar cada página com um H1 que descreve o conteúdo da página e usar H2s e H3s como subtítulos. Use as tags de cabeçalho intencionalmente; não os escalone aleatoriamente sem pensar na estrutura.

Embora você possa diferenciar os títulos por meios visuais por meio do estilo CSS, os usuários de leitores de tela não têm o luxo de ver essas distinções. É especialmente importante utilizar layouts de página bem formatados para garantir que os usuários com dificuldades de visão possam consumir facilmente seu conteúdo.

Reduza ao mínimo os parágrafos densos, use frases mais curtas quando puder e evite usar jargões ou gírias. Uma cópia mais clara e concisa ajudará os usuários com deficiências cognitivas a entender melhor seu conteúdo e também ajudará a minimizar a confusão para todos os leitores.

Talvez você já tenha ouvido falar que a capacidade de atenção das pessoas agora é menor do que a de um peixinho dourado? Na dúvida, divida-o; torná-lo o mais simples possível.

Taxas de contraste de cores

Vamos torcer para que o guia de estilo da sua organização não tenha sido projetado pelo Papai Noel, pois usar vermelho e verde para cores complementares não fará nenhum favor aos seus usuários. O contraste de cores é um elemento essencial do design acessível. Indivíduos com baixa visão podem achar difícil diferenciar entre cores muito semelhantes e, para usuários daltônicos, muitas cores são indistinguíveis.

Você pode experimentar a ferramenta gratuita Color Contrast Analyzer do TGPi, que eliminará as suposições na determinação de proporções de cores suficientes. Use o seletor de cores para escolher as cores do primeiro plano e do plano de fundo, e o CCA informará se o contraste é apropriado.

Formulários acessíveis

Praticamente todos os sites usam um formulário para permitir que os usuários concluam uma tarefa. Seja sua empresa de comércio eletrônico, baseada em serviços ou mesmo apenas uma vitrine on-line, provavelmente incluirá um formulário. No entanto, os formulários podem ser complicados para pessoas com deficiência. Existem várias considerações técnicas (leia-se: aquelas para os desenvolvedores implementarem), bem como não técnicas, que os profissionais de marketing sem conhecimento de codificação podem seguir facilmente. Aqui estão as práticas recomendadas não técnicas:

  • Mantenha os formulários curtos e simples – Obtenha informações de contato do cliente e, em seguida, construa um relacionamento para envolvê-los e obter mais conhecimento adicional
  • Forneça instruções claras e rótulos visíveis – Ninguém gosta de um formulário confuso
  • Validar entradas (desfazer alterações/confirmar) – Notificar os usuários sobre quaisquer problemas e como corrigi-los
  • Notificação do usuário (sucesso/falha) – Informe aos usuários se o envio do formulário foi bem-sucedido ou não
  • Adote várias páginas ou progressivo – Se você deve ter um formulário mais complicado, procure um formulário de várias páginas ou progressivo que não sobrecarregue os usuários
  • Remova os limites de tempo ou forneça opções – Os limites de tempo podem ser úteis para coagir os compradores a comprar, mas adicionam estresse indevido a indivíduos com problemas graves de ansiedade

Migalhas de pão

Breadcrumbs são uma forma de navegação em seu site que permite ver como a página que você está navegando no momento se encaixa na imagem maior. Geralmente são links que levam a páginas de nível superior.

Um exemplo de trilha de navegação em um site de comércio eletrônico que vende roupas pode ser

Mulheres > Casacos > Lã > Casacos de ervilha.

Breadcrumbs são úteis para encontrar caminhos e permitem que os usuários naveguem facilmente de volta para páginas de nível superior sem iniciar sua jornada do zero.

Eles são especialmente críticos para pessoas com deficiência por várias razões. Por um lado, os usuários com deficiências cognitivas sempre se beneficiarão de uma experiência amigável que minimiza a ambiguidade. Breadcrumbs são especialmente críticos se o seu site for extenso e complicado. Breadcrumbs também orientam imediatamente os usuários de leitores de tela, tornando a navegação no site menos árdua.

Embora os breadcrumbs sejam claramente úteis para usuários com deficiências, como muitas práticas recomendadas de acessibilidade, eles melhoram a experiência de todos os usuários.

Chatbots e integrações de terceiros

Muitos sites aproveitam integrações de terceiros para seus sites, como chatbots, modais pop-up, páginas de destino dinâmicas etc.

Se sua organização optar por integrar um aplicativo de terceiros ao seu site, peça a um especialista para avaliá-lo antes de adicioná-lo. Embora você não consiga conciliar muitas das falhas de acessibilidade, pelo menos entenderá o nível de risco que está assumindo. Você também pode solicitar uma declaração de acessibilidade ou garantia de seu fornecedor para incluir em um contrato (embora você ainda deva testar o produto para verificar sua precisão antes de implementá-lo).

Como observação lateral, sempre pergunte a seus fornecedores sobre a acessibilidade de seus produtos. Quanto mais clientes solicitarem produtos acessíveis, maior será a chance de os fornecedores ouvirem e começarem a incorporar recursos de acessibilidade em suas compilações de produtos.