¿Cuál sería la diferencia entre usar div y section?

Pregunta de la clase:
¿Cómo funciona HTML?
Israel Vasquez

Israel Vasquez

Pregunta
studenthace 4 años

¿Cuál sería la diferencia entre usar div y section?

5 respuestas
para escribir tu comentario
    Julián Alexander España Riobamba

    Julián Alexander España Riobamba

    studenthace 4 años

    Su función es la misma, agrupar en un elemento a más elementos, solo que con section o article estás separando de una mejor manera el contenido ya que está diciendo de una manera global

    Juan Pablo Celiz

    Juan Pablo Celiz

    studenthace 4 años

    Tal cual dicen los compañeros, la gran diferencia está en el SEO y semántica. Si bien eso es muy importante, creo que lo más radical es el uso de tags como section o article para mejorar la accesibilidad, pensando en las personas con capacidades diferentes. Al mejorar en ese aspecto también mejoraremos el SEO. Te recomiendo el curso de Accesibilidad Web aquí en Platzi.

    Andrés David Lizarazo Becerra

    Andrés David Lizarazo Becerra

    studenthace 4 años

    La única diferencia entre el elemento DIV y el elemento SECTION es la semántica. Sirve para ayudar al SEO (poscionamiento en los buscadores).

    En cuanto a propiedades, funcionan casi igual, ambos son elementos de bloque y no tienen ninguna diferencia. Pero sirve para hacer mucho mas optimo la diferenciación de secciones dentro de tu sitio.

    Antiguamente una una seccion de de articulos se hubiera codeado de la siguiente manera:

    <div class="productos"> <div class="producto"> <!-- Aqui iria el codigo de cada uno de tus productos --> </div> </div>

    Como se puede notar esta todo separado por divs. Si los cambiamos por la nuevas etiquetas semanticas que nos provee HTML5 quedaria algo asi

    <section class="productos"> <article class="producto"> <!-- Aqui el codigo de tu producto --> </article> </section>

    Realmente tiene mucho mas sentido semantico, y tiene exactamente las mismas propiedades que el antiguo .

    John Cardenas

    John Cardenas

    studenthace 4 años

    Se podría decir que div es más genérico y section es más semántico. Section lo puedes usar, como su nombre lo dice, para dividir secciones de una página web (sección de contacto, sección de comentarios, sección de productos...). En cambio, un div es más como para poder trabajar con bloques y posicionar elementos más cómodamente. Div no es semántico, no significa algo.

    Un ejemplo puede ser este:

    <section class="productos"> <div class="productos"> </div> </section>
    Cristian Blandón

    Cristian Blandón

    studenthace 4 años

    SEO y semántica.

    <div>
    es simplemente un contenedor sin significado. Para las personas que entren a tu página, no habrá diferencia, porque puedes lograr el mismo "efecto visual" usando
    <div>
    o
    <section>
    o
    <article>
    , pero para el posicionamiento o para los sistemas que "usen" tu página, habrá diferencia.

    Aquí puedes encontrar una corta conversación al respecto.

    ¡Saludos!

Curso de HTML y CSS 2019

Curso de HTML y CSS 2019

Aprende a crear sitios web con HTML y CSS. Profundiza en el desarrollo y personalización de páginas web navegables, intuitivas y a la medida de tus necesidades. Crea tus primeros proyectos con Platzi.

Curso de HTML y CSS 2019
Curso de HTML y CSS 2019

Curso de HTML y CSS 2019

Aprende a crear sitios web con HTML y CSS. Profundiza en el desarrollo y personalización de páginas web navegables, intuitivas y a la medida de tus necesidades. Crea tus primeros proyectos con Platzi.