Interactive rating component item

Community feedback

• 

  Ian Farias Paixão•90

  @IanFariasPosted about 2 years ago

  Olá Ana!

  Parabéns pela solução, muito bom!!

  Tenho alguns pontos e sugestões no qual você poderia ajustar:

  1. <button class="butt" id="buttao">2</button> <button class="butt" id="buttao">3</button> <button class="butt" id="buttao">4</button> O código possui três botões com o mesmo id. Id's devem ser unicos para garantir o controle correto do código, id's repetidos podem gerar até problemas relacionados à acessibilidade. Se você precisa de algum marcador para selecionar mais de um elemento do por vez, você pode usar uma class ou melhor ainda, atributos data-. Segue o link sobre atributos data-: https://developer.mozilla.org/pt-BR/docs/Learn/HTML/Howto/Use_data_attributes

  2. O elemento de cabeçalho está apenas como h: <h class="title">How did we do?</h>. Deveria ser <h1>.

  3. Lembre-se sempre de colocar textos alt nas imagens para melhorar acessibilidade do seu código (imagens meramente ilustrativas sem informação relevante, podem ser ocultadas para leitores de tela adicionando o atributo aria-hidden="true", mesmo assim é recomendado a img possuir um texto alt também) e, possuir algum texto explicativo caso a imagem não carregue.

  4. Procure envolver seu código em tag's landmarks para melhorar a semântica do código. https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/landmark_role https://dequeuniversity.com/rules/axe/html/4.3/region?application=axeAPI

  Novamente, parabéns! Bons estudos!!

  Marked as helpful

  0