Como criar formulários de registro compatíveis com a ADA
O que você vai aprender
Saiba como usar os recursos do assistente de acessibilidade no painel de Alertas do editor de formulário de registro para evitar alguns dos problemas de conformidade com as Diretrizes de Acessibilidade para Conteúdo Web (WCAG) mais comuns. As empresas que buscam tornar seus sites compatíveis com a ADA devem consultar e seguir os padrões da WCAG. O assistente de acessibilidade orienta você na criação de formulário de registro acessíveis para todos os visitantes do seu site.
As normas WCAG têm como objetivo tornar o conteúdo da web mais acessível para todos, incluindo pessoas com deficiência. A acessibilidade do site é uma exigência legal em muitos países, e implementar as normas WCAG pode ajudar a atender a muitas dessas necessidades de acessibilidade. Observe que, embora o assistente de acessibilidade tenha sido criado para ajudar a identificar problemas de acessibilidade de acordo com as normas WCAG 2.0 Advanced Analytics, conforme se aplicam aos formulários de registro, ele pode não conseguir identificar todos os requisitos de acessibilidade devido a limitações conhecidas da tecnologia existente ou a outros fatores independentes da tecnologia. O uso do assistente de acessibilidade pode ajudar com os requisitos de acessibilidade da web, mas não garante conformidade com as leis aplicáveis. Para confirmar as implicações legais e os requisitos de acessibilidade da web, recomendamos buscar a orientação de um advogado qualificado.
Antes de começar
Abaixo está uma lista de problemas que o assistente de acessibilidade vai verificar. Observação: os tipos de erro listados abaixo são como o assistente de acessibilidade da Klaviyo os identifica, e não nomes específicos de campo de dados no criador de formulários. Se um erro for detectado, um alerta com uma descrição e uma instrução de correção vai aparecer no painel Alertas.
Tipo de erro | Descrição |
Nome do botão | Garante que os botões tenham texto discernível. |
Texto alternativo da imagem | Garante que os elementos de imagem tenham texto alternativo (alt text) ou uma função HTML de “none” ou presentation. |
Contraste de cores | Garante que o contraste entre as cores de primeiro plano e de plano de fundo atenda aos limites de taxa de contraste da WCAG 2 Advanced Analytics. |
Link no bloco de texto | Garante que os links possam ser diferenciados do texto ao redor sem depender de cor. |
Nome do link | Garante que os links tenham texto identificável. |
Rótulo | Garante que cada elemento do formulário tenha um rótulo. |
Crie um formulário de registro compatível com a ADA
Seja para criar seu primeiro formulário de registro ou atualizar um formulário, o assistente de acessibilidade ajuda você a identificar e corrigir problemas de acessibilidade.
Para criar um formulário em conformidade com os padrões da WCAG listados acima:
- Crie um novo formulário de registro ou abra o editor de formulários para um dos seus formulários de registro existentes.
- Use o editor para adicionar blocos de conteúdo e estilizar o formulário para que ele se ajuste à sua marca.
O assistente de acessibilidade monitora problemas de acessibilidade enquanto você cria o formulário e registra os problemas que identifica em Alertas com atividade. Ao atualizar um formulário existente, confira Alertas com atividade para ver se há problemas não resolvidos e Alertas descartados para ver problemas que você ignorou anteriormente.
- Clique em Alertas no canto superior direito do editor para ver os problemas de acessibilidade identificados.
Em Alertas com atividade, você verá vários cards descrevendo os elementos que não atendem aos padrões das WCAG que o assistente de acessibilidade identificou no seu formulário, além de outros problemas de conteúdo ou design identificados. Cada card incluirá uma descrição do problema e um aviso para corrigir ou dispensar. Por exemplo, se uma imagem no seu formulário de registro estiver sem texto alternativo, o assistente de acessibilidade vai alertar você para adicionar texto alternativo à imagem. O texto alternativo fornece uma descrição da imagem para que os compradores que navegam pelo seu site com um leitor de tela possam acessar o conteúdo digital.
- Para um alerta com um campo de dados, insira as informações ausentes ou corrigidas no card e clique em Corrigir.
Para problemas que exigem alterações em um bloco, nos estilos ou nas configurações de teaser, leia a descrição do alerta e clique na ação exibida no card: Editar bloco, Ir para o bloco, Ir para os estilos ou Ir para o teaser. Faça as alterações sugeridas e, em seguida, volte para Alertas para verificar se ainda há problemas.
- Se você quiser ignorar uma ou mais sugestões de acessibilidade, clique em Dispensar. No modal de confirmação, clique em Dispensar para confirmar ou em Cancelar para manter o alerta com atividade.
Depois que você corrigir ou dispensar com sucesso todos os problemas identificados, você verá a mensagem “Nenhum alerta com atividade” exibida no painel Alertas.
Você pode voltar às questões ignoradas mais tarde abrindo Alertas e selecionando Alertas dispensados. Recomendamos que você corrija todos os problemas apontados no assistente de acessibilidade. A não conformidade com os padrões WCAG pode expor sua empresa a riscos legais.
Os alertas de acessibilidade não impedem a publicação, mas é recomendável resolvê-los. Outros alertas do formulário podem impedir a publicação e precisam ser corrigidos antes de você continuar. Selecione Revisar alertas no painel de publicação para voltar para Alertas e resolvê-los.
- Clique em Publicar ou agendar, selecione a opção Publicar agora e clique em Publicar agora para colocar suas atualizações de acessibilidade no ar.
Teste seu formulário com o JAWS
O JAWS é um leitor de tela para Microsoft Windows. Teste seu formulário de registro publicado com o JAWS para verificar se os visitantes conseguem ler e usá-lo.
Verifique se o JAWS lê o texto do formulário, as descrições das imagens e os rótulos dos campos. Use o teclado para navegar pelos campos, enviar o formulário com informações de contato de teste e fechá-lo, se houver um botão de fechar.
Próximas etapas
É importante manter os padrões WCAG em todos os seus formulários de registro do Klaviyo. Os formulários de registro publicados anteriormente ainda podem conter problemas de acessibilidade para você corrigir, mas saiba que o Klaviyo não corrigirá automaticamente nenhum problema que não esteja em conformidade com a WCAG.
Navegue até o painel Alertas no editor de cada um dos seus formulários existentes para resolver qualquer problema de acessibilidade e ajudar com a conformidade com as WCAG no seu site.
Recursos adicionais
- Accessibility in emails and forms best practice reference
Learn how to make your emails and sign-up forms more accessible. When designing your emails and signup forms, you’ll want to make sure your designs are accessible to all of your recipients.
- Getting started with sign-up forms
Learn how to create and customize sign-up forms in Klaviyo to publish on your website so you can engage shoppers, collect emails and phone numbers, and build long-lasting customer relationships.
- List of Axe HTML 4.5 rules