Recorre el circuito
Avanza casilla a casilla. Cada etapa se desbloquea al completar la anterior, y siempre puedes volver aquí para ver tu progreso o repasar lo ya visto.
Título del curso
Descripción breve: qué se va a aprender y por qué merece la pena. Dos o tres líneas, en el tono del repo — directo, para personas adultas.
1. Título de la primera lección
Párrafo de entrada: sitúa al alumnado y explica qué va a ver en esta lección. Frases cortas, tono directo, sin infantilizar.
Destacado: la idea que no se puede perder
Úsalo para resaltar lo importante, no como adorno. Si todo está destacado, nada lo está.
Un subtítulo para organizar
La jerarquía de encabezados no salta niveles: h2 → h3, nunca
directamente a h4.
Usa las flechas para recorrer los pasos.
1. Título de la primera lección (continuación)
Segundo panel de la lección. Al terminarlo se vuelve al tablero y se desbloquea la casilla siguiente.
aria-expanded lo sincroniza el JS, y
aria-controls apunta al id de su cuerpo.
2. Título de la segunda lección
Párrafo de entrada de la segunda lección.
Primera pestaña
Las tabs van bien para comparar alternativas o mostrar variantes de lo mismo.
Segunda pestaña
Hay que pulsar todas las pestañas para desbloquear la casilla siguiente. La primera, visible por defecto, ya cuenta.
2. Título de la segunda lección (continuación)
Voltea cada tarjeta (clic o Enter) para ver el reverso.
Anverso
Reverso. Las flip cards van bien para pregunta/respuesta o concepto/ejemplo. El JS las hace operables por teclado.
Otro anverso
Hay que voltearlas todas para desbloquear la casilla siguiente.
3. Título de la tercera lección
Párrafo de entrada de la tercera lección. Añade aquí los componentes que necesites: mira el
catálogo (Innovacion/catalogo.html) antes de crear marcado nuevo.
Cuántas casillas poner
Esta plantilla trae 3 lecciones porque es una base, no una norma. El tablero es
dinámico: añade o quita casillas y sus paneles según el temario, y actualiza
setSections([...]) en script.js.
3. Título de la tercera lección (continuación)
Cierra aquí la última lección antes de la webgrafía y la evaluación.
Webgrafía
Fuentes y lecturas para ampliar. Enlaces reales y comprobados, no de relleno.
Título de la fuente
Qué aporta y a quién le interesa. Ir a la fuente
Evaluación final
Comprueba lo aprendido. Necesitas el 60 % para superarlo.