Ir para o conteúdo principal
acessibilidade · declaração de conformidade

Acessibilidade

Esta plataforma adota práticas contínuas de acessibilidade digital. As adaptações aqui descritas refletem o estado atual do sistema e serão aprimoradas à medida que novos ciclos de avaliação forem realizados, incluindo testes com pessoas usuárias do sistema.

▸ processo contínuo

Acessibilidade como processo, não produto

A acessibilidade digital não se esgota em uma lista de correções técnicas. Ela é construída por ciclos iterativos que combinam análise automatizada, revisão manual de código, testes com tecnologias assistivas e, fundamentalmente, avaliação com pessoas que dependem dessas tecnologias no cotidiano.

Esta plataforma passou por oito ciclos de auditoria técnica conduzidos durante seu desenvolvimento, nos quais foram identificadas e corrigidas barreiras de acesso com base nas normas listadas abaixo. No entanto, reconhecemos que testes com leitores de tela reais (como NVDA, JAWS ou VoiceOver), com usuários com deficiência visual, motora ou cognitiva, ainda são necessários para mensurar a efetividade das adaptações realizadas.

Contribuições, relatos de barreira e sugestões de melhoria são bem-vindos e podem ser encaminhados ao responsável pelo projeto.

▸ normas de referência

Padrões adotados

WCAG 2.1 / 2.2Nível AA
Web Content Accessibility Guidelines
W3C / WAI

Referência internacional para acessibilidade de conteúdo web. Organizada em quatro princípios: Perceptível, Operável, Compreensível e Robusto.

www.w3.org/WAI/WCAG22/quickref/ (abre em nova aba)
eMAG 3.1Obrigatório (gov.br)
Modelo de Acessibilidade em Governo Eletrônico
Governo Federal do Brasil

Adaptação brasileira das WCAG para portais e sistemas de governo. Inclui recomendações específicas para o contexto nacional, como suporte ao leitor de tela NVDA com Firefox.

emag.governoeletronico.gov.br/ (abre em nova aba)
ABNT NBR 17060Norma brasileira; 2022
Acessibilidade em Interfaces Digitais
ABNT

Norma técnica brasileira que estabelece requisitos de acessibilidade para interfaces digitais, alinhada ao contexto jurídico da Lei Brasileira de Inclusão (Lei nº 13.146/2015).

www.abntcatalogo.com.br/ (abre em nova aba)
LBILei nº 13.146/2015
Lei Brasileira de Inclusão da Pessoa com Deficiência
Presidência da República

Determina que serviços de informação e comunicação, incluindo sítios eletrônicos, sejam acessíveis às pessoas com deficiência.

www.planalto.gov.br/ccivil_03/_ato2015-2018/2015/lei/l13146.htm (abre em nova aba)
▸ adaptações implementadas

O que foi feito

Percepção
WCAG 1.x · eMAG 2
  • Contraste de cores revisado: cor primária (lilás) ajustada para razão ≥ 4,5:1 tanto no tema escuro quanto no claro, atendendo WCAG 1.4.3.
  • Todos os gráficos Recharts (barras, radar, dispersão, área) envolvidos com componente ChartWrapper que adiciona role="img" e aria-label descritivo.
  • Mapa coroplético do Brasil com aria-label no elemento SVG e tabIndex em cada unidade federativa para navegação por teclado.
  • Todas as tabelas de dados com <caption> invisível ao visual mas lido por leitores de tela, descrevendo o conteúdo tabular.
  • Ícones Lucide decorativos marcados com aria-hidden="true"; ícones funcionais com aria-label explícito.
  • Tamanho mínimo de todos os textos de interface revisado: labels, metadados e badges elevados de 9–10 px para 11–12 px, atendendo a recomendação de legibilidade do eMAG (ciclo 5).
  • Textos de ticks e labels em gráficos SVG elevados de 8–10 px para 10–12 px em todas as visualizações (cruzamentos, linhas de pesquisa, visão geral), assegurando legibilidade em telas de baixa densidade (ciclo 6).
  • Colunas de barra visual nas tabelas de Cruzamentos e Avaliação CAPES marcadas com aria-hidden="true", impedindo que leitores de tela descrevam elementos gráficos decorativos sem conteúdo textual (ciclo 7).
  • Contraste do texto secundário (muted-foreground) no tema escuro recalibrado de ~3,2:1 para ≥5:1 sobre superfícies e ~6:1 sobre o fundo; disclaimers e legendas em texto pequeno agora atendem WCAG 1.4.3 para texto normal (ciclo 8).
  • Varredura em toda a plataforma: nuvens de termos, grafos e mapas de calor passaram a expor seus valores por texto alternativo (sr-only/aria-label); categorias e tendências (perfil docente, trajetória de conceito, coortes) deixaram de depender exclusivamente de cor, ganhando rótulo textual (ciclo 8).
Operabilidade
WCAG 2.x · eMAG 4
  • Skip link 'Ir para o conteúdo principal' visível ao receber foco por teclado, permitindo pular o menu de navegação.
  • Indicador de foco visível global implementado via :focus-visible com contorno de 2 px na cor do anel de foco.
  • Navegação sequencial entre páginas com botões Anterior / Próximo ao final de cada seção.
  • Botão ⓘ nos cartões de estatísticas com aria-expanded e acionamento por teclado (Enter/Espaço), além de comportamento hover para mouse.
  • Alvo tátil mínimo de 24 × 24 px (WCAG 2.5.8 Nível AA) respeitado em controles pequenos.
  • Animação do ticker decorativo suspensa automaticamente quando prefers-reduced-motion está ativo (WCAG 2.2.2).
  • Links 'texto completo' em publicações de linhas de pesquisa elevados para tamanho de texto legível com altura mínima de 24 px, melhorando o alvo de toque em dispositivos móveis (ciclo 5).
  • Ícones identificadores (Lattes, ORCID) na página de contato ampliados para área mínima de 24 × 24 px (ciclo 5).
  • Cabeçalhos sortáveis em tabelas de docentes e financiadores receberam tabIndex={0}, onKeyDown (Enter/Espaço) e aria-sort dinâmico, tornando a ordenação acessível por teclado (ciclo 6).
  • Lista de top 100 orientadores por linha de pesquisa convertida para elemento semântico <ol>/<li>, tornando a estrutura de ranking interpretável por tecnologias assistivas; número de posição marcado com aria-hidden="true" e contagem de orientações com aria-label explícito (ciclo 7).
  • Contêiner de rolagem da lista de orientadores recebeu tabIndex={0} e aria-label explícito, tornando a região navegável e anunciável por teclado sem depender exclusivamente do ponteiro (ciclo 7).
  • Assistente de IA: a área de conversa (role="log") recebeu tabIndex={0}, tornando-se navegável por teclado; o foco retorna ao campo de entrada após cada envio; campo de mensagem e botões Enviar e Nova conversa elevados para alvo de toque de 44 × 44 px (ciclo 8).
  • Indicador de digitação do assistente passou a respeitar prefers-reduced-motion, suspendendo a animação quando o usuário sinaliza preferência por movimento reduzido (WCAG 2.2.2, ciclo 8).
  • Nós interativos de grafos e do mapa (redes de colaboração, coautoria, similaridade e drill-down territorial) tornaram-se acessíveis por teclado (role="button", tabIndex, Enter/Espaço, aria-pressed); blocos expansíveis (anatomia, cards de trajetória, listas) foram convertidos em button com aria-expanded/aria-controls; contêineres roláveis receberam foco por teclado; sliders e alvos de toque de controles menores foram rotulados e ampliados para ≥24 px (ciclo 8).
Compreensão
WCAG 3.x · eMAG 6
  • Atributo lang do elemento <html> atualizado dinamicamente ao trocar o idioma da interface (PT-BR, EN, ES), garantindo que leitores de tela utilizem a pronúncia correta.
  • Todos os campos de busca com aria-label derivado automaticamente do placeholder via componente SearchInput.
  • Todos os elementos <select> de filtro com aria-label explícito descrevendo a dimensão filtrada.
  • Seletor de cor do grafo em Cruzamentos atualizado para aria-label="Cor dos nós do grafo", tornando a finalidade do controle inequívoca para leitores de tela (ciclo 5).
  • Todos os elementos <th> de tabelas de dados receberam scope="col" explícito, permitindo que leitores de tela associem corretamente células de dados aos seus cabeçalhos de coluna (ciclo 6).
  • Input range do grafo de similaridade TF-IDF recebeu aria-label descritivo com unidade e intervalo (ciclo 6).
  • Elementos <section> sem nome acessível nas rotas Visão Geral e Sobre receberam aria-label, melhorando a navegação por landmarks (ciclo 6).
  • Botão de menu móvel recebeu aria-label correto em espanhol; regressão multilíngue corrigida (ciclo 6).
  • Links externos com target="_blank" incluem aviso <span class="sr-only"> (abre em nova aba)</span> para usuários de leitor de tela.
  • Hierarquia de cabeçalhos (h1 → h2 → h3) mantida consistente em todas as páginas.
  • Componente PanelHeader com prop level para controle semântico do nível de cabeçalho (h2/h3/h4).
  • Grades que simulavam tabelas passaram a usar <table> semântica; a coluna identificadora (programa, docente ou ano) recebeu <th scope="row"> nas tabelas largas; alternadores de dimensão e de ordenação passaram a expor o estado ativo via aria-pressed/aria-sort (ciclo 8).
Robustez
WCAG 4.x · eMAG 6
  • Landmark de navegação <nav> com aria-label em PT, EN e ES no menu lateral.
  • Grupos de links no menu marcados com role="group" e aria-label.
  • Link ativo no menu com aria-current="page".
  • Elemento principal da página com id="main-content" e tabIndex={-1} para receber foco do skip link.
  • Breadcrumb semântico com <nav>, <ol> e aria-current="page" no item corrente.
  • Botões de tema e idioma com aria-label explícito; dimensão visual compacta (26 × 26 px) com área de toque estendida para 44 × 44 px via pseudo-elemento invisível, atendendo ao alvo de 44 px recomendado (ciclo 8).
  • Divergência de hidratação SSR na classe de tema do <html> eliminada: default do tema unificado entre servidor e cliente e suppressHydrationWarning aplicado ao elemento raiz, removendo o único aviso de hidratação do console (WCAG 4.1.1, ciclo 8).
  • Saneamento técnico transversal: frações de opacidade que rebaixavam o contraste de textos informativos foram removidas, e erros latentes de tipagem e um aviso de renderização (chaves de lista) foram corrigidos, reduzindo ruído que pode afetar a estabilidade percebida por tecnologias assistivas (ciclo 8).
  • Meta descriptions em todas as 29 rotas para melhoria do contexto em ferramentas de navegação e leitores de tela.
▸ limitações conhecidas e próximos passos
  • ·Testes com usuários reais utilizando tecnologias assistivas (NVDA, JAWS, VoiceOver, TalkBack) ainda não foram realizados; são necessários para validar a experiência de uso.
  • ·Visualizações complexas como grafos de rede e matrizes de similaridade oferecem alternativa textual parcial (via aria-label no container), mas não expõem todos os dados programaticamente.
  • ·As respostas do assistente de IA são geradas automaticamente e podem conter imprecisões; embora a interface seja acessível, o conteúdo gerado deve ser confirmado nas abas e fontes originais.
  • ·Modo de alto contraste do sistema operacional não foi testado formalmente.
▸ reporte uma barreira

Se você encontrar uma barreira de acessibilidade nesta plataforma, entre em contato com o responsável pelo projeto. Seu relato contribui diretamente para os próximos ciclos de melhoria.

Ir para a página de contato