Cómo está hecha esta web
Las revistas impresas cierran con un colofón: papel, tipos y taller. Esta es la versión digital, y la mejor prueba de cómo trabajo.
En directo
Medida ahora mismo, en tu dispositivo
No te pido que confíes en una captura de PageSpeed: tu navegador está midiendo esta página mientras la lees.
Carga (LCP)
…
Midiendo…
Cuánto tarda en pintarse el contenido principal.
Estabilidad (CLS)
…
Midiendo…
Cuánto salta el contenido mientras navegas.
Respuesta (INP)
…
Midiendo…
Cuánto tarda la página en responder a tus interacciones.
Carga completa
…
Midiendo…
Tiempo hasta que tu navegador terminó de cargarlo todo.
Tu navegador no expone las APIs de medición de rendimiento; prueba desde Chrome o Edge para ver los datos en directo.
El taller
Construida sin atajos
Las decisiones técnicas de esta web son las mismas que defiendo en los proyectos de mis clientes: menos piezas, mejor elegidas.
Generación estática con Next.js y React
Cada página se construye de antemano y se sirve como HTML ya renderizado. No hay servidor esperando peticiones ni base de datos que consultar en cada visita.
Contenido versionado en Git, sin CMS pesado
Los artículos y proyectos viven como archivos de texto en el repositorio (Keystatic). Sin base de datos que mantener, atacar o que se caiga.
Distribución en el borde de la red
La web se sirve desde la red global de Cloudflare: el HTML viaja desde el punto más cercano a quien visita, no desde un único servidor.
CSS artesanal, sin framework
Todo el sistema visual (tokens, componentes, composición editorial) está escrito a medida. Sin Bootstrap, sin Tailwind, sin kilos de utilidades sin usar.
Los tipos
Tipografía con intención
Dos familias variables, 96 KB en total, servidas desde este dominio. El carácter editorial de la web empieza aquí.
Fraunces, para los titulares
Una serif de display con carácter de imprenta. Fuente variable: una sola descarga de 66 KB cubre todos los pesos y estilos.
Instrument Sans, para el cuerpo
Una sans humanista clara y cercana. También variable: 30 KB para toda la familia.
Auto-alojadas, sin Google Fonts
Las fuentes se sirven desde este mismo dominio. Ninguna petición a servidores de terceros por tipografía: más velocidad y más privacidad.
Microtipografía
Titulares balanceados para evitar líneas viudas, párrafos compuestos con text-wrap pretty y selección de texto en verde de marca. Detalles que se notan sin verse.
La capa invisible
Semántica y GEO
Lo que no se ve es lo que hace que buscadores y sistemas de IA entiendan y citen esta web.
Datos estructurados en cada página
JSON-LD con las entidades del negocio: persona, empresa local, servicios, artículos y preguntas frecuentes. Los buscadores y los modelos de lenguaje no tienen que adivinar nada.
Arquitectura de entidades coherente
Cada página declara qué es, de qué trata y cómo se relaciona con el resto. La web funciona como un sistema, no como páginas sueltas.
Preparada para motores generativos
Jerarquía clara de encabezados, contenido fragmentable y respuestas directas: la base GEO que aplico a mis clientes, aplicada aquí primero.
Respeto
Privacidad y cuidado
Una web de calidad también se mide en cómo trata a quien la visita.
Analítica solo con tu consentimiento
Google Analytics arranca con el almacenamiento denegado por defecto (Consent Mode v2). Hasta que no aceptas las cookies, no hay medición.
Movimiento que respeta tus preferencias
Todas las animaciones, incluido el lienzo generativo de la portada, se desactivan si tu sistema indica prefers-reduced-motion.
Funciona sin conexión
La web es una PWA con página offline propia. Y si algo se rompe, hasta el error 404 tiene un pequeño juego.