Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
2
respuestas

Por qué DIV y no SECTION

Hola a todos, gracias de antemano por sus respuestas.

Quisiera por favor si alguno pudiera resolver mi duda, por qué el enlace del vídeo no lo coloca dentro de una section sino dentro de un div, realmente no me ha quedado del todo claro y me está generando mucha confusión puesto que en ocasiones coloca div y luego section, pero luego el div lo cambia a section porque dice que es lo adecuado pero luego vuelve a colocar div, en fin. Menudo Lío.

2 respuestas

Hola Cristian!

Te dejo este articulo que explica la semantica en html.

https://www.aluracursos.com/blog/la-semantica-en-html5

La utilización de las tags varian por la necesidad de dejarlo semantico. La div tiene mas la ideia de division por containers, muchas vezes + util para el css. La section, por otro lado, tiene una funcion semantica

Un saludo!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios

Hola Cristian.

Talvez esto te pueda ayudar. Imagina que creas un sitio web y quieres posicionarlo. Lo mejor es que los navegadores entiendan tu sitio ¿Como lo hacemos? diciendoselos a traves de las etiquetas.

Cuando el robot de google por ejemplo empieza a leer tu sitio ¿como sabe cual es encabezado? pues tu se lo dices con la etiqueta header, de igual manera le dices, esta es la barra de navegación con nav. Esto ayuda a darle la importancia necesaria a cada parte de tu pagina. Ya que si es una entrada de blog por ejemplo, con main le dices a google, mira este es mi contenido principal que se divide en varias secciones section.

<main>
    <h2>Los beneficios del café</h2>

    <section>
        <h3>Beneficio 1</h3>
        <p>Te da más enrgia por......</p>
    </section>

    <section>
        <h3>Beneficio 2</h3>
        <p>Contiene antoixidantes......</p>
    </section>

</main>

Como ves, ahora google ya sabe que section son contenidos relacionados de un mismo tema englobado en el contenido principal main. Ahora dentro de cada section puedes tener imagenes, listas, etc y estas las puedes dividir con div.

    <section>
        <div class="title-section">
            <h3>Beneficio 2</h3>
        </div>

        <div class="img-section">
            <img src="imagen1.png">    
        </div>

        <div class="content-section">
            <p>Contiene antoixidantes......</p>
        </div>
    </section>

Hay muchas más etiquetas semanticas pero atendiendo a tu pregunta solo me enfoque a estas. Al final tu puedes hacerlo todo con div, pero para mejores resultados es mejor usar las etiquetas adecuadas.