Y yo que estaba orgulloso…

💡 La falsa ilusión de tener una web “perfecta”

Todos nos sentimos orgullosos cuando lanzamos o rediseñamos nuestra web personal: un diseño cuidado, buenos contenidos, tipografía elegante y un par de animaciones sutiles. Todo parece perfecto hasta que decides someter tu web a las auditorías exigentes de la web moderna: velocidad móvil, accesibilidad WCAG 2.1, cabeceras de seguridad HTTP y, sobre todo, la nueva frontera: la preparación para Agentes de Inteligencia Artificial (Agent Readiness).

En este artículo muestro el proceso real, paso a paso y con código en mano, de cómo transformé davidbuenov.com sometiéndola a 6 auditorías independientes, los problemas reales que surgieron en el camino (¡incluido un desplome visual completo por exceso de celo en seguridad!) y los aprendizajes que deja este viaje.

📊 El cuadro de mandos: antes y después

Porque solo mostrar los buenos resultados finales sería hacer trampa. Aquí el punto de partida real, capturas del estado de la web antes de las optimizaciones de este artículo:

Auditoría	🔴 Antes	🟢 Después	Δ
🤖 IsItAgentReady	88/100 (Discoverability 75%)	95/100 (Discoverability 100%)	+7 pts
⚡ PageSpeed · Rendimiento (escritorio)	88/100	92/100	+4 pts
⚡ PageSpeed · Rendimiento (móvil)	68/100	85/100	+17 pts
♿ PageSpeed · Accesibilidad	97/100	97/100	✅
📋 PageSpeed · Prácticas Rec.	92/100	92/100	✅
🔍 PageSpeed · SEO	92/100	93/100	+1 pt
🛡️ Security Headers	Grado D	Grado A	↑
🔭 Mozilla Observatory	45/100 (C-)	75/100 (B)	↑
🔍 SEOptimer	B+ (Usabilidad C, Enlaces D)	No Medido	≈
♿ WAVE Accessibility	4.9/10 (10 errores)	5.8/10	+0.9 pts
🌐 HubSpot Website Grader	82/100 (Performance 12/30)	— (pendiente)	↑

💡 ¿Por qué el punto de partida ya es razonablemente bueno? Porque el grueso del trabajo de Agent Readiness (de 0 a 94) se documentó en el artículo anterior. Este artículo narra la siguiente capa: seguridad HTTP, accesibilidad profunda y los detalles que marcan la diferencia entre “casi bien” y “bien de verdad”.

🤖 1. La Nueva Frontera: Agent Readiness (95/100), ARD y WebMCP

Adaptar una web para la era de los agentes de IA (ChatGPT, Claude, Gemini, Perplexity) va mucho más allá de colgar un simple archivo llms.txt.

📖 ¿Quieres el paso a paso completo? En mi artículo anterior, ¿Está tu web lista para la IA? Mi viaje adaptando davidbuenov.com a los LLMs, cuento desde cero todo el proceso: qué es el descubrimiento semántico para LLMs, cómo implementé llms.txt, el manifiesto ARD y WebMCP, y por qué el 95/100 de Agent Readiness no fue un golpe de suerte sino el resultado de semanas de trabajo.

A. Evaluaciones AgentReady (95/100 A) e IsItAgentReady (95/100)

Sometí la web a dos auditores agénticos independientes:

AgentReady.md: Calificación 95/100 (Grado A).
IsItAgentReady.com: Calificación 95/100 y 3/3 en Navegación Agéntica.

B. Descubrimiento Semántico ARD 1.0.0 (Agentic Resource Discovery)

Implementé la especificación oficial ARD creando el manifiesto /.well-known/ai-catalog.json:

Formato URN estandarizado.
Tipos IANA explícitos.
Consultas representativas: 2 a 5 ejemplos de preguntas reales por recurso para embeddings semánticos.
Cabecera HTTP explícita y CORS abierto.

C. WebMCP: Herramientas para el navegador del Agente

Integré la API WebMCP registrando window.webMCP y navigator.modelContext.provideContext(). La web expone dos herramientas ejecutables para los agentes:

getProfileData: Devuelve el perfil profesional estructurado, publicaciones y líneas de investigación.
searchContent: Permite al agente buscar artículos, proyectos o conferencias por palabras clave.

⚡ 2. Google PageSpeed Insights: Desglosando el 85 / 97 / 92 / 93

Someter una página con rich media y animaciones a Google PageSpeed Insights suele ser un golpe de realidad. Tras una profunda optimización de activos:

Rendimiento: 85 / 100
Accesibilidad: 97 / 100 🟢
Prácticas Recomendadas: 92 / 100
SEO: 93 / 100

Las claves: carga diferida de CSS no crítico, precarga de imagen LCP con fetchpriority="high", y atributos defer y loading="lazy" en todos los recursos secundarios.

🛡️ 3. Seguridad HTTP: Cabeceras Estrictas y el Dilema del 100/100

Conseguir un Grado A en SecurityHeaders.com requiere configurar en firebase.json: HSTS, X-Frame-Options, X-Content-Type-Options, Referrer-Policy y Permissions-Policy.

⚠️ La anécdota del “exceso de celo”

Buscando el 100/100 en Mozilla Observatory, eliminé 'unsafe-inline' del CSP… y la web murió visualmente. El tema Canvas/jQuery necesita esos scripts inline para calcular layouts.

El aprendizaje: la ciberseguridad real es equilibrar protección con usabilidad. Un Grado A con 75/100 en Mozilla y web funcional al 100% es mejor que un 100/100 teórico con la web rota.

♿ 4. Accesibilidad Universal (WCAG 2.1) — 97/100

aria-label completo en buscador, chatbot y botones de envío.
Todos los iconos sociales y controles incluyen texto accesible para lectores de pantalla y agentes de IA.

🔍 5. Auditoría SEO (SEOptimer B+)

Metadatos canónicos, sitemap XML y robots.txt indexables.
JSON-LD Schema.org con entidad personal, publicaciones y trayectoria.
Open Graph y Twitter Cards completos.

📊 6. Transparencia Total: Dashboard de Badges

Para predicar con el ejemplo, el pie de página de davidbuenov.com muestra un dashboard de badges vivos (Shields.io) enlazados a cada auditoría pública: IsItAgentReady, AgentReady.md, Mozilla Observatory, SecurityHeaders, SEOptimer y las 4 métricas de PageSpeed.

📌 Conclusión: Orgulloso, pero con datos en la mano

Adaptar una web personal a los estándares de 2026 no va de vanidad ni de coleccionar badges; se trata de garantizar que tu contenido sea rápido, seguro, accesible y comprensible para la nueva ola de IA Agéntica.

Si tienes una web de la que te sientes orgulloso, pásale estos 6 análisis. Descubrirás que siempre hay margen para mejorar. 🚀

Y yo que estaba orgulloso...