Bootstrap y html5 – ¿sección o div?

3 minutos de lectura

Tengo una pregunta sobre el uso de Bootstrap: veo que, de manera predeterminada, usan muchos DIV en lugar de secciones, etc.

He estado leyendo la especificación HTML5 últimamente: cuándo usar la sección y cuándo usar div. La idea básica es que los DIV deben usarse solo si no se aplica ningún elemento específico de HTML5.

Ahora, si quiero crear un sitio web HTML5 usando Bootstrap, ¿debo cambiar los DIV a elementos HTML específicos (por ejemplo, SECCIÓN)?

  • No hay necesidad de hacer esto realmente. Por supuesto, use los elementos HTML5 más nuevos si desea hacerlo, pero no es obligatorio. Tiendo a usar ENCABEZADO y PIE de página y algunos otros misceláneos. Elementos HTML5, pero como he dicho, no es absolutamente necesario.

    – Billy Foso

    10 de marzo de 2014 a las 11:35

  • HTML5 se centra en la semántica. Si necesita un elemento para un uso específico que está cubierto por un elemento html5, debe usarlo para actualizar la semántica de su página para lectores de accesibilidad o robots. Pero mediante esta recomendación, cada desarrollador puede optar por utilizar el elemento que desee. Bootstrap usa divs porque es un elemento general que se puede aplicar en la mayoría de los casos para contenedores. Pero los mismos ejemplos se pueden hacer con tramo, sección,…

    – ylerjen

    10/03/2014 a las 11:40

avatar de usuario
Cirou

Realmente depende del contenido de su página, pero básicamente podría usar etiquetas HTML5 y aplicar clases de arranque como esta:

<section class="row">
    ...
</section>

<footer class="row">
    ...
</footer>

Pero como se dijo, depende de su contenido, y aún más, no está obligado a usar <section> etiquetas, tienen el propósito específico de representar un documento genérico o una sección de la aplicación, y no son obligatorias.

los <div> Las etiquetas son etiquetas genéricas que generalmente se usan para diseñar, como en bootstrap. Pero si quieres mantener el <section> etiquetas, tal vez podría preferir una solución mixta como esta:

<section>
    <div class="row">
       ...
    </div>
    <div class="row">
      ...
    </div>
</section>

Con esta solución la <section> La etiqueta se utiliza para agrupar contenidos, como debe ser, y la <div> etiquetas para darle estilo.

  • Siempre me confunden las secciones, hasta el punto en que me pregunto cuál es el punto si no se puede inferir fácilmente, y muchas personas (como yo) no las usan correctamente, o tal vez no las usan. correctamente. Entiendo que no es para el diseño, pero ¿alguna vez usarías la etiqueta de sección para envolver de esta manera? Es como si sintiera la necesidad de usar etiquetas de sección, así que intento hacerlo, pero realmente no las entiendo. De hecho, podría envolver usando secciones como lo hace arriba, pero ¿realmente quiero hacerlo?

    – mtpultz

    5 de abril de 2015 a las 1:47


  • Tenga en cuenta que una fila siempre debe estar contenida dentro de un

    y no directamente en una sección.

    –Jakob Halskov

    17 de agosto de 2019 a las 17:32

Section no es para fines de diseño, tiene un significado específico. Indica secciones/partes separadas de una página web. Por otra parte, div no tiene un significado específico. Puedes usar divs de forma anónima para administrar sus estilos de front-end.

  • Y los div se pueden usar dentro de las secciones. Las secciones son para delimitar el significado real del contenido, en lugar de ayudar con el estilo.

    – usuario3791372

    24 de enero de 2016 a las 23:02

Por lo que he leído, la sección de uso tiene la semántica correcta y ayuda con el SEO.

Las etiquetas de sección se utilizan para segmentar sus páginas web y optimizarlas para SEO, mientras que los div se utilizan para diseñar sus contenidos.

¿Ha sido útil esta solución?

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos y para mostrarte publicidad relacionada con sus preferencias en base a un perfil elaborado a partir de tus hábitos de navegación. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos. Configurar y más información
Privacidad