diff --git a/docs/NORMALIZACION.md b/docs/NORMALIZACION.md new file mode 100644 index 0000000..4d9f4d7 --- /dev/null +++ b/docs/NORMALIZACION.md @@ -0,0 +1,98 @@ +# NORMALIZACIÓN — Plan de estructura del sitio de transición + +> Objetivo: Transformar `www-ksaldis-dt/` en un sitio web con estructura profesional, +> mantenible y escalable, siguiendo estándares web actuales. + +--- + +## ✅ Fase 0 — Base inicial (completada) + +| # | Tarea | Estado | +|---|-------|--------| +| 0.1 | Crear directorio `www-ksaldis-dt/` | ✅ | +| 0.2 | Copiar `LIBRO_DE_ESTUDIO.html` como `index.html` | ✅ | +| 0.3 | Extraer CSS inline → `css/style.css` | ✅ | +| 0.4 | Extraer JS inline → `js/app.js` | ✅ | +| 0.5 | Crear `assets/` para recursos estáticos | ✅ | +| 0.6 | Symlinks a directorios de contenido (`videos_offline/`, `secciones/`, etc.) | ✅ | + +--- + +## 📋 Fase 1 — Limpieza y organización de assets + +| # | Tarea | Prioridad | +|---|-------|-----------| +| 1.1 | **Favicon**: Agregar ícono de sitio (`favicon.ico` o `.svg`) | 🟡 Media | +| 1.2 | **Meta tags**: Agregar Open Graph, Twitter Cards, autor, keywords | 🟢 Alta | +| 1.3 | **Google Fonts local**: Descargar Inter y servir desde `assets/fonts/` (sin depender de CDN) | 🟡 Media | +| 1.4 | **Imágenes**: Verificar que todas las rutas en `imagenes/` estén correctas y optimizar formatos | 🟢 Alta | +| 1.5 | **Eliminar dependencias externas**: Revisar que no haya recursos cargando de terceros (CDNs, etc.) | 🟡 Media | + +--- + +## 📋 Fase 2 — Estructura del contenido + +| # | Tarea | Prioridad | +|---|-------|-----------| +| 2.1 | **Dividir el HTML**: Separar el contenido académico en páginas por módulo/sección (en lugar de un solo HTML gigante) | 🟡 Media | +| 2.2 | **Navegación SPA**: Implementar navegación tipo Single Page Application (carga de contenido vía fetch + innerHTML) | 🔴 Alta | +| 2.3 | **Sidebar dinámico**: Generar el menú desde un JSON de estructura en vez de hardcodearlo | 🟢 Alta | +| 2.4 | **Breadcrumbs**: Agregar migas de pan para saber dónde estás en la navegación | 🟢 Alta | +| 2.5 | **Página 404**: Crear página de error personalizada | 🟡 Media | + +--- + +## 📋 Fase 3 — Mejoras visuales y UX + +| # | Tarea | Prioridad | +|---|-------|-----------| +| 3.1 | **Print stylesheet**: `css/print.css` para impresión/PDF con formato limpio | 🟢 Alta | +| 3.2 | **Modo oscuro**: Soporte de tema claro/oscuro con `prefers-color-scheme` | 🟡 Media | +| 3.3 | **Transiciones**: Suavizar animaciones de sidebar,scroll y colapsos | 🟢 Alta | +| 3.4 | **Barra de progreso de lectura**: Indicador visual de cuánto llevás leído | 🟡 Media | +| 3.5 | **Responsive**: Mejorar la experiencia en tablets y celulares | 🟢 Alta | + +--- + +## 📋 Fase 4 — Funcionalidad y comportamiento + +| # | Tarea | Prioridad | +|---|-------|-----------| +| 4.1 | **Reproductor de video personalizado**: Skin propia sobre `