5 dicas de acessibilidade web para sites
Atributo ALT, tabeless, elementos para conteúdo, tags de cabeçalho hierarquizadas e botões com textos claros. Confira estas dicas de acessibilidade web!
Há pelo menos duas razões para pensarmos em acessibilidade web para site: possibilitar a pessoas com deficiência navegarem e otimizar as páginas para mecanismos de busca (SEO).
Comece pelo simples. Siga estas dicas de acessibilidade web do World Content Accessibility Guide (WCAG) – Guia Internacional de Acessibilidade para Conteúdo – em tradução livre.
1. Preencha o atributo “ALT” das imagens
Descreva brevemente o que aparece na imagem. Isso possibilita que softwares de leitura digam a pessoas cegas o que aparece. O ALT também é útil para mecanismos de busca indexarem a imagem. Um bom exemplo de ALT: “Logo da Site.com.br”.
Para preenchê-lo, ao inserir imagem na biblioteca de mídia WordPress, aparece o campo correspondente à direita.
2. Crie tabelas só para dados tabulares
Use tabelas apenas para dispor dados tabulares. Evite-as para formatar layout. Isso prejudica a navegação no site, atrasa o carregamento e dificulta a acessibilidade, inclusive de quem navega pelo celular ou tablet, entre outras desvantagens.
Temas premium WordPress, como os da Site.com.br, que são gratuitos, não usam tabelas no layout, seguindo o estilo tabeless. Além disso, são responsivos, ou seja, compatíveis com dispositivos móveis.
3. Formate textos com os elementos apropriados
Em vez de escrever “no nada” e dar espaço entre os parágrafos, o ideal é usar os elementos corretos para cada parte do texto. Os mais comuns são os cabeçalhos: títulos <h1> e subtítulos de <h1> a <h6>; e parágrafos <p>.
Novamente, quem usa WordPress, com modelos da Site.com.br, se beneficia, uma vez que esses elementos são atribuídos ao texto pelo editor visual. O usuário não mexe com códigos.
4. Hierarquize o conteúdo
Ainda nos textos, cabe ressaltar a importância de hierarquizar o conteúdo. Ao utilizar adequadamente as tags de cabeçalho, tanto os softwares de acessibilidade quanto os mecanismos de busca entenderão a estrutura do conteúdo.
Recomenda-se utilizar uma tag <h1> por página, no título principal. Os subtítulos recebem as tags de <h2> a <h6> de acordo com o grau de relevância.
5. Textos claros para os botões
Cada botão do site deve descrever claramente a função que exerce. Por mais óbvio que isso pareça, há casos em que a navegabilidade é prejudicada caso esqueça de ser claro. Perceba que há diferença entre apenas “Remover” e “Remover os campos selecionados”, e por aí vai.
Coloque essas dicas em prática com o EasyPress!
