📄 Tu página de inicio: index.html

Parte 1 — Antes de programar

• Repasa los módulos 1 y 2 de este curso (equivalen a los "capítulos 1 y 2 del material").
• Crea tu cuenta en Figma y haz un primer boceto (prototipo) de cómo se verá tu página: dónde va el título, el menú, las imágenes de los cursos destacados...
• Entra en domestika.org y observa su página de inicio: ¿qué títulos usa?, ¿qué imágenes muestra?, ¿cómo agrupa el contenido en secciones?

Parte 2 — Construye tu página

Crea un archivo llamado exactamente index.html. Usa <div> para dividir la página en, como mínimo, estas secciones:

1. Cabecera: el nombre de tu plataforma (h1) y quizás un pequeño eslogan.
2. Sección de bienvenida: un texto de presentación con algún <em> o <strong>.
3. Cursos destacados: dos o tres "tarjetas" con imagen, título (enlazado con <a>) y descripción.
4. Categorías: una lista con viñetas de las categorías disponibles.
5. Cómo funciona: una lista numerada con los pasos para apuntarse.
6. Formulario de contacto o boletín: con su <label> correspondiente.
7. Pie de página: información básica de cierre.

Da estilo a cada <div> de sección con border y background-color, como viste en el Módulo 6, para que se distingan visualmente unas de otras.

Checklist de requisitos obligatorios

Antes de entregar, repasa que tu página tenga todo esto:

• Encabezados de, al menos, tres niveles distintos (por ejemplo, h1, h2 y h3).
• Párrafos (<p>).
• Texto enfatizado (<em>) y texto destacado (<strong>).
• Una lista numerada (<ol>) y una lista con viñetas (<ul>).
• Al menos una imagen (<img>) con su alt.
• Al menos un enlace (<a>).
• Divs usados para dividir secciones, con border y background-color.
• Dos familias de fuentes distintas: una instalada en tu ordenador y otra de Google Fonts.
• Una introducción a formularios (al menos un campo con su <label>).
• El archivo se llama exactamente index.html.

Depura tu código con el validador

El título de esta actividad es "Depurar nuestro código": no la des por terminada sin este paso.

1. Ve a validator.w3.org.
2. Elige la opción de subir tu archivo o pegar tu código directamente.
3. Lee la lista de errores y avisos uno por uno: cada línea te dice en qué línea de tu código está el problema y por qué.
4. Corrige, guarda, y vuelve a validar. Repite hasta tener cero errores.