Semántica en HTML5 con header y main
Contenido del curso
Semántica en HTML5 con header y main
Contenido del curso
Oswaldo de Jesus Montes Camarillo
Yenireth Urdaneta
Dario Mendoza
Neil Ruiz
Joel Dominguez Merino
Natalia Rodriguez
Juan Pablo Sanchez Parra
Yenireth Urdaneta
Juan Carlos Salguero anagua
Alisson Anaís Aguirre Zelaya
Tomas Martinez Giraldo
Arnold Hans Castillo Huamaní
Johan Andrey Fonseca Flechas
Flavio S Barajas Torres
Arnold Hans Castillo Huamaní
Natali Ruiz
Felipe Lopez
Jonathan Mendoza
Danny Yamid Hernandez Benavides
Angie Mariana Ramírez Hernández
Jorge Ivan Meza
Arnold Hans Castillo Huamaní
Dario Mendoza
Arnold Hans Castillo Huamaní
Arnold Hans Castillo Huamaní
Carlos Rubén Díaz Gutiérrez
Oswaldo de Jesus Montes Camarillo
Ismael Fierro
edgar ivan diaz corredor
Marvin Alejandro Matías Jiménez
Cristian William Perén Salazar
!estructura etiquetas html
El segundo quiz tiene un error, ya que las opciones salen en blanco.
Igual el examen final. No se visualizan las opciones bien como para que uno pueda contestar.
¿Es posible que Platzi retome sus estándares de calidad del pasado?
El último año percibo que los cursos y actualizaciones de los mismos están siendo mal gestionados. En algunos casos se trata de detalles, pero en otros el contenido que se presenta no está bien explicado y no tiene un libreto ordenado.
En esta oportunidad me encontré de nuevo con inconsistencias en las preguntas que conforman el examen final del curso y como ejemplo se puede ver la siguiente imagen:
La forma más facil de entender esta clase es viendo una imagen que expliqué mas graficamente la estructura de una web básica usando etiquetas semánticas.
Que buen resumen
Saludos, viendo la imagen que compartes y las explicaciones de clase, veo que es una excelente manera de poder entender visualmente la estructura. En cuanto a la etiqueta main, pienso que visualmente deberia ver como padre de aside, puesto que esta dentro de ella (main), solamente en un cotexto y ubicacion diferente.
alguien sabe como puedo activar eso , ami no me sale
Á mí tampoco me aparece el quiz :(
Así se vería visualmente la estructura semántica explicada en el actual video:
El article debe estar dentro del Section, Doc.
Semántica en HTML: Se refiere al uso de etiquetas que describen el significado del contenido.
Las etiquetas semánticas le indican al navegador qué es un menú, qué es un artículo o qué es un pie de página dentro de nuestra página web.
Manejar estructuras HTML semánticas es útil para:
Las etiquetas semánticas más comunes son:
El mejor ejemplo para ilustrar el uso de estas etiquetas es una página de noticias, como se muestra abajo:
Espero les sea de utilidad a quienes tal vez no les quedó muy claro el tema de la semántica con HTML.
Igualmente, les dejo algunas lecturas si desean complementar su conocimiento:
Mi resumen de la clase:
El aside quedaría más CLARO si aplicas CSS. Sabes, porque parece el aside como si fuera un section. El Profesor menciona en clase que el aside es un complemento adicional como barra lateral izquierda o derecha. Anótalo, Doc.
creo que mas que explicar para que srive cada codigo, debería mostrarlo, siento que en esta clase iba demasiado rápido y no se entendio en la practica como se vería todo el codigo o etiquetas que uso.
Por aquí un recurso muy bueno que nos ayuda a entender el comportamiento de las etiquetas sobre todo al momento de querer usar buenas practicas y semánticas en HTML.
Es HTML Reference una guía que documenta todos los elementos y atributos disponibles en HTML explicando su uso con ejemplos.
HTML Reference - A free guide to all HTML elements and attributes.
Muy buen contenido!
A mi parecer, y con todo el respeto, el profesor no logra ser completamente claro en la explicación. En algunos momentos quedan vacíos en el tema de las etiquetas, lo que puede generar confusión. Considero que sería muy útil hacer las clases más interactivas, incorporando ejemplos prácticos que faciliten la comprensión. Si HTML es la estructura o maqueta de una página, tal vez no debería centrarse únicamente en el código, sino también en mostrar cómo se aplica en contextos reales.
Creo que el profe no fue claro en esta clase. Espero les sea de ayuda. ¿Qué es la Semántica en HTML?
Hasta ahora, has usado etiquetas que le dicen al navegador cómo se ve algo (por ejemplo: <h1> es un título grande, <ul> es una lista con viñetas).
La semántica, en cambio, no cambia cómo se ve la página. Su único trabajo es decirle al navegador y a Google qué significa cada parte de tu código. Es como ponerle etiquetas a las cajas de una mudanza: en lugar de que todas sean cajas de cartón idénticas (<div> o texto suelto), marcas una como "Cocina", otra como "Libros" y otra como "Ropa".
La "semántica" no existe en HTML, existen las "etiquetas semánticas".
Las más básicas abarcan como:
Las etiquetas semánticas HTML5 como header, main, nav, article y footer son fundamentales para estructurar el contenido de una página web de manera que sea comprensible tanto para desarrolladores como para navegadores.
header: Define la cabecera del documento o de una sección, generalmente incluye títulos y elementos de navegación.main: Representa el contenido principal del documento, donde se encuentra la información más importante.nav: Es un contenedor para enlaces de navegación, facilitando el desplazamiento por diferentes secciones.article: Se utiliza para contenido independiente que podría ser distribuido de forma autónoma, como un blog o una noticia.footer: Define el pie de página, conteniendo información adicional, como derechos de autor y enlaces de contacto.Estas etiquetas mejoran la accesibilidad y el SEO, facilitando la comprensión del documento tanto para usuarios como para motores de búsqueda.
Sería genial que consideres el aside.
Como aporte adicional, la posición de la etiqueta aside depende de su contenido.
Si su contenido es relacionado con el contenido de main va dentro de esta etiqueta, como puede ser un indice o menú de contenidos.
<main> <aside> </aside> </main>
En cambio, si el contenido del aside no tiene que ver con el contenido de main, como puede ser categorías del sitio o publicidad, ambas etiquetas van en el mismo nivel.
<main> </main> <aside> </aside>
Muy interesante!! La semántica es fundamental para las benas prácticas.
Comparto estos recursos ampliados de cada etiqueta nueva vista en la clase.
hola estoy sintiendo que no es muy claro los videos con respecto al curso de html desde cero, hay cosas que confunden, el ejercicio practico es muy rapido y no da tiempo de ejecutarlo, cosa que no sucede con otros cursos de platzi, todos son oportunidades de mejorar.
éxito para todos
buena explicación