Social Links Profile with CSS Flexbox

Community feedback

• 

  Daniel 🛸•44,250

  @danielmrz-devPosted 6 months ago

  Olá Rayane !

  Parabéns por completar o desafio! ✅

  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:

  Após a 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 você ache isso útil!

  Continue com o excelente trabalho!

  0

  ---

  

  Rayane Taguti•80

  @tagutirayanePosted 6 months ago

  @danielmrz-dev hey, Daniel, eu já ouvi professores dizendo que entre listas ou divs, não há diferença, e a semântica dos divs deixa o código mais limpo. Sabe dizer o que realmente é mais praticado no mercado?

  Obrigada pelo feedback <3

  1

  

  Daniel 🛸•44,250

  @danielmrz-devPosted 6 months ago

  @tagutirayane Com certeza há diferença, especialmente no aspecto de otimização de SEO e acessibilidade.

  Embora seja possível usar divs para muitos propósitos, a prática recomendada no mercado é usar os elementos HTML de forma semântica (elementos como div e span, não possuem valor semântico nenhum, apesar de serem úteis pra outras coisas).

  Isso não só melhora a acessibilidade e o SEO, como falei antes, mas também facilita a manutenção do código a longo prazo.

  Então minha recomendação é: quando estiver representando listas, use listas; para agrupamentos genéricos ou elementos de layout, use divs.

  0

  

  Rayane Taguti•80

  @tagutirayanePosted 6 months ago

  @danielmrz-dev maravilhaa, obrigada pelo esclarecimento, já aproveito pra direcionar meu código nesse sentido logo no início =)

  1