Saltar al contenido
introduccion.html · devschool

¿Qué es HTML?

Lección 1 de 23 · 4 min de lectura · Actualizado el

En esta lección
  1. Un lenguaje de marcado, no de programación
  2. Las etiquetas
  3. HTML no es HTTP
  4. HTML y XML
  5. Una historia muy corta
  6. ¿Quién lee el HTML?
  7. HTML, CSS y JavaScript
  8. Qué necesitas para escribir HTML

HTML (HyperText Markup Language, lenguaje de marcado de hipertexto) es el lenguaje con el que se escribe el contenido de una página web: los títulos, los párrafos, las imágenes, los enlaces, las tablas y los formularios. Todas las webs que visitas tienen HTML por debajo, desde un buscador hasta la web de tu ayuntamiento.

Un lenguaje de marcado, no de programación

HTML no es un lenguaje de programación: no toma decisiones, no repite tareas ni hace cálculos. Es un lenguaje de marcado: sirve para marcar cada parte de un texto para decir qué es.

Piensa en un examen que un profesor corrige a mano. Encima del texto original aparecen anotaciones con boli rojo: “esto es un título”, “subraya esto”, “aquí falta un párrafo”. Esas anotaciones son información sobre el texto, lo que se llama metainformación. Un lenguaje de marcado hace lo mismo, pero con una sintaxis que un ordenador puede leer.

Otros lenguajes de marcado que te encontrarás son XML (para intercambiar datos entre programas), Markdown (para escribir documentación, como estas lecciones) o LaTeX (para documentos científicos).

Las etiquetas

Las marcas de HTML se llaman etiquetas y se escriben entre los signos < y >:

<p>Hola, esto es un párrafo.</p>
  • <p> es la etiqueta de apertura.
  • </p> es la etiqueta de cierre. Lleva una barra / delante del nombre.
  • Lo que hay en medio es el contenido.

Todo junto (apertura, contenido y cierre) forma un elemento. En la lección de elementos y atributos verás las reglas completas.

HTML no es HTTP

Son dos siglas que se confunden a menudo:

  • HTML es el lenguaje en el que está escrita una página.
  • HTTP es el protocolo, las reglas con las que el navegador pide esa página a un servidor y el servidor se la envía.

Cuando escribes una dirección en el navegador, este usa HTTP (o HTTPS, su versión cifrada) para pedir un archivo. Ese archivo contiene HTML, y el navegador lo lee y lo dibuja en pantalla.

HTML y XML

XML y HTML se parecen mucho porque vienen del mismo antepasado, un lenguaje llamado SGML. Pero tienen objetivos distintos:

  • XML describe datos para que los lea otra máquina: un pedido, una factura, la configuración de un programa.
  • HTML presenta contenido para que lo lea una persona.

Una historia muy corta

  • 1989-1991. Tim Berners-Lee, físico del CERN, inventa la World Wide Web: crea a la vez HTML, el protocolo HTTP y el primer navegador. Su gran idea fue poder enlazar documentos que están en ordenadores distintos.
  • Años 90. Llega la “guerra de los navegadores”: Netscape e Internet Explorer añaden etiquetas propias para ganar usuarios. Aparecen etiquetas como <font>, que mezclaban contenido y aspecto y que hoy están prohibidas.
  • 1999. HTML 4.01 se convierte en la versión más usada durante una década.
  • 2008-2014. Se desarrolla HTML5, que añade audio y vídeo sin plugins, etiquetas semánticas como <nav> o <article>, nuevos tipos de campos de formulario y muchas APIs para JavaScript. También define cómo debe actuar el navegador ante una página con errores.
  • Hoy. HTML ya no tiene números de versión: es un estándar vivo que mantiene el WHATWG (un grupo formado por Apple, Google, Mozilla y Microsoft) y que se actualiza continuamente.

Cuando hoy se habla de HTML, se habla de HTML5. Es lo único que deberías aprender y usar.

¿Quién lee el HTML?

El navegador (Chrome, Firefox, Safari, Edge…). Descarga el archivo .html, lee las etiquetas, construye con ellas una estructura en memoria y la dibuja en la pantalla. Tú nunca ves las etiquetas, solo el resultado.

Para ver el HTML de cualquier web, haz clic derecho sobre la página y elige Ver código fuente. Para inspeccionar un elemento concreto, clic derecho sobre él y Inspeccionar.

HTML, CSS y JavaScript

Una página web tiene tres capas, y cada una tiene su lenguaje:

  1. HTML: el contenido y su estructura. Qué hay en la página.
  2. CSS: el aspecto. Cómo se ve (colores, tamaños, posiciones).
  3. JavaScript: el comportamiento. Qué pasa cuando el usuario hace algo.

Mantener las tres capas separadas es una de las ideas más importantes del desarrollo web. Un HTML bien escrito describe el contenido sin preocuparse de cómo se verá: así la misma página puede verse bien en un móvil, en un monitor enorme o leerse en voz alta a una persona ciega.

Qué necesitas para escribir HTML

Solo un editor de texto y un navegador. Crea un archivo con extensión .html, escribe dentro, guárdalo y ábrelo con doble clic. Para trabajar con comodidad se usa un editor de código como Visual Studio Code, que colorea las etiquetas y las cierra por ti.

Pruébalo tú

Cambia el código y pulsa Ejecutar (o Ctrl + Enter).

introduccion.html
Resultado

Pon a prueba lo que has aprendido

[HTML] ¿Qué es HTML?

[HTML] ¿Cuál es la diferencia entre HTML y HTTP?

¿Te ha quedado claro? Márcala y verás tu progreso en el explorador.