HTML5 desde cero: diferencia entre div, section y article

Поділитися
Вставка
  • Опубліковано 9 лис 2024

КОМЕНТАРІ • 60

  • @webpagedesigns4536
    @webpagedesigns4536 2 роки тому +5

    Muchas gracias amigo, me a sido de gran ayuda para comprender esto, he comenzado con esto de diseño de paginas web porque en la escuela me la daban, lamentablemente solo fue un semestre. ya aprendí HTML y ahora estoy aprendiendo CSS, luego aprenderé JAVA

    • @programacion-es
      @programacion-es  2 роки тому +2

      Me alegra un montón que te haya sido útil, un saludo y que tengas buen código!

  • @nickypalacios2405
    @nickypalacios2405 2 роки тому +2

    Muchas Gracias, por tu explicación, e empezado con html, css y js, me a sido de gran ayuda.

    • @programacion-es
      @programacion-es  2 роки тому +1

      Muchas gracias a ti por el feedback, un saludo y que tengas buen código! 👨‍💻

  • @ivanfarinas862
    @ivanfarinas862 Рік тому +1

    muchas gracias por tomarte el tiempo de explicar estos conceptos tan básicos, teniéndonos en cuenta a los nuevos!

    • @programacion-es
      @programacion-es  Рік тому +1

      Para eso estamos! =) Muchas gracias a ti por comentar

  • @Josan719
    @Josan719 2 роки тому +2

    Muchas gracias por la explicación, tenia dudas sobre las diferencias, los ejemplos han sido de mucha ayuda.

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias por tu comentario, me alegra que te haya sido útil, un saludo y que tengas buen código!

  • @distopiamonocronica8768
    @distopiamonocronica8768 2 роки тому

    Gracias compadre, la mejor explicación que he visto hasta ahora.

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias a ti por comentar! Un saludo y que tengas buen código!

  • @williamjaimesj.1366
    @williamjaimesj.1366 Рік тому

    Excelente explicación, muy agradecido

    • @programacion-es
      @programacion-es  Рік тому

      Gracias a ti por comentar, un saludo y que tengas buen código 😎👨‍💻🤘

  • @luher7
    @luher7 2 роки тому

    Muy bien explicado y mostrado

  • @LuSlower
    @LuSlower 2 роки тому

    Te la rifaste hermano, la verdad no sabía diferenciar estas etiquetas para separar contenido ( DIV, SECTION, ARTICLE), pero con tu explicación me quedo muy clara, gracias

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias por tu comentario! Me alegra que te haya sido útil el video, un saludo y que tengas buen código!

  • @alejandroflores6769
    @alejandroflores6769 Рік тому

    Gracias por la explicación.

    • @programacion-es
      @programacion-es  Рік тому

      ¡Gracias a ti por comentar! Me alegra que te haya sido útil =)

  • @delak115
    @delak115 2 роки тому

    Muchas gracias por la información y bien explicado.

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias por comentar! Un saludo y que tengas buen código!

  • @catruugd3921
    @catruugd3921 Місяць тому

    Entonces, a lo que yo entiendo, lo de section solo le sirve al desarrollador a identificar su codigo? Ya que al usuario le saldra normal la pagina y en tal caso el desarrollador incluso puede usar solamente parrafos y demas para ordenar la pagina y no usar ningun y aun asi la pagina compile bien y salga de la misma forma? Por lo que eso solo le sirve al desarrollador a mantener ordenado su codigo?
    Y otra cosa, entonces el servira para aplicar estilos, crear clases y todo eso y el es para dividir el contenido en nuestra pagina web, ¿no?

    • @programacion-es
      @programacion-es  Місяць тому

      No, el HTML semántico (uso de section y otras etiquetas identificativas) sirve también para que los propios navegadores puedan leer mejor la estructura de nuestra web y ofrecer mejor experiencia de usuario basada en accesibilidad y navegación, no solo ayuda a la legibilidad del developer sino también a la del navegador y el usuario, además, se toma en cuenta a nivel de SEO que la estructura de la web sea semántica, no se trata de que funcione y ya, las etiquetas nos ayudan a darle sentido a la estructura y si no las usamos correctamente puede penalizar la experiencia de usuario y el seo de la web

  • @reaperking537
    @reaperking537 Рік тому

    Muy buena explicacion, sigue asi.👍

    • @programacion-es
      @programacion-es  Рік тому

      Muchas gracias! Un saludo y que tengas buen código!

  • @Rubenduarte-d9b
    @Rubenduarte-d9b 2 роки тому

    Excelente explicación

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias por tu comentario, me alegra que te haya sido útil, un saludo y que tengas buen código!

  • @Mundo-Resumen
    @Mundo-Resumen 2 роки тому

    muy buen contenido Hombre me sirvio de mucho

    • @programacion-es
      @programacion-es  2 роки тому

      ¡Muchas gracias por tu comentario, me alegra un montón que te haya sido útil, un saludo y que tengas buen código!

  • @ZaidRodriguez-d3g
    @ZaidRodriguez-d3g Місяць тому

    Me encanto tu video, me podrias decir cual extension usas en VS para el autocomletar del HTML. Un saludo

    • @programacion-es
      @programacion-es  Місяць тому

      Mil gracias!! VSCode ya tiene integrado emmet para el autocompletado, si te hace falta más, te sirve cualquier extensión del directorio de vscode =)

  • @MrMartinezDev
    @MrMartinezDev 2 роки тому

    Que buena explicación 👍🏽

    • @programacion-es
      @programacion-es  2 роки тому

      Me alegra que te haya gustado, muchas gracias por comentar! Un saludo y que tengas buen código!

  • @ErikTory
    @ErikTory Рік тому

    Vale...!!!

    • @programacion-es
      @programacion-es  Рік тому

      xD creo que ya he mejorado lo de la muletilla en vídeos actuales ajksdhasjhdajksda

  • @jamesgc8646
    @jamesgc8646 2 роки тому

    Que buenos videos

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias! Un saludo y que tengas buen código!

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias! Un saludo y que tengas buen código!

  • @CALVOJOSEPY13
    @CALVOJOSEPY13 2 роки тому

    Crack

    • @programacion-es
      @programacion-es  2 роки тому

      Muchas gracias por comentar, me alegra que te haya sido útil, un saludo y que tengas buen código!

  • @jaquematematicas3391
    @jaquematematicas3391 2 роки тому

    👍👍👍👏👏👏

  • @juansebastian8647
    @juansebastian8647 2 роки тому

    Gracias por el tutorial, una duda como ingresas el codigo dentro del div automaticamente y queda con identación?

    • @programacion-es
      @programacion-es  2 роки тому +1

      ¡Hola! Con la extensión Prettier, la configuras para formatear tu código al guardar el archivo =)

    • @juansebastian8647
      @juansebastian8647 2 роки тому

      @@programacion-es Gracias :)

  • @spake8999
    @spake8999 2 роки тому

    Hola amigo excelente explicacion, pero deberias enseñarlo como queda en la pagina tmb para entederlo mas rapido

    • @programacion-es
      @programacion-es  2 роки тому

      Hola! A nivel visual no hay diferencia, por eso la explicación para poder diferenciar las etiquetas a nivel semántico y cuándo usarlas =)

  • @0szkr
    @0szkr Рік тому

    Excelente explicación, solo si puedes evitar decir tanto vale porque si distrae😅

    • @programacion-es
      @programacion-es  Рік тому

      XD lo he corregido en videos más recientes, pero igual lo tengo presente, muchas gracias por el feedback =)

  • @luliusripa
    @luliusripa Рік тому

    hermano se que tu explicación es buena por el feedback que veo, pero llevo viendo varios videos y logro entender para que sirven, pero en el momento de la practica siento que las uso mal. Apenas llevo 2 días aprendiendo de desarrollo web y no se si seguir avanzando más adelante lo lograre comprender mejor, porque me estoy quedando aqui.

    • @programacion-es
      @programacion-es  Рік тому +1

      ¡Hola! Un par de cosas, si no estás seguro si las estás usando bien, mírate el vídeo de cómo validar tus documentos HTML, ahí muestro una web y extensión para validar la estructura y uso de las etiquetas.
      Otra cosa, me comentas que llevas dos días, calma, es normal que tengas dudas, pero ten paciencia porque no es algo que se domine en un par de semanas o un mes, la práctica y el aprendizaje debe ser constante para siempre ir mejorando, ánimo.
      ¡Un saludo y que tengas buen código!

    • @luliusripa
      @luliusripa Рік тому

      @@programacion-es si he validado el código y no me sale ningún error, creo era la idea que tenía yo de estarías usando mal. Igualmente muchas gracias por apoyar a los que recién están empezando 🙌

  • @chungachunga1268
    @chungachunga1268 2 роки тому

    en lo personal me gustaria que le dieras al F5 tras cada expilcacion para entender un poco mejor como funcionan

    • @programacion-es
      @programacion-es  2 роки тому +1

      En este caso la diferencia entre los 3 contenedores es más semántica que visual, por eso me centré en la diferencia de uso más que en resultado visual dado que este no varía, pero lo tendré en cuenta para próximos ejercicios, muchas gracias por comentar
      Un saludo y que tengas buen código!

  • @retsagdw603
    @retsagdw603 2 роки тому +1

    En conclusion, estas etiquetas tienen distinta utilidad y su unica diferencia es el nombre, podria usar un div para lo mismo que un section o un article, simplemente no se hace porque es mas ordenado hacerlo con las etiquetas recomendadas para hacrlo, pero el resultado no cambia?

    • @programacion-es
      @programacion-es  2 роки тому

      Si y no, en efecto, las tres actúan como contenedores, divs en versiones anteriores, sin embargo, su uso sí que tiene peso semántico para temas de accesibilidad, SEO y estructura del contenido, a nivel funcional, por llamarlo de alguna manera, son contenedores, a nivel semántico, cada uno tiene su uso y su contexto para mejorar la legibilidad de la web en base a su estructura =)

  • @arturobacs7742
    @arturobacs7742 Рік тому

    GG ME MAREE XD

  • @Eperezmosqueda
    @Eperezmosqueda Рік тому

    Ya he visto 3 videos de diferente autor donde tienen una ligera obsesión con la palabra "vale"

    • @programacion-es
      @programacion-es  Рік тому

      xD en los últimos vídeos de hace un tiempo para acá he tratado de controlarlo un poco más asjdhasjdhaksjdhasd

  • @juancarlosramirezleon9750
    @juancarlosramirezleon9750 Рік тому

    Muy buena explicacion pero el video pudo haber durado la mitad si solo hubieras dicho cuanto mucho tres veces "vale". Lo repites exageradamente y pierdes oratoria.

    • @programacion-es
      @programacion-es  Рік тому

      Mil gracias por el feedback, en efecto, me he dado cuenta de esto y lo he tratado de corregir en los vídeos más recientes =) Un saludo!