¿Qué es HTML?
HyperText Markup Language: el lenguaje con el que se escribe el contenido de toda página web. La sigla se desarma en tres partes, y cada una dice algo:
| Parte | Significa | Qué aporta |
|---|---|---|
| Hyper Text | Hipertexto | Texto con enlaces que saltan de una página a otra. Así se conecta toda la web |
| Markup | Marcado | Etiquetas que marcan qué es cada parte del contenido: un título, un párrafo, una imagen |
| Language | Lenguaje | Tiene reglas para escribirlo, igual que un idioma tiene su gramática |
HTML no es un lenguaje de programación
No calcula ni toma decisiones: solo describe el contenido. No tiene variables, ni condiciones, ni bucles. Eso llega en la Unidad 2, con PHP.
Lo que sí es: el idioma que entienden todos los navegadores, sin excepción.
¿De dónde sale HTML?
Nació junto con la web y desde entonces no ha parado de mejorar.
| Año | Hito | Qué pasó |
|---|---|---|
| 1991 | Nace HTML | Tim Berners-Lee lo crea en el CERN, junto con la World Wide Web, para compartir documentos enlazados entre científicos |
| 1999 | HTML 4.01 | La web ya es masiva. Se ordenan y estandarizan las etiquetas del lenguaje |
| 2014 | HTML5 | El que usamos hoy: agrega video, audio, formularios más ricos y etiquetas semánticas |
Es un estándar abierto
HTML es gratuito y lo mantienen la W3C y el WHATWG, no una empresa. Por eso una misma página se ve igual en Chrome, Firefox o Edge, y por eso vale la pena aprenderlo bien: no cambia de dueño ni de reglas de un día para otro.
Estructura vs. presentación
Esta es la idea que ordena toda la Unidad 1. Son dos trabajos distintos y no hay que mezclarlos.
| HTML | CSS · Tailwind | |
|---|---|---|
| De qué se encarga | La estructura: qué es cada cosa | La presentación: cómo se ve |
| Qué hace | Marca el contenido: esto es un título, esto un párrafo, esto una lista, esto una imagen | Da los estilos: colores, tamaños de letra, espacios y posición en la pantalla |
| La analogía | El esqueleto y los músculos | La ropa y el maquillaje |
| Cuándo | Hoy | En el tópico siguiente |
Regla de oro
Primero se escribe bien el contenido con HTML; después se le dan estilos.
Una página sin CSS igual funciona: se ve fea, pero se lee y se navega. Sin HTML no hay página.
Esta separación no es un capricho pedagógico. Es lo que permite cambiar por completo el aspecto de un sitio sin tocar una sola línea de contenido, y lo que hace que un lector de pantalla pueda leerle la página a alguien que no la ve.
Checkpoint
Intenta responder antes de desplegar cada pregunta.
¿Qué significa HTML y qué hace cada parte de la sigla?
HyperText Markup Language.
- HyperText (texto con enlaces que saltan de una página a otra).
- Markup (marcado: etiquetas que marcan qué es cada parte del contenido).
- Language (tiene reglas de escritura, como la gramática de un idioma).
¿Por qué se dice que HTML no es un lenguaje de programación?
Porque no calcula ni toma decisiones: no tiene variables, condiciones ni bucles. Solo describe el contenido, diciendo qué es cada parte. La lógica la pondrá PHP en la Unidad 2.
¿Qué hace HTML y qué hace CSS?
HTML pone la estructura: marca qué es cada cosa (un título, un párrafo, una lista). CSS pone la presentación: colores, tamaños, espacios y posición.
La analogía: HTML es el esqueleto, CSS es la ropa. Una página sin CSS funciona igual; sin HTML no hay página.
¿Por qué una misma página se ve igual en Chrome, Firefox y Edge?
Porque HTML es un estándar abierto, mantenido por la W3C y el WHATWG y no por una empresa. Todos los navegadores implementan las mismas reglas.
¿Qué es el hipertexto y por qué es la base de la web?
Es texto con enlaces que saltan de un documento a otro. Es lo que convierte un montón de páginas sueltas en una red navegable: sin enlaces tendrías archivos aislados, no una web.
Por eso la etiqueta
<a>y su atributohrefson el corazón del lenguaje, y no un detalle más.
¿Qué pasaría si escribieras los colores y los tamaños dentro del HTML?
Funcionaría, y sería un problema a la primera semana. Cambiar el aspecto del sitio obligaría a editar todas las páginas una por una, el mismo contenido no podría verse distinto en móvil y en escritorio, y un lector de pantalla tendría que abrirse paso entre instrucciones visuales que no le sirven de nada.
Separar estructura de presentación es lo que permite cambiar por completo el aspecto de un sitio sin tocar una línea de contenido.