🧱 ¿Qué es HTML?
HTML significa HyperText Markup Language. Es el lenguaje que define la estructura de cualquier sitio web que visitas en Internet.
Su objetivo principal es organizar el contenido: títulos, párrafos, imágenes, enlaces, tablas o formularios.
💻 Ejemplo básico de HTML
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Mi primera página</title>
</head>
<body>
<h1>¡Hola, mundo!</h1>
<p>Este es mi primer sitio web en HTML.</p>
</body>
</html>
💡 Tip: Aprende HTML como la base antes de saltar a CSS o JavaScript. Te dará claridad sobre cómo funciona la web.
🧠 ¿Qué son las etiquetas semánticas?
Una etiqueta semántica no solo da forma, también describe el propósito del contenido que encierra.
- ✅ Claridad para humanos
- ✅ Claridad para máquinas (Google, lectores de pantalla, etc.)
🔑 Ejemplos de etiquetas semánticas
-
<header>
– encabezado de la página o sección <nav>
– navegación principal<main>
– contenido principal<section>
– agrupación temática-
<article>
– contenido independiente (ejemplo: un post) <footer>
– pie de página
📌 Antes vs Después
Sin semántica:
<div class="top">
<div class="menu">...</div>
</div>
Con semántica:
<header>
<nav>...</nav>
</header>
📈 ¿Por qué usarlas?
- Mejora el SEO
- Mejora la accesibilidad
- Hace tu código más legible y mantenible
➡️ Usa etiquetas semánticas desde tu primer proyecto.
🔗 Conclusión
HTML es la base de todo sitio web, y las etiquetas semánticas son el siguiente nivel para escribir un código más claro, accesible y profesional.