HTML es el lenguaje con el que se escribe el contenido de toda página web. No define colores ni posiciones (eso viene después, con CSS y Tailwind): define qué es cada cosa. Un título es un título, un párrafo es un párrafo, una lista es una lista.
Este tópico cubre cinco clases y su práctica es un mini sitio de tres vistas, que es el ensayo directo del Trabajo 1.
Todavía no hay estilos
Las páginas que construyas aquí se verán en blanco y negro, con la tipografía por defecto del navegador. Es lo esperado: primero se escribe bien el contenido, después se le da forma.
Tópicos
| Página | Contenido |
|---|---|
| 1. Qué es HTML | Qué significa la sigla, de dónde viene y por qué estructura y presentación van separadas |
| 2. Etiquetas y documento | Anatomía de una etiqueta, anidación, el esqueleto completo de una página, div y span |
| 3. Texto, listas y enlaces | Encabezados, párrafos, énfasis, listas y el atributo href |
| 4. Semántica y atributos | Las zonas del <body>, class e id, saltos y caracteres especiales |
| 5. Rutas y navbar | Cómo se pasa de una vista a otra, rutas relativas y absolutas, el menú del sitio, errores comunes |
| 6. Imágenes y multimedia | img, el texto alternativo, formatos y peso, audio y video |
| 7. Tablas y formularios | Mostrar datos con tablas y capturarlos con formularios |
| 8. Práctica | El mini sitio de tres vistas, construido paso a paso |
Objetivos
- Escribir el esqueleto de una página HTML sin consultar apuntes.
- Elegir cada etiqueta por lo que significa, no por cómo se ve.
- Marcar las zonas de una página con
nav,mainyfooter. - Conectar varias vistas con rutas relativas que funcionen en los dos sentidos.
- Insertar imágenes y medios con su texto alternativo.
- Construir un formulario cuyos datos lleguen completos al servidor.
Antes de empezar
- VSCode con Live Server instalado (editor y extensiones)
- Saber hacer
pull → add → commit → push(Unidad 0 (Git)) - Manejar las buenas prácticas de nombres de archivos