Boas práticas de acessibilidade para aplicar no seu site - Unimed Lab

Importante! Com a atualização de versão da plataforma do Site Singular, realizada em 25 de junho de 2022, algumas mudanças ocorreram na área administrativa da ferramenta. Para conferir o que mudou, acesse o artigo Confira todas as mudanças da versão Liferay 7.3.

Olá!

Além de um bom site ser completo, ágil, bonito e intuitivo, também é importante lembrar que ele deve ser acessível. Concorda?

O Site Singular conta com o Menu de Acessibilidade para facilitar a navegação e garantir mais autonomia a usuários com diferentes tipos de deficiências. 

>> Saiba mais sobre o Menu de Acessibilidade

Mas, e quanto ao conteúdo? Como garantir que aquilo que está sendo publicado é acessível e poderá ser consumido com sucesso pelos usuários que utilizarem essas e outras ferramentas de acessibilidade?

Fique tranquilo(a)! Reunimos aqui algumas boas práticas de acessibilidade na web para sua equipe adotar na publicação de conteúdos e promover, assim, uma experiência inclusiva no seu site!

Neste artigo, você vai ver:

• Descrição da imagem
• Links bem identificados
• Vídeos com legendas
• Atenção no uso das cores
• Leitura simples
• Sites para consulta

Descrição da imagem

Não deixe de incluir o texto de descrição às imagens adicionadas ao site, para que os leitores de tela possam identificá-las e descrevê-las para usuários com deficiência visual. O Site Singular possui um campo específico para isso, tanto no componente Imagem que for inserido em alguma página, quanto no cadastro de uma Notícia que inclua imagens de capa ou de destaque, por exemplo.

Campo para descrição no componente Imagem

Campo para descrição de imagem em um Conteúdo Web - Notícia

O que escrever?

• Descreva exatamente o que você vê na imagem
• Inicie pelo formato (foto, ilustração, gráfico etc)
• Siga uma ordem lógica, da esquerda para a direita e de cima para baixo; do “macro” para os detalhes
• Se a imagem apresentar algum texto, inclua-o na descrição
• Evite adjetivos (bonito, feio, bom, mau)
• Fórmula simplificada: formato + sujeito + paisagem + contexto + ação

Exemplo:

Descrição da imagem: Fotografia de uma mulher abrindo a cortina. Sobre a foto, está o texto “Pare de rolar a tela por um momento. Corrija a postura. Respire bem fundo. Levante. Estique as pernas. Pronto!”. No canto inferior esquerdo está a tag Mude1Hábito e, à direita, o logo da Unimed.

Links bem identificados

Os links devem ser facilmente identificados, por isso, podem ser destacados em relação ao restante do conteúdo por uma cor diferente, sublinhado, negrito etc.

Eles também devem fazer sentido se lidos fora do contexto, além de deixarem clara sua função. Por isso, evite resumir o link a termos como “Saiba mais”. Prefira “Saiba mais sobre acessibilidade na web”.

Assim como descrição de imagem, o Site Singular também possui um campo específico para descrição do link no componente de Chamadas. Caso você pretenda inserir um banner que direcionará para um link externo, por exemplo, utilize esse campo para explicar o destino do link.

Exemplo:

Vídeos com legendas

Ao utilizar vídeos com texto falado, procure utilizar legendas (para pessoas com alguma perda auditiva ou surdos alfabetizados em Português).

Atenção no uso das cores

Não utilize apenas cores para destacar uma informação ou atribuir um significado, pois essa diferenciação pode não representar o efeito esperado para usuários daltônicos. Invista também em ícones, negritos, sublinhados ou tamanhos distintos para diferenciar ações.

Leitura simples

Textos com linguagem simples e estrutura clara facilitam a leitura, especialmente para pessoas com dislexia. Por isso:

• Utilize frases e parágrafos curtos
• Prefira ordem direta e voz ativa
• Evite figuras de linguagem e termos pouco usuais
• Organize as informações de maneira que mantenham uma hierarquia visual (títulos maiores do que subtítulos, subtítulos maiores do que o texto etc)
• Evite alinhamento justificado

Fontes estilizadas também podem dificultar a leitura. No entanto, o Site Singular já utiliza fontes padronizadas de acordo com a Central da Marca, que favorecem a leitura e as adaptações de visualização realizadas com o uso do Menu de Acessibilidade.
 

Sites para consulta

Esperamos ter ajudado a tirar suas dúvidas sobre o tema e contribuído para colocar em prática, agora no novo Site Singular da sua Unimed, cada vez mais princípios de acessibilidade digital.

Quer saber mais? Separamos alguns sites e publicações de referência no tema, que você pode consultar sempre que quiser saber mais sobre acessibilidade na web de maneira geral ou tirar alguma dúvida específica.

>> Movimento Web Para Todos
>> Cartilha de Acessibilidade na Web - W3C Brasil
>> Acessibilidade Legal
>> Blog Hand Talk
>> Blog da Audiodescrição
>> Acessibílito
>> Lei Brasileira de Inclusão da Pessoa com Deficiência

 

Ficou com outras dúvidas?

> Pesquise pelo que precisa aqui na Central de Ajuda, ou
> Abra um chamado para nossa equipe em: Canal do Colaborador > Aplicativos > GIU > Sistema de Gestão de Demandas > Abertura de Chamado > Sistemas e Aplicações