Modern Web Guidance: guías de Chrome para agentes de IA

Modern Web Guidance: el paquete gratuito que corrige a tu agente de código

El 88% de las comprobaciones automáticas las pasaron los agentes de código que trabajaron con Modern Web Guidance. Los que no lo usaron se quedaron en 56%. Son las cifras del dashboard público de evaluaciones que revisó Search Engine Journal sobre las ejecuciones nocturnas completadas el 8 de noviembre, con un rango de 199 a 215 tareas por agente.

Para un founder que ya delegó buena parte de su producto a un agente, ese salto no es un detalle de ingeniería: es la diferencia entre refactorizar el mismo módulo dos veces o no refactorizarlo nunca.

Modern Web Guidance es un conjunto de guías gratuitas que se instalan dentro del agente de código para que escriba con las capacidades actuales del navegador en lugar de repetir patrones heredados. El proyecto lo custodian los equipos de Google Chrome, Microsoft Edge, Mozilla Firefox y MDN, junto a la comunidad de desarrollo web, según la documentación del repositorio oficial.

Leíste lo que hace la IA. ¿Y en tu negocio?

Un agente de IA puede quedarse con parte de tu día: ordenar lo pendiente y pedirte el OK antes de actuar. El Kit «tu mano derecha con IA» trae un video de 11 minutos y una ficha para dejar al tuyo trabajando. CAR está cerrada por ahora; al anotarte, te avisamos cuando abra.

👥 Quiero el Kit →

¿Por qué los agentes escriben como si fuera 2019?

La explicación está en el propio proyecto: los datos de entrenamiento de los modelos contienen cantidades enormes de código legado, así que el agente tiende a reproducir soluciones que ya sobraban. El resultado típico es JavaScript inflado para tareas que hoy resuelve la plataforma web de forma nativa y más rápida.

Hay un segundo problema, más sutil: incluso cuando el modelo sabe que una API existe, no tiene la densidad de ejemplos de implementación real como para escribir código listo para producción. La guía cubre justamente ese hueco con patrones concretos.

Search Engine Journal añade un dato que explica por qué el proyecto existe: en las pruebas de Google, los modelos actuales siguen fallando en accesibilidad, en cabeceras de seguridad y en la prioridad de carga de scripts e imágenes.

Cómo se instala y qué hace la CLI

La instalación es un comando dentro del directorio del proyecto: npx modern-web-guidance@latest install. Eso lanza un asistente interactivo. Según Search Engine Journal, también está disponible a través de los marketplaces de plugins de la mayoría de los agentes de código populares.

La herramienta de línea de comandos resuelve tres operaciones distintas:

Buscar guías por caso de uso: npx modern-web-guidance@latest search "animate a dialog modal backdrop".
Recuperar una guía por identificador: npx modern-web-guidance@latest retrieve "animate-to-from-top-layer".
Escanear código heredado en busca de patrones a modernizar: npx modern-web-guidance@latest legacy-scan .

La versión 1.0, cuyo lanzamiento reporta Search Engine Journal, suma una auditoría que recorre los archivos HTML, CSS y JavaScript del proyecto además del package.json para detectar dónde se puede actualizar el código con seguridad, y luego acompaña al agente en el cambio. Esa primera iteración usa análisis estático sobre un número limitado de patrones, según la publicación de Philip Walton, senior staff developer relations engineer de Google, en el blog de Chrome for Developers.

El catálogo contiene 203 casos de uso reales de desarrolladores, según el repositorio, y las guías están escritas para ser eficientes en tokens: el equipo corre evaluaciones para podar el contenido que los modelos ya dominan.

Qué cubre: de transiciones de vista a la traducción en el dispositivo

El alcance es amplio y conviene leerlo como un mapa de lo que tu agente debería estar usando y probablemente no usa:

Estados visuales suaves: View Transitions, animaciones de entrada y salida, parallax, scrollbar-color en CSS.
Sistemas de layout modernos: container queries, subgrid, espacios de color como oklch, ajuste de text-wrap y recorte de interlineado.
Optimización de velocidad: precarga instantánea, diagnóstico de Interaction to Next Paint (INP) y programación de tareas con scheduler.yield.
Componentes nativos: Anchor Positioning para tooltips, Popover API, diálogos y campos que ajustan su tamaño automáticamente.
Modelos locales en el cliente: APIs nativas de traducción, resumen y detección de idioma.
Accesibilidad: operabilidad con teclado y lectores de pantalla, anuncio de errores de formulario solo después de la interacción.

El principio de diseño es consistente: preferir APIs que el navegador puede optimizar y que traen accesibilidad incorporada, y cuando hace falta un respaldo, que sea liviano en lugar de un polyfill pesado o una librería legada.

Los números: qué dicen las evaluaciones y qué dicen los críticos

El caso más citado es el de note inc., la plataforma japonesa de creadores, que probó dos agentes de código en seis tareas de interfaz sobre una copia de su base de código de producción, con 180 ejecuciones en total. Medidos contra 19 comprobaciones de navegador, un agente pasó de 60,8% a 76,5% solo con instalar la guía, y a 94,0% cuando además se la nombraba en el prompt. El segundo pasó de 75,8% a 86,2% y luego a 90,0%.

Hay un ejemplo que ilustra bien el tipo de error: en una tarea sobre la imagen principal de un artículo, los agentes sin guía escribieron código que marcaba esa imagen como de alta prioridad y a la vez con carga diferida, dos instrucciones contradictorias.

MetaMask lo corre como parte de su revisión automática de cada pull request a su extensión de navegador de código abierto. En las primeras cinco semanas, hasta el 21 de octubre, el bot identificó 102 problemas en 57 pull requests. Los ingenieros resolvieron por completo 43, parcialmente tres, y descartaron 16 entre rechazados y falsos positivos; 20 quedaron sin atender.

El contrapeso también existe. El consultor de accesibilidad Adrian Roselli evaluó la versión preview en mayo con Antigravity, la herramienta de código de Google, y encontró que la salida no cumplía con WCAG y que la animación no funcionaba en Firefox. Era la preview, no la 1.0, pero el punto sigue en pie: la guía acerca al agente al estándar, no lo garantiza. Y en la mayoría de las suites recientes, las ejecuciones con guía tardaron más y consumieron más tokens.

La gobernanza: seis asientos y ninguno para Apple

Un detalle relevante para quien evalúa adoptarlo: el 9 de noviembre se subió al repositorio un documento de gobernanza que reparte seis asientos de propiedad del proyecto. Dos son de Chrome, uno de Microsoft Edge, uno de Mozilla y dos quedan para expertos independientes de la plataforma web. Actualmente hay un asiento independiente libre y ninguno pertenece a Apple, según Search Engine Journal.

Que Edge y Mozilla se hayan sumado a un proyecto que nació en Chrome es la señal más importante del anuncio: el objetivo declarado es que las guías empujen hacia estándares que funcionen en varios navegadores, no hacia peculiaridades de un solo motor.

Contexto adicional: SD Times sitúa el proyecto dentro de la estrategia de «Agentic Web» que Google presentó en Google I/O de 2026, donde también se anunciaron Chrome DevTools for Agents para que el agente pueda ejecutar su propio código y depurarlo dentro del navegador.

¿Qué significa esto para tu startup?

Si tu equipo usa agentes de código a diario, el problema ya no es la velocidad de generación: es la calidad del contexto con el que el agente decide. Un archivo de guías cuesta cero y se instala en minutos; una refactorización de frontend cuesta semanas.

Tres cosas concretas que puedes hacer esta semana:

Corre el escaneo antes de tocar nada. Ejecuta legacy-scan sobre el repositorio y usa la lista de hallazgos como backlog priorizado. Al ser análisis estático sobre patrones limitados, vas a obtener pocas sugerencias pero baratas de validar; el juicio sobre qué aplicar sigue siendo tuyo.
Nombra la guía en tus prompts. Los datos de note inc. muestran que parte del salto aparece solo por instalar, pero el mayor salto llega cuando el prompt la menciona de forma explícita. Si tu equipo tiene plantillas de prompt internas, añade esa instrucción ahí.
Mide con tus propias comprobaciones. Las cifras del dashboard son de Google y de clientes que Google destacó, con aserciones definidas por el propio proyecto. Arma una prueba con tu componente más crítico, mismo prompt con y sin guía, y compara accesibilidad con teclado y comportamiento en Safari además de Chrome. La propia documentación aclara que la revisión de accesibilidad no equivale a una auditoría WCAG completa.
Revisa la telemetría si tu código es sensible. El proyecto describe telemetría anónima de uso que incluye instalaciones, identificadores de guías y consultas de búsqueda, con opción de desactivarla mediante la variable de entorno DISABLE_TELEMETRY-1. La búsqueda semántica de la CLI corre localmente; el agente sigue siendo el que escribe el código.

El riesgo a vigilar es el de siempre con estas capas: instalar la guía y bajar la guardia. Roselli encontró incumplimientos en la preview y MetaMask vio un 28% de hallazgos descartados como falsos positivos o rechazados. La guía orienta al agente; la revisión de código y las pruebas en navegador real siguen siendo el filtro final.

Conclusión

Modern Web Guidance es una pieza pequeña con un efecto desproporcionado: no cambia el modelo, cambia lo que el modelo tiene delante cuando decide cómo resolver un problema de interfaz. Para equipos con recursos limitados, que es la mayoría del ecosistema hispanohablante, es la forma más barata de evitar que un agente reescriba en JavaScript lo que el navegador ya resuelve solo. Adóptalo, pero mide: la diferencia entre el 56% y el 88% es real y también es un promedio de tareas ajenas a tu producto.