01 / SITIO
Un jardín digital hecho a medida
Diseñé y construí este sitio para reunir mi trayectoria, proyectos, notas y referencias en un mismo lugar. Es una web personal y también un espacio de trabajo: algunas páginas están terminadas y otras cambian a medida que aparecen nuevas ideas y conexiones.
La estructura se ha diseñado específicamente para el contenido, en lugar de adaptar las piezas a una plantilla o a un gestor de contenidos generalista.
02 / TECNOLOGÍA
Una base estática y ligera
Astro genera las páginas como HTML estático. La interfaz está construida con HTML semántico, CSS propio y una pequeña cantidad de JavaScript sin framework para los menús, filtros, búsquedas y carruseles.
- Astro 7Generación estática y rutas
- TypeScriptTipos y lógica de contenido
- Markdown y MDXTextos y componentes editoriales
- CSSDiseño, tokens y comportamiento responsivo
- PlaywrightPruebas de interfaz y accesibilidad
- pnpmDependencias y tareas del proyecto
03 / CONTENIDO
Archivos antes que un CMS
El contenido vive en archivos Markdown, MDX y JSON dentro del repositorio. Lo escribo y edito directamente en el código; las colecciones de Astro validan sus metadatos durante el build antes de generar una página.
Este sistema mantiene cerca el texto, la estructura y el diseño. También permite que una nota sea un borrador, que un proyecto tenga un periodo de varios años o que una referencia de Mediateca combine una portada, un vídeo y conexiones con otras entradas.
04 / DISEÑO
Tipografía, retícula y materiales locales
Los títulos, el texto de lectura y los metadatos usan una pila de sistema basada en Helvetica Neue; Georgia aporta el énfasis editorial en cursiva. No se descargan ni se empaquetan fuentes web. Una retícula técnica, una paleta contenida y un conjunto compartido de tokens ordenan los ritmos, tamaños, estados de foco y cambios responsivos.
Las imágenes también son locales. Se preparan al tamaño útil antes de incorporarlas para mantener la salida sencilla y evitar una capa adicional de servicios externos.
05 / CONEXIONES
Enlaces en ambas direcciones
Notas, Mediateca y Portafolio forman un pequeño grafo editorial. Cada entrada declara sus relaciones una sola vez y el sitio calcula los enlaces de vuelta durante el build. El resultado funciona sin una base de datos y sin enviar JavaScript adicional al navegador.
06 / PUBLICACIÓN
Un conjunto de archivos listo para servir
El proyecto se versiona con Git y se mantiene en GitHub. Antes de publicar, el proceso comprueba formato, tipos, rutas, accesibilidad, comportamiento responsivo y presupuestos de peso. El build final se guarda en dist y puede servirse desde cualquier alojamiento estático, sin servidor de aplicación ni base de datos.
07 / REFERENCIA
Inspiración para el colofón
Un colofón explica los materiales y decisiones que hay detrás de una publicación. La organización de esta página toma como referencia el colofón de Maggie Appleton, adaptado a la arquitectura y al proceso de este sitio.