AbacatePay / AbacatePay/ecosystem

Botão "Carregar mais" sem aria-expanded, não anuncia estado para leitores de tela

Abierto
#39 1 comentario 0 reacciones 0 asignados Ver en GitHub
Lenguaje dominante
TypeScript
Estrellas
8
Forks
5
Métricas de merge de PR
Sin PR fusionados en 30 d

Descripción

**Descrição:**
O botão que expande a seção de cards adicionais (SDKs, Ferramentas, ChangeLog, CLI, AI) na página `/pages/start/welcome` alterna conteúdo visível via JavaScript, mas não expõe o estado (expandido/recolhido) para tecnologias assistivas.

**Elemento:** ``

O texto do botão muda visualmente ("Carregar mais" ↔ "Mostrar menos"), mas isso é só cosmético — não há atributo `aria-expanded` no elemento, então leitores de tela não informam ao usuário se o conteúdo associado (`id="card-11"`) está visível ou oculto.

![IMG_20260719_125358.jpg](https://github.com/user-attachments/assets/cf52d255-3961-43d7-9c15-edf6fd51d1c2)

**Por que isso precisa ser corrigido:**
- Sem `aria-expanded`, um usuário de leitor de tela clica no botão e não tem confirmação de que algo mudou na página — a experiência fica incompleta ou confusa.
- É um requisito coberto pela WCAG 2.1 (critério 4.1.2 - Name, Role, Value), que exige que o estado de componentes interativos seja programaticamente determinável.
- É uma correção pequena e de baixo risco (adicionar um atributo), com impacto direto em acessibilidade — bom equilíbrio de esforço vs. benefício.

**Sugestão de correção:**
Adicionar `aria-expanded={isHidden}` no ``, e `aria-controls="card-11"` apontando para o container expandido, atualizando o valor a cada clique junto com a troca de texto já existente.

Guía de contribución

Abrir la guía de contribución

Evaluación

Este issue todavía no se ha evaluado.

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.