1
resposta

[Dúvida] Boa pratica ou Abordagem diferente?

Na parte onde ela cria <li>, eu utilizei DIV, e funcionou super bem, a dúvida é, seria uma boa pratica executar como ela fez? ou o meu seria apenas uma abordagem diferente para o mesmo resultado?

Segue meu código

    <section>
        <h1 class="container__titulo">Disponível nos seus dispositivos favoritos</h1>
        <section class="container__2 secundario__2">
            <div>
                <img src="/images/tv.png" alt="icone televisão">
                <h3 class="descricao__titulo_icon">TV</h3>
            </div>
            <div>
                <img src="/images/computador.png" alt="icone computador">
                <h3 class="descricao__titulo_icon">Computadores</h3>
            </div>
            <div>
                <img src="/images/celular.png" alt="icone celular">
                <h3 class="descricao__titulo_icon">Celulares e tablets</h3>
            </div>
        </section>
    </section>
1 resposta

Olá, Fabio, como vai?

Usar uma <div> para cada item é uma abordagem válida. No entanto, ao comparar com o exemplo da aula, o uso da tag <li> (item de lista) é mais semântico. Isso porque, quando você está criando uma lista de itens, a tag <li> é a mais indicada para representar cada item dentro de uma lista, geralmente agrupada em uma tag <ul> ou <ol>.

Embora o uso de <div> funcione, ele não expressa claramente a intenção de lista, o que poderia ser importante para questões de acessibilidade e semântica do código. Usar <li> ajudaria a tornar o conteúdo mais claro para leitores de tela e buscadores, além de seguir uma convenção que facilita a leitura do código por outros desenvolvedores.

A escolha entre usar <div> ou <li> vai depender do contexto, mas o uso da tag correta pode melhorar a clareza e a semântica do seu código.

Espero ter ajudado!

Siga firme nos seus estudos e conte com o fórum sempre que precisar!

Abraços :)

Caso este post tenha lhe ajudado, por favor, marcar como solucionado