MyLeoNes™

Estructura HTML — Informática, 11–13

Cómo una página web indica qué es cada parte de su contenido. Informática, 11–13 años.

Idea

HTML da a una página web una estructura que el navegador puede entender. Sus etiquetas marcan funciones como título, párrafo, enlace o imagen, en vez de describir solo el aspecto de las letras. El navegador lee esa estructura y la convierte en la página que ves, mientras otras herramientas pueden usar el mismo significado.

Por qué

Una página hecha solo con instrucciones visuales es difícil de interpretar para navegadores, buscadores y lectores de pantalla. HTML se desarrolló para compartir documentos entre ordenadores diferentes conservando una estructura con significado. Separar la estructura de la decoración también facilita adaptar una página a un móvil, una pantalla grande o una lectura en voz alta.

Ejemplo resuelto

Para crear una página pequeña, empieza poniendo una etiqueta de título alrededor de «Mi jardín». Añade una etiqueta de párrafo alrededor de «Hay tres girasoles abiertos». Después, añade una etiqueta de enlace con palabras como «Ver el mapa» y una dirección de destino. El navegador muestra así un título, texto normal y un enlace en el que se puede hacer clic.

Trampa habitual

Un error común y comprensible es usar una etiqueta de título solo porque hace el texto más grande. Parece lógico si te fijas en el resultado visible, pero un título también indica a las herramientas que el texto nombra una sección importante. Usa la estructura para el significado y los estilos para controlar tamaño, color y espacio.

Dónde aparece

HTML es la estructura que hay debajo de páginas de noticias, tiendas online, sitios escolares y páginas de juegos. Los buscadores usan sus títulos y enlaces para entender el contenido, y los lectores de pantalla usan esas funciones para leer la página en un orden útil. Puedes inspeccionar esta estructura con las herramientas de desarrollador del navegador.

Sigue explorando

Otros idiomas

Cargando MyLeoNes™…