¿Qué es HTML?

También llamado: HyperText Markup Language, HTML5, lenguaje de marcado

Definición

HTML es el lenguaje con el que se escribe la estructura y el contenido de una página web: títulos, párrafos, enlaces, imágenes, formularios. El navegador lo lee y lo convierte en lo que ves en pantalla.

HTML no es un lenguaje de programación sino de marcado: etiqueta cada trozo de contenido para decir qué es. El aspecto visual lo pone CSS y el comportamiento interactivo, JavaScript.

Ejemplo

Una página mínima y correcta:

<!doctype html>
<html lang="es">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>Qué es el DNS | Glossan</title>
  <meta name="description" content="El DNS traduce nombres de dominio en direcciones IP.">
  <link rel="stylesheet" href="/estilos.css">
</head>
<body>
  <header><a href="/">Glossan</a></header>
  <main>
    <h1>¿Qué es el DNS?</h1>
    <p>El <strong>DNS</strong> traduce nombres en direcciones IP.</p>
    <img src="/dns.webp" alt="Esquema de una consulta DNS" width="800" height="400">
  </main>
</body>
</html>

Cosas que conviene saber

Usa etiquetas con significado (HTML semántico): <header>, <nav>, <main>, <article>, <button>… en lugar de <div> para todo. Ayuda a los lectores de pantalla y a los buscadores.
Un solo <h1> por página, con una jerarquía de títulos ordenada (h2, h3…).
Atributo alt en las imágenes: describe la imagen para quien no puede verla; si es decorativa, alt="".
<title> y <meta name="description"> son lo que Google muestra en los resultados.

Errores habituales

Olvidar <meta name="viewport">: en el móvil la página se ve diminuta, como en un escritorio.
Usar un <div> con un evento de clic en lugar de un <button>: no se puede usar con el teclado.

¿Tienes un producto o servicio relacionado con HTML? Anúnciate en este término.

Términos relacionados

Categorías: Frontend