Torne os dados do gráfico mais claros e acessíveis com técnicas de estilo adicionais, em vez de depender apenas da cor.
Comece: adicione um gráfico ao seu design acessível
Crie um gráfico em uma tela de design acessível .
Selecione ou clique em "Gráficos " na barra lateral esquerda para adicionar um gráfico ou tabela à tela de design.
Use rótulos de texto além de uma legenda
Legendas e rótulos de texto tornam os dados em um gráfico mais claros para os leitores , tornando os dados mais visíveis e fáceis de identificar.
Selecione ou clique no gráfico para abrir o menu Editar gráfico na barra de ferramentas superior.
Selecione ou clique em Editar gráfico para abrir as opções de configuração do gráfico, incluindo Dados e Configuração, no painel de sobreposição à direita.
Selecione ou clique na guia " Configuração ". Alterne a legenda para garantir que ela seja exibida no gráfico.
Use contraste de cor suficiente
Certifique-se de que a taxa de contraste de cores dos rótulos e outros textos visíveis no gráfico atendam às diretrizes WCAG conforme identificadas pela ferramenta Taxa de contraste no Venngage Editor.
Selecione ou clique no gráfico para abrir o menu Editar gráfico na barra de ferramentas superior.
Selecione ou clique em Editar gráfico para abrir as opções de configuração do gráfico, incluindo Dados e Configuração, no painel de sobreposição à direita.
Selecione ou clique na guia " Configuração ".
Altere a cor de diferentes elementos do gráfico:
-
Estilo do gráfico (cores de barra ou linha)
-
Linhas de grade (linhas de fundo visíveis atrás das grades
-
Eixo horizontal
-
Eixo vertical
-
Etiquetas
-
Cor do texto da legenda
Selecione ou clique no quadrado do seletor de cores ao lado do elemento e verifique a Taxa de contraste na parte inferior do menu do seletor de cores.
Altere a cor clicando no seletor de cores ou digitando um código hexadecimal no campo de texto hexadecimal. A pontuação da taxa de contraste será atualizada automaticamente quando a cor for alterada.
Use espaço em branco entre as colunas do gráfico
Certifique-se de que o espaçamento entre gráficos de colunas e linhas seja suficiente para ler o texto e ver as diferentes colunas, legendas e rótulos de dados.
Redimensione o gráfico selecionando-o com a barra de espaço (teclado) ou clicando sobre ele (mouse) para selecioná-lo; em seguida, use as setas do teclado (teclado) ou segure e arraste (mouse para alterar o tamanho.
Use padrões ou ícones para diferenciar colunas ou linhas
Elementos adicionais, como padrões ou ícones, podem ajudar a tornar os dados em um gráfico mais claros para usuários com necessidades adicionais de acomodação visual ou cognitiva. Exiba padrões para diferenciar dados ou use ícones como rótulos de dados em seu gráfico.
Padrões de exibição para diferenciar dados
Clique duas vezes em um gráfico em seu design ou selecione " Editar gráfico " na barra de ferramentas superior para adicionar padrões aos dados do gráfico .
Selecione " Configuração ", a segunda guia no painel Editar gráfico.
Alterne " Mostrar padrões " para exibir padrões nas barras, fatias ou linhas em seu gráfico.
Os padrões estão disponíveis para todos os tipos de gráfico e são particularmente úteis para aqueles que têm problemas para diferenciar as cores .
OBSERVAÇÃO: os padrões de gráfico ficam melhores quando exportados como PNG ou PNG HD. Eles podem não ser exportados conforme mostrado no Venngage Editor ao baixar ou imprimir em PDF no navegador Chrome (estamos trabalhando nisso!). Portanto, para obter melhores resultados ao exportar em PDF, recomendamos o uso do Firefox .
Use ícones como rótulos de dados
Selecione um ícone do menu na barra lateral esquerda e coloque-o sobre ou acima de uma coluna para representar os pontos de dados. No GIF abaixo, um usuário adiciona um ícone a cada uma das colunas em um gráfico de colunas, para representar três categorias: Filmes, Videogames e Livros.
Adicione texto alternativo a todos os ícones incluídos em seus gráficos, se eles estiverem transmitindo informações cruciais ou adicionais que não estejam incluídas na descrição do texto alternativo do gráfico .
Descreva os dados no gráfico no texto alternativo e você não precisa incluir os elementos visuais adicionais.
No gráfico abaixo, "Preferências de mídia por faixa etária", aparecem ícones adicionais que ajudam a diferenciar os dados e torná-los mais claros em um piscar de olhos. Isso é útil para leitores com deficiências visuais ou cognitivas , mas os ícones podem ser marcados como decorativos quando o texto alternativo descreve os dados no gráfico .
Aqui está um exemplo de como escrever uma longa descrição de texto alternativo para o gráfico abaixo:
Gráfico de colunas "Preferências de mídia por faixa etária". Três grupos de colunas com três colunas em cada grupo representam quantas crianças, adolescentes e adultos identificaram uma categoria de mídia como sua favorita, quando puderam escolher entre videogames, filmes e tv e livros. No grupo da primeira coluna, a maioria (28) das crianças disse que gosta mais de filmes e tv, seguida por videogames (24) e a menor quantidade de crianças (12) que escolheu os livros como favoritos. No grupo da segunda coluna, 30 adolescentes escolheram videogames em vez de filmes e tv (18) e livros (9). Os adultos, representados no grupo da coluna final, tendiam a preferir livros, com 22 identificando-os como sua forma preferida de mídia; 12 adultos identificaram filmes e tv como favoritos; e 8 adultos disseram que gostaram mais de videogames.
Observe que a descrição não inclui os ícones decorativos, pois eles não transmitem informações adicionais que não sejam capturadas nos próprios dados do gráfico. Para obter mais informações sobre o que incluir ou omitir, confira nosso artigo sobre como escrever um texto alternativo útil .