Aprender HTML: itinerario de práctica

Haz una prueba de lectura de código

Mira un archivo HTML pequeño y responde sin ejecutarlo: ¿qué texto aparecerá en la pestaña?, ¿cuál será el encabezado visible?, ¿dónde conduce el enlace? Si no puedes distinguir title de h1, empieza por la anatomía del documento. Si reconoces esas partes pero dudas al elegir entre párrafos, listas y secciones, trabaja el contenido semántico. Si puedes explicar ambas cosas, intenta construir una página con varios archivos.

<head><title>Mi viaje</title></head>
<body>
  <h1>Notas de viaje</h1>
  <a href="fotos.html">Ver fotografías</a>
</body>

Ejecuta el ejemplo después de responder. La diferencia entre tu predicción y el resultado indica qué concepto revisar. No necesitas una puntuación guardada por el sitio: una predicción escrita y una observación concreta ya forman una prueba útil.

Ruta uno: documento básico

Crea index.html con idioma, codificación, título, un encabezado y dos párrafos. El resultado esperado es un archivo que abre desde tu dispositivo y muestra el contenido correcto. Antes de avanzar, cambia el título de la pestaña sin cambiar el encabezado. Si puedes hacerlo y explicar por qué aparecen en lugares distintos, ya dominaste la separación inicial.

Después añade un enlace a una segunda página de práctica. Comprueba ida y vuelta. Si el navegador no encuentra el destino, revisa nombres y carpetas en lugar de reescribir todo el documento. Esta pequeña navegación prepara proyectos más grandes.

Ruta dos: contenido con significado

Reescribe una nota plana como una página con título, secciones y una lista adecuada al contenido. Usa una lista ordenada cuando la secuencia cambie el resultado; usa una lista sin orden para opciones equivalentes. Agrega una imagen relevante con texto alternativo que explique lo que aporta. La comprobación es que alguien pueda recorrer los encabezados y entender la organización antes de leer cada párrafo.

Desactiva CSS si ya añadiste estilos. Si el orden solo funciona por la posición visual, corrige el HTML. Esta ruta termina cuando la estructura por sí sola comunica el recorrido.

Ruta tres: proyecto que otros puedan usar

Elige una receta, una página de evento o una mini guía. Define una tarea verificable para quien la visite y prepara los archivos necesarios. Añade CSS después de que la información esté completa. Si hay una interacción, usa JavaScript para una acción específica y deja claro qué cambia. Prueba la página con teclado y en una pantalla pequeña. Pide a alguien que encuentre un dato o complete un paso sin indicaciones tuyas.

Guarda una copia de cada etapa. Cuando algo deje de funcionar, compara la versión anterior con la nueva y cambia una causa posible por vez. El itinerario no exige terminar todas las rutas en una sesión; exige que el siguiente paso sea una tarea que puedas ejecutar, explicar y revisar.