10 princípios básicos para orientar o design da web inclusivo

Estudos mostraram que cerca de 70% dos sites são pelo menos parcialmente ilegíveis com tecnologia assistiva.

Essa estatística parece chocante. Como é que tantas marcas renunciam a considerações óbvias para os milhões de usuários com deficiência da Internet?

Quando consideramos a frequência com que as pessoas com deficiência se tornam invisíveis na sociedade e nas empresas, isso, infelizmente, começa a fazer mais sentido.

As Diretrizes de Acessibilidade de Conteúdo da Web (WCAG) definem como os sites podem melhorar sua acessibilidade e, portanto, sua inclusão.

Muitas dessas diretrizes estão se tornando consagradas por lei, portanto, sua empresa pode estar em risco se seu site não estiver acessível.

Os benefícios da inclusão para sua empresa e clientes são enormes.

A acessibilidade dará a você uma maior participação no público, mas também é fundamental para construir a confiança do cliente.

Todos os clientes, deficientes ou não, se beneficiarão de uma experiência de site mais tranquila. Eles apreciarão uma empresa que se preocupa com esta experiência.

Inclusão significa considerar a gama de necessidades de seus clientes e como o acesso deles ao seu serviço pode ser limitado. A implementação bem-sucedida de recursos de acessibilidade o ajudará a superar esses limites.

Embora este artigo se concentre no design de sites, lembre-se de que um dos principais problemas de acessibilidade é a falta de acesso à Internet, portanto, você deve procurar aumentar a disponibilidade em todas as áreas.

As tecnologias de telefone, como opções de chamada de conferência discada, podem ajudá-lo a manter contato remoto com todos os seus clientes.

Agora, vamos examinar esses dez princípios básicos para orientar o design inclusivo na web.

Diretrizes de Design Inclusivo

1. Seja flexível

O termo 'deficiência' cobre uma vasta gama de experiências e necessidades humanas. Isso pode ser intimidante ao considerar como tornar seu site acessível e inclusivo.

No entanto, tenha em mente que todos os seus clientes, deficientes ou não, chegam ao seu negócio com necessidades e preferências muito diferentes.

É verdade que você não pode agradar a todos, mas pode oferecer uma experiência flexível para alcançar o maior número possível de clientes.

Considere o contexto em que os usuários acessam seu site. Por exemplo, que tipo de dispositivo eles estão usando? Eles são mais propensos a usar seus serviços no trabalho ou em casa?

Crie um perfil de seus clientes para determinar seus dados demográficos, como idade e sexo. Esta é uma das chaves para entender a melhor plataforma de comércio eletrônico ou designs de página para o seu negócio.

Sua melhor opção, tanto para satisfazer seus clientes existentes quanto para alcançar novos, é a flexibilidade.

Oferece uma variedade de opções de contato online e offline. Entrar em contato com sua empresa e usar seus serviços deve ser fácil e indolor. Isso beneficia todos os seus clientes, não apenas aqueles com necessidades adicionais.

2. Evite clientes opressores

Embora um certo nível de conteúdo em movimento possa ajudar a tornar seu site popular, muitos conteúdos podem causar ansiedade e pressurizar. Para usuários com necessidades de saúde mental, como ansiedade, autismo ou TDAH, essas questões são especialmente pertinentes.

O WCAG tem diretrizes claras sobre a movimentação de conteúdo. O conteúdo móvel (ou seja, GIFs, feeds de notícias com rolagem e atualização automática e assim por diante) deve ter um mecanismo de pausa se iniciar automaticamente, durar mais de cinco segundos e for paralelo a outro conteúdo.

Dependendo do seu público, você pode querer considerar abrir mão do conteúdo de reprodução automática. Pense em seus clientes mais antigos que podem não estar acostumados com serviços da web.

Muita informação comovente e urgente é desanimadora e opressora.

Muitos sites hoje em dia têm um pop-up de chat ao vivo assim que você entra no site. Isso tem seus benefícios como uma ferramenta de contato facilmente acessível. No entanto, pode ser irritante se uma mensagem aparecer imediatamente toda vez que você usar o site.

Em vez de um pop-up, você poderia ter uma opção de bate-papo ao vivo dobrável e sinalizada em uma posição discreta. Forçar o contato com seus clientes assim que eles chegam pode ser muito pressurizante.

Isso também deve se aplicar ao uso de aplicativos de mensagens de texto pela sua empresa. Não sobrecarregue seus clientes com notificações.

3. Use uma tipografia clara

O WCAG é claro sobre os requisitos de tipografia:

• Mantenha o texto alinhado à esquerda ou à direita (não justificado)
• O espaçamento de linha e parágrafo deve ser de pelo menos 1,5x
• A largura máxima do parágrafo é de 80 caracteres

Você deve sempre seguir essas diretrizes, mas pode ir além para beneficiar mais seus clientes.

Use uma fonte clara, sem serifa, de bom tamanho e contrastando com a cor de fundo. A linguagem deve ser simples e direta, sem condescender com seus clientes.

Use sua pesquisa de cliente para determinar o que os clientes esperam de seu site.

Outra preocupação importante é o texto dentro das imagens. Isso deve ser evitado sempre que possível.

Usuários cegos e deficientes visuais costumam usar software de leitura de tela. Esses programas lêem o texto na tela em voz alta, mas não conseguem decodificar as imagens.

Seus clientes podem, portanto, perder informações importantes se o texto estiver "escondido" dentro de uma imagem. É importante que seus clientes com deficiência visual não sintam que o acesso ao seu site é limitado.

4. Torne as imagens acessíveis

Claro, as imagens ainda são essenciais para um bom web design. E, por outro lado, eles podem aumentar a acessibilidade para outros clientes.

Para aqueles com deficiência de leitura, como dislexia, imagens relevantes podem melhorar a compreensão do texto. As imagens quase certamente serão necessárias para algumas áreas do seu site, como páginas de produtos.

Você ainda pode tornar as imagens acessíveis para usuários de leitores de tela. O texto alternativo deve ser incluído para todas as imagens em seu site. Este é o texto que aparece quando você passa o mouse sobre uma imagem com o cursor.

Também é lido por leitores de tela, que não podem mostrar a imagem em si. O bom texto alternativo descreve a imagem exibida com clareza e precisão.

É fácil colocar texto alternativo em seu site com HTML. A inclusão de texto alternativo não atrapalhará outros usuários e beneficiará enormemente aqueles que usam leitores de tela. Texto alternativo e imagens acessíveis também podem ser benéficos para as classificações do mecanismo de pesquisa.

Além do texto alternativo, é importante que as próprias imagens sejam apresentadas de forma acessível. Para fins do WCAG, o contraste de cor é medido como uma proporção. Existem muitos aplicativos e extensões de navegador que podem ser usados ​​para medir essa proporção.

Embora as imagens incidentais para decoração não tenham requisitos de contraste, o texto sobre o fundo deve ter uma relação de contraste de 4,5: 1. Itens gráficos, como gráficos e elementos da interface do usuário, como ícones clicáveis, têm um requisito de 3: 1.

Por último, quase 1 em cada 20 pessoas é daltônica. Pense em quais combinações de cores podem ser problemáticas para esses usuários.

Existem muitos tipos diferentes de daltonismo. Os aplicativos podem ser usados ​​para simular como seu site aparece para usuários daltônicos. Melhor ainda, entre em contato com pessoas com daltonismo ou outras deficiências visuais para descobrir como seu site pode ser usado.

5. Garanta a acessibilidade da tela de toque

É fácil cair na armadilha de acreditar que seu site para desktop é o 'padrão'. O uso de smartphones e tablets continua a aumentar entre todos os usuários devido à sua conveniência. Esses dispositivos também são geralmente mais baratos do que laptops ou desktops.

Considere a acessibilidade do seu site para usuários de baixa renda e preste atenção ao seu site para celular.

Tocar e deslizar deve ser fácil e intuitivo. O propósito de seus links deve ser claro e você deve tentar minimizar a utilização indevida.

Lembre-se de que um dedo é muito maior do que um cursor e obscurece a visão da tela do usuário. Você pode fazer isso com botões de bom tamanho e bem espaçados. O WCAG exige um tamanho de botão de 44 x 44 pixels.

Considere as necessidades físicas dos clientes com a otimização da tela de toque. Deficiências podem significar que os clientes têm destreza física ou resistência física limitada, portanto, evite requisitos de toque prolongados ou complicados.

O gesto de 'beliscar', muitas vezes necessário para fazer zoom ou girar, pode ser desgastante até mesmo para usuários sem deficiência. Em vez disso, você pode querer um botão de zoom tocável, um ótimo sinal de que você se preocupa com o conforto de seus clientes.

6. Garanta uma entrada fácil do usuário

Isso está intimamente ligado à área de acessibilidade da tela de toque.

Os formulários em seu site (para fazer pedidos, entrar em contato, abrir uma conta e assim por diante) devem ser fáceis para seus clientes. Certifique-se de que todas as caixas estejam claramente identificadas com a entrada necessária.

Você também pode colocar marcadores de posição em caixas para exemplificar o que os clientes devem inserir. Por exemplo, um endereço de e-mail de espaço reservado como [e-mail protegido]

Mesmo com os designs mais acessíveis, sempre há espaço para erros humanos. É importante que seu site seja tolerante a erros de entrada. Não faça seus clientes se sentirem estúpidos por erros e torne-os fáceis de corrigir.

A melhor maneira é destacar os erros em tempo real, para que os clientes não tenham que rolar para trás em longos formulários. Não confie apenas na cor para mostrar erros; isso pode não ser acessível para usuários com deficiência visual.

Torne as mensagens de erro claras, não enigmáticas e dê aos clientes a opção de uma verificação final antes de enviá-la.

A tolerância a erros não melhora apenas a acessibilidade do seu site. Também faz com que os clientes se sintam apoiados em todas as etapas de suas negociações com você.

Tornar os formulários intuitivos e inclusivos é uma das muitas maneiras de construir a confiança de seus clientes, mostrando que se preocupa com a experiência deles.

7. Objetivo de simplicidade informativa

A transmissão de informações claramente beneficia todos que usam seu site. Ajuda pessoas com dificuldades de aprendizagem ou leitura, usuários com deficiência visual, usuários sem deficiência e sua própria equipe.

Informações claras em seu site irão reduzir a pressão sobre suas equipes de atendimento ao cliente, reduzindo o número de consultas de esclarecimento.

Os parágrafos devem ser curtos e o vocabulário não deve ser mais complicado do que o necessário. Não se intimide em usar termos específicos do setor que seus clientes entenderão, mas seu site não é o lugar para usar esse vocabulário SAT.

Elimine a ambigüidade sempre que possível. Seu significado exato deve ser sempre claro e as funções dos links em seu site devem ser rotuladas com exatidão.

Procure um design minimalista que enfatize o que é mais importante para seus clientes.

8. Mantenha a consistência

Para alguns clientes com deficiência, a mudança pode ser chocante. Embora não haja problema em atualizar seu site à medida que sua marca evolui, mudanças frequentes e desnecessárias provavelmente afastarão os clientes.

Quando parece que a identidade da sua marca está constantemente mudando de forma, é menos provável que seus clientes confiem em você.

A consistência também deve ser mantida no lado do serviço ao cliente.

Soluções como rede definida por software podem ajudá-lo a manter um serviço coeso. Mantenha um tom amigável e aberto para garantir que todos os seus clientes se sintam apoiados.

Alguns clientes podem precisar que as informações sejam repetidas com mais frequência. Sua equipe de CS deve estar preparada para isso, mas também vale a pena considerar tornar as informações mais acessíveis.

Os recursos de acessibilidade, como contraste de cor e texto alternativo, devem ser consistentes em todas as áreas do seu site.

Pode ser tentador oferecer uma versão completamente diferente de seu site para usuários com deficiência. No entanto, isso pode ser diferente e fazer esses clientes se sentirem um fardo. Em vez disso, integre a acessibilidade em seu site desde o início, para o benefício de todos os seus clientes.

9. Mantenha seu site tranquilo

Outro problema de acessibilidade é o fato de que nem todos terão acesso a internet rápida ou hardware poderoso.

Clientes em áreas rurais, em países em desenvolvimento ou clientes de baixa renda podem ter problemas com seu site.

Projete seu site para que os usuários possam escolher se desejam visualizar conteúdo que consome dados, como vídeos. Há muitas maneiras de reduzir o atraso em seu site para beneficiar esses clientes.

Considere, novamente, como os clientes estão acessando seu site.

Pense nos dispositivos que eles estão usando e em quais áreas geográficas estão. Independentemente de como os clientes visualizam seu site, eles devem desfrutar de uma experiência sem esforço. Você não quer que seus clientes sintam que usar seu site é uma tarefa complicada.

Garanta uma codificação rígida e de alta qualidade para reduzir erros frustrantes. Tente reduzir o número de páginas nas quais seus clientes devem clicar ao realizar tarefas.

Mantenha os formulários com o mínimo de páginas possível. Ninguém gosta de esperar que novas páginas sejam carregadas a cada poucos segundos, principalmente se a conexão for ruim.

10. Crie uma hierarquia visual no design do site

Um traço comum em muitos dos melhores designs de sites é uma hierarquia visual clara. Isso significa que a navegação é fácil e é óbvio quais etapas os usuários devem seguir para diferentes tarefas.

Você pode analisar o uso que os clientes fazem do seu site e colocar em primeiro plano os recursos mais usados. Evite 'lado a lado', pois isso é facilmente opressor e não é particularmente claro.

Você pode agrupar recursos relacionados com opções de design unificadoras, como cor e forma. No entanto, você não deve confiar apenas nesses recursos. Conforme discutido, eles podem estar inacessíveis. Use texto também, para fins de leitores de tela.

O objetivo da hierarquia visual é tornar mais rápido e fácil para seus clientes usar e navegar em seu site.

Use suas opções de design para direcionar os clientes às seções relevantes do seu site. Entenda as necessidades de seus clientes e enfatize o que é mais importante para eles

Palavras finais sobre inclusividade

Em última análise, a filosofia por trás da acessibilidade e inclusão é que os usuários com deficiência são tão valiosos quanto qualquer outro usuário. Isso pode parecer óbvio, mas um número surpreendente de marcas não consegue colocar isso em prática com o design de seus sites.

Esforçar-se para garantir que todos os seus clientes tenham uma boa experiência gerará confiança e lealdade em sua base. Seus clientes ficarão mais felizes e você se destacará como uma empresa que realmente se preocupa.

Biografia do autor

John Allen é Diretor de SEO Global na RingCentral, um provedor global de software UCaaS, VoIP e discador automático. Ele tem mais de 14 anos de experiência e um amplo background na construção e otimização de programas de marketing digital. Ele escreveu para sites como Vault e 3DCart.