Rediseño minimalista, landing completa, rendimiento, SEO y GEO

Céss Whiterequested to merge
cesswhite/sitio:rediseno-minimalista into master

Rediseño integral del sitio con un sistema visual propio, minimalista y sin dependencias externas, junto con optimizaciones de rendimiento, SEO y GEO.

Diseño y CSS

  • Se reemplaza Pico CSS y los temas mxos-theme.css/mxos.css/fonts.css por una sola hoja de estilos propia (assets/css/main.css) basada en tokens.
  • Se eliminan degradados, bordes, sombras, etiquetas decorativas y efectos innecesarios; la jerarquía se construye con tipografía, espacio y tono.
  • Tipografía Geist y Geist Mono servidas localmente (sin Google Fonts).
  • Paleta neutra con el verde de la marca solo como acento; modo claro y oscuro con tokens y contraste AA en textos secundarios.
  • Encabezado ligero con menú móvil a pantalla completa y cambio de tema.
  • Footer con marca, columnas de enlaces (Proyecto, Fundación, Comunidad) y barra inferior con licencias.

Página de inicio (layouts/home.html + data/home.yaml)

  • Hero a pantalla casi completa con cifras reales del proyecto.
  • Visión y enfoque: cuatro principios, cada uno enlazado a su evidencia.
  • Línea de tiempo interactiva y accesible (tabs con teclado) de los avances: Forgejo, Fase 1, espejos IPFS y Fase 2.
  • Selector por tipo de público con beneficios y llamado a la acción.
  • Novedades: últimas tres publicaciones de Blog y Noticias con portada.
  • Preguntas frecuentes en acordeón con animación (respeta prefers-reduced-motion).
  • Proceso de participación en cuatro pasos (comunidad, elegir, fork y merge request, revisión) y accesos rápidos.
  • Llamado final reutilizable (partials/cta.html), también al final de cada artículo.
  • Secciones con ritmo vertical amplio y bandas de fondo alternas.
  • Los textos de la portada viven en data/home.yaml; el cuerpo de content/_index.rst ya no se muestra en la portada.

Otras páginas

  • Encabezados centrados en todas las páginas internas.
  • Blog y Noticias como cuadrícula de tarjetas con portada y resumen.
  • Contacto con tarjetas por canal; Gracias con menciones especiales y cuadrícula de patrocinadores; Cuentas con tabla sin bordes y cifras tabulares.
  • Artículos con portada amplia, metadatos discretos, etiquetas y navegación anterior/siguiente.

Correcciones

  • Los títulos de artículos se mostraban envueltos en HTML de docutils (markdownify sobre RST); ahora se muestran como texto.
  • Fechas en español con formato largo.
  • Se elimina el enlace a apple-touch-icon.png, que no existía.

Rendimiento

  • Portadas responsivas en WebP (640/1024/1600) con srcset y fetchpriority; la portada de Koji pasa de 6.5 MB (PNG) a ~70 KB.
  • Las imágenes originales de los artículos ya no se publican; solo sus versiones optimizadas y las que el contenido referencia. El sitio compilado pasa de ~10 MB a ~2.2 MB.
  • Imágenes del contenido con loading="lazy" y decoding="async".
  • Logo SVG optimizado (17 KB a 9 KB) conservando la atribución CC BY-SA.
  • HTML, CSS y JS minificados; CSS concatenado y con huella para caché.
  • El CI genera versiones .gz y .br que GitLab Pages sirve directamente.
  • Lighthouse: rendimiento 98-99, SEO 100, buenas prácticas 100.

SEO

  • Metadatos completos: descripción, robots, canonical, hreflang es-MX, theme-color, Open Graph con imagen 1200x630 por artículo y tarjetas summary_large_image.
  • Datos estructurados JSON-LD: Organization, WebSite, SoftwareApplication, FAQPage, BreadcrumbList y BlogPosting/NewsArticle.
  • robots.txt generado con referencia al sitemap; manifest web.

GEO (motores generativos)

  • /llms.txt generado desde el contenido: resumen del proyecto, datos clave, avances, preguntas frecuentes y lista de artículos.
  • robots.txt permite explícitamente a los rastreadores de asistentes de IA.

Puntos a revisar

  • Los textos de la portada (beneficios por público, respuestas del FAQ y descripciones de Blog/Noticias) son nuevos; conviene que el equipo los valide.
  • Los textos de la portada ahora se editan en data/home.yaml. El cuerpo de content/_index.rst ya no se muestra.
  • La compresión .gz/.br del CI se verá en el primer despliegue a Pages.

Cómo probarlo localmente

make dev

Requiere hugo extended, docutils y git lfs pull para las imágenes.

Merge request reports