Os sites acessíveis são mais fáceis para uso por pessoas com deficiência com a adoção de leitores de tela e outras tecnologias assistivas. Você pode personalizar vários aspectos do seu site para facilitar a navegação.
Use este guia para aprender as práticas recomendadas para projetar e estruturar seu conteúdo.
Observação: este guia está disponível como um recurso para ajudá-lo a começar, mas não deve ser interpretado ou usado como aconselhamento jurídico. O Squarespace não pode fornecer conselhos sobre como tornar seu site compatível com leis, regulamentos ou padrões específicos de acessibilidade.
Títulos da página
A primeira coisa que os leitores de tela comunicam quando os usuários vão para uma nova página da Web é o título da página. Como os títulos das páginas são importantes para a orientação, certifique-se de que cada página tenha um título que introduza o tópico ou propósito da página e o diferencie de outras páginas do seu site.
Texto
Títulos
Os leitores de tela usam código HTML em vez de elementos visuais para entender a estrutura de uma página. Ao usar um leitor de tela, os visitantes podem navegar pelas páginas com mais facilidade quando cada seção da página tem um título. Use a barra de ferramentas de texto para formatar o texto como títulos.
Para saber mais sobre a estrutura e os títulos da página, acesse a Iniciativa de Acessibilidade da Web.
| É bom |
|
| Não |
|
Links
Certifique-se de que seus visitantes possam encontrar a finalidade de cada link apenas com o texto do link. Essa formatação beneficia os usuários do leitor de tela que podem querer alternar entre links sem perder o contexto. A formatação adequada de links também ajuda a melhorar o SEO. Você não precisa incluir a palavra link no texto do link. A maioria dos leitores de tela diz link antes de cada link. Por exemplo:
| É bom | “Para entrar em contato, acesse a nossa página de contato.” |
| Não |
“Para entrar em contato, clique aqui.” |
Espaçamento
Certifique-se de que seu texto tenha espaçamento adequado entre linhas. Desta forma, os visitantes podem substituir o espaçamento entre linhas para atender às necessidades deles e melhorar a experiência de leitura, se necessário. Você pode controlar o espaçamento das letras e a altura da linha em Estilos do Site.
Imagens
A internet é um meio visual onde as imagens podem desempenhar um papel significativo na apresentação do seu site. Certifique-se de que suas imagens estejam acessíveis aos visitantes, independentemente de habilidades deles. É importante lembrar-se de elementos como texto alternativo e como você formata imagens animadas ou .gifs.
Texto alternativo
Quando digitalizam uma página, os leitores de tela identificam as imagens e leem o texto descritivo (texto alternativo) para os visitantes. Ao adicionar texto alternativo, considere por que você decidiu usar a imagem. Por exemplo, foi para transmitir informações ou apenas para decorar? O que os visitantes com deficiência visual precisam saber sobre a imagem para ter acesso a todas as informações disponíveis para os visitantes sem deficiência visual?
Uma prática recomendada é descrever brevemente a imagem como você faria para um amigo por telefone. Imagens meramente decorativas, como gráficos que separam conteúdo ou imagens de fundo abstratas, não exigem descrições.
| É bom |
|
| Não |
|
Os .gifs animados
Você pode adicionar imagens animadas ou .gifs à maioria das áreas do site. Os .gifs animados não devem piscar três ou mais vezes no período de um segundo. Esse tipo de conteúdo pode causar convulsões ou reações físicas.
Dica: se o site estiver na versão 7.1, os visitantes poderão desativar alguns recursos animados por meio das configurações do dispositivo. Dessa forma, eles encontrarão menos movimento ao visitar seu site. Por exemplo, se um usuário de Mac optar por reduzir o movimento da tela em seu dispositivo, as animações ativadas para efeitos de imagem de fundo ou arte de fundo não aparecerão animadas para esse visitante.
Cores
Evite confiar apenas na cor para transmitir informações aos seus visitantes. As diferenças de cor podem ser perdidas por pessoas com baixa visão ou deficiências de cor, e a cor por si só não transmite significado para visitantes com deficiência visual usando leitores de tela. Para alterar as cores do seu site, use Estilos do Site.
Você pode usar as Ferramentas para desenvolvedores do Google Chrome ou o Inspetor de acessibilidade do Firefox para simular como as páginas aparecem para pessoas com problemas para ver cores. Essas ferramentas são externas e, portanto, estão fora do escopo do suporte ao Squarespace.
| É bom |
|
| Não |
|
Vídeos
Ao adicionar vídeos ao seu site, lembre-se destas dicas:
- Adicione legendas sincronizadas usando os recursos integrados de legendas ocultas para YouTube e Vimeo. Dessa forma, os espectadores podem ativar ou desativar legendas do bloco de vídeo. Acesse o YouTube e o Vimeo para obter mais informações sobre como adicionar legendas.
- Adicione não mais do que dois vídeos de fundo por página. Muito movimento pode levar a uma experiência indesejável para pessoas com sensibilidade a movimento.
- Evite conteúdo em seu vídeo que pisca três ou mais vezes no período de um segundo.
Áudio
Você pode ajudar os visitantes com deficiência auditiva a acessar seu conteúdo de áudio, como podcasts, adicionando uma transcrição. Para manter suas páginas organizadas, você pode querer incluir transcrições em páginas Não vinculadas.
Perguntas frequentes
Meu site está acessível?
Os requisitos de acessibilidade diferem em todo o mundo. Você é responsável por garantir que o site cumpra as leis vigentes, incluindo os requisitos de acessibilidade local. Uma forma de entender a acessibilidade do seu site e identificar áreas que precisam melhorar é com um especialista em acessibilidade. Você também pode consultar este checklist preliminar de acessibilidade da web. O suporte ao cliente do Squarespace não pode dar conselhos sobre o cumprimento de uma lei, regulação ou padrão relativa à acessibilidade na web.
O Squarespace está trabalhando para melhorar a acessibilidade?
Sim. O Squarespace leva a acessibilidade a sério. Estamos sempre procurando melhorar, e esse trabalho está em andamento. Estamos comprometidos em deixar nossos serviços mais acessíveis a usuários com deficiências. Estamos em processo de revisão dos nossos serviços para melhorar a experiência do usuário e facilitar para que nossos clientes deixem os sites deles mais acessíveis.
Posso personalizar o contorno do foco?
Não. Embora os sites do Squarespace na versão 7.1 tenham um recurso de contorno de foco integrado que destaca itens em uma página, como links de navegação e campos de formulário, o contorno de foco é padrão em todos os sites e páginas. Não é possível personalizar a cor ou a espessura da linha. O contorno aparece quando os visitantes do site pressionam Tab no teclado. Na primeira vez que você pressiona Tab, uma mensagem Pular para conteúdo é exibida. Pressione a barra de espaço para pular o cabeçalho e a navegação do site e vá diretamente para o conteúdo do site ou continue pressionando Tab para navegar para outro conteúdo.
