HTML

¿Qué es HTML?

HTML (HyperText Markup Language) es el lenguaje de marcado estándar para crear páginas web. Es el esqueleto de toda página web, definiendo la estructura y el contenido mediante elementos y etiquetas que los navegadores interpretan para mostrar información al usuario.

¿Para qué sirve HTML?

HTML es fundamental para el desarrollo web. Te permite:

Estructurar el contenido de una página web (textos, imágenes, enlaces).
Crear formularios para recopilar información del usuario.
Organizar información con listas, tablas y secciones.
Enlazar páginas web entre sí mediante hipervínculos.
Embeber multimedia como videos, audio e imágenes.

¿Cómo funciona?

Imagina HTML como el arquitecto de tu casa web. Define dónde van las habitaciones (secciones), las puertas (enlaces), las ventanas (imágenes) y todos los elementos estructurales. Luego CSS se encarga de decorar y JavaScript de añadir funcionalidad.

Ejemplo: Estructura básica de HTML

Una página HTML tiene una estructura definida con etiquetas que encierran el contenido:

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Mi Primera Página Web</title>
</head>
<body>
    <header>
        <h1>Bienvenido a mi sitio</h1>
        <nav>
            <a href="#inicio">Inicio</a>
            <a href="#sobre-mi">Sobre mí</a>
        </nav>
    </header>
    
    <main>
        <section id="inicio">
            <h2>Página principal</h2>
            <p>Este es un párrafo de ejemplo con <strong>texto en negrita</strong>.</p>
        </section>
    </main>
    
    <footer>
        <p>&copy; 2024 Mi Sitio Web</p>
    </footer>
</body>
</html>

Este ejemplo muestra la estructura básica: DOCTYPE, HTML, head con metadatos, y body con el contenido visible.

Conceptos clave de HTML

Elementos: Bloques de construcción definidos por etiquetas de apertura y cierre.
Atributos: Información adicional que se añade a las etiquetas (id, class, src).
Semántica: Uso de etiquetas que describen el significado del contenido.
Anidación: Elementos dentro de otros elementos siguiendo una jerarquía.
DOCTYPE: Declaración que indica al navegador qué versión de HTML usar.

¿Dónde encuentras HTML?

En archivos .html que forman páginas web.
En plantillas de frameworks como React, Vue, o Angular.
En sistemas de gestión de contenido como WordPress.
En emails HTML para marketing y comunicación.
En aplicaciones móviles híbridas usando WebView.

Conclusión

HTML es la base de toda la web. Sin él, no existirían páginas web tal como las conocemos. Aprender HTML es el primer paso esencial para convertirse en desarrollador web, ya que proporciona los fundamentos sobre los cuales se construyen todas las tecnologías web modernas.

Aquí puedes ver una Cheatsheet completa de HTML