Semantic HTML and CSS

Community feedback

• 

  Daniel 🛸•44,250

  @danielmrz-devPosted 6 months ago

  Olá @adonesguerreiro!

  Sua solução está ótima!

  📌 É recomendado usar elementos HTML semânticos como <ul> e <li> para criar listas. Isso garante que seu código seja mais acessível, mais fácil de manter e semanticamente significativo.

  Aqui está um exemplo de como você pode refatorar seu código:

  Depois da Refatoração:

  <ul class="list-container">
      <li><a href="#">Github</a></li>
      <li><a href="#">Frontend Mentor</a></li>
      <li><a href="#">LinkedIn</a></li>
      ...
  </ul>
  

  Ao usar <ul> e <li>, você transmite a estrutura do seu conteúdo de forma mais clara, facilitando para leitores de tela e mecanismos de busca entenderem. Além disso, isso está alinhado com as melhores práticas para semântica HTML.

  Espero que seja útil!

  Continue com o excelente trabalho!

  Marked as helpful

  1

  ---

  

  adonesguerreiro•50

  @adonesguerreiroPosted 6 months ago

  @danielmrz-dev muito obrigado pela recomendação irei fazer correção em breve.

  0
• 

  Bernardo Poggioni•5,280

  @R3ygoskiPosted 6 months ago

  Olá Adones, o seu projeto está muito bom e também está bem resposnivo, parabéns.

  Gostaria de te dar uma dica a respeito de CSS, notei que você utilizou fontes com o tamanho em px, isso não é errado, mas é mais recomendável usar rem, devido a ela se adaptar as configurações de fonte do usuário, assim dando mais acessibilidade a sua página.

  Complementando o comentário acima (ou abaixo), além de você poder usar uma <ul> que estaria sim correto já que é uma lista de botões, que são correlacionados entre si, também estaria correto utilizar eles dentro de uma <nav>, já que esses botões seguindo a ideia do projeto, é de que sejam utilizados para navegar até um determinado local. Ficando algo assim:

  <nav>
      <ul class="list-container">
          <li><a href="#">Github</a></li>
          <li><a href="#">Frontend Mentor</a></li>
          <li><a href="#">LinkedIn</a></li>
          ...
      </ul>
  </nav>
  

  E é isso, seu projeto está muito bom, continue se aprimorando cada vez mais, e novamente, parabéns. Caso tenha surgido alguma duvida, sinta-se a vontade para perguntar aqui nos comentários.

  Marked as helpful

  0

  ---

  

  adonesguerreiro•50

  @adonesguerreiroPosted 6 months ago

  @R3ygoski muito obrigado vou sim fazer os ajustes que sugeriram e em breve atualizo projeto.

  1