@AdrianoEscarabote
Posted
Olá Emilly, Tudo bem??
Bem-vinda a comunidade do Front-end Mentor!!
Gostei muito do resultado do seu componente, mas tenho algumas dicas que pode ser útil:
Você usou <br>
. Usar <br>
não é apenas uma má prática, é problemático para pessoas que navegam com o auxílio de tecnologia de leitura de tela. Leitores de tela podem anunciar a presença do elemento. Isso pode ser uma experiência confusa e frustrante para a pessoa que está utilizando o leitor de tela.
Como este projeto é baseado em um único componente de página, não há necessidade de uma tag h1
. No entanto, é sempre uma boa ideia evitar erros de acessibilidade, por isso acredito que seria benéfico para você adicionar um h1
neste componente. Não se preocupe se você esquecer do h1
, mas é uma boa prática quando você estiver desenvolvendo sites maiores.
Quando estou fazendo algum desafio que é só um componente eu gosto de fazer isso:
<h1 class="sr-only">Qr code component</h1>
.sr-only {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0, 0, 0, 0);
white-space: nowrap;
border-width: 0;
}
fazendo isso você terá um titulo visivel apenas para leitores de tela!
O resto está ótimo !!
espero ter ajudado.
Marked as helpful
@emillymoitinho
Posted
Olá Adriano, tudo bem e com você?
Muito obrigada pelo feedback e pelas dicas!!
@AdrianoEscarabote