Ejercicio de programación con HTML: Reto etiquetas semánticas HTML
Código
0h 5m
Practica la creación de páginas web usando etiquetas semánticas HTML5 para mejorar la accesibilidad y organización del contenido.
Crea una página web sobre un tema de tu elección (por ejemplo, un blog de viajes, una receta de cocina o un artículo sobre tecnología) utilizando las etiquetas semánticas de HTML5.
La página debe incluir obligatoriamente las siguientes etiquetas semánticas:
<header>
: Para la cabecera de la página, que debe contener un título principal (<h1>
) y un menú de navegación.<nav>
: Dentro del header, con al menos 3 enlaces.<main>
: Para el contenido principal de la página.<article>
: Dentro de main, para contener un artículo completo sobre el tema elegido.<section>
: Al menos dos secciones diferentes dentro del artículo, cada una con su propio encabezado (<h2>
).<aside>
: Para información complementaria relacionada con el contenido principal.<footer>
: Para el pie de página con información de contacto o copyright.
Asegúrate de que la estructura sea semánticamente correcta y que cada etiqueta se utilice según su propósito. No es necesario aplicar estilos CSS, el ejercicio se centra exclusivamente en la estructura HTML.
Todos los ejercicios de programación de HTML
Evalúa tus conocimientos con ejercicios de programación en HTML de tipo Test, Puzzle, Código y Proyecto con VSCode.
Divisiones
Test
Audio
Puzzle
Proyecto crear páginas HTML
Proyecto
Enlace
Puzzle
Video
Puzzle
Imágenes
Test
Reto atributos ARIA en HTML
Código
DOCTYPE
Test
Compatibilidad con navegadores
Test
Reto trabajar con imágenes en HTML
Código
Reto crear tablas HTML
Código
Introducción a HTML
Test
Imágenes vectoriales
Test
Anidación de etiquetas
Test
Formularios
Puzzle
Encabezados
Puzzle
Reto Validación HTML
Código
Optimización de la carga de la página (Lazy loading)
Puzzle
Listas
Puzzle
Reto metadatos en HTML
Código
Estilos
Puzzle
Validación de HTML
Puzzle
Navegación por teclado
Puzzle
Párrafos
Test
Uso de DOCTYPE
Puzzle
Reto de enlaces HTML
Código
Etiquetas semánticas
Puzzle
Contraste y legibilidad
Test
Atributos de ARIA
Test
Reto geolocalización en HTML
Código
Tablas
Test
Reto LocalStorage en HTML
Código
Uso de atributos
Puzzle
Atributos
Test
Reto formatear texto en HTML
Código
Reto crear listas HTML
Código
Metadatos
Test
Comentarios
Test
Incrustación de contenido (iframe)
Test
Uso de elementos y etiquetas
Puzzle
Elementos y etiquetas
Test
Tutorial para resolver este ejercicio de programación
HTML
Etiquetas semánticas (article, section, header, footer, nav, aside)
Organización de contenido