Feedback
Esqueleto de carregamento
Skeleton screen
Blocos provisórios que antecipam o formato do conteúdo enquanto ele carrega.
Exemplo didático · Representação visual do padrão
Quando usar
Manter a estrutura de uma lista ou página visível durante uma espera.
Cuidados e acessibilidade
Marque a região como ocupada e respeite a preferência por movimento reduzido.
Partes e comportamento
Blocos que representam a estrutura prevista. Devem ser substituídos pelo conteúdo real.
Não confunda
Um spinner indica espera genérica; skeleton antecipa a estrutura do que será exibido.
Exemplo de código
<section aria-busy="true" aria-label="Projetos">
<div class="skeleton" aria-hidden="true"></div>
</section>
<!-- Ao concluir, substitua os blocos e mude aria-busy para false. -->Trecho didático. Integre e teste no contexto do seu projeto.