WebMCP: qué es y cómo preparar tu web para los agentes de IA

Hasta ahora, cuando un agente de IA (el asistente que navega por ti en Chrome, el que reserva o el que rellena un formulario) entra en tu web, hace lo mismo que haría una persona con los ojos vendados y mucha paciencia: lee el HTML, adivina qué es cada botón y prueba. WebMCP es la propuesta para que tu web le diga directamente qué puede hacer en ella y cómo.

Te explicamos qué es, en qué estado está (spoiler: todavía experimental), cómo se implementa con dos ejemplos de código y qué tiene sentido hacer hoy si tienes una web de empresa.

Qué es WebMCP

WebMCP es una propuesta de estándar web que permite a una página publicar «herramientas» (acciones con nombre, descripción y parámetros) para que los agentes de IA que funcionan dentro del navegador las usen sin tener que interpretar la interfaz.

Un ejemplo: en vez de que el agente busque el campo de fecha, abra el calendario, elija el día y adivine cuál es el botón de enviar, tu web expone una herramienta reservarCita que acepta una fecha y un nombre. El agente la llama y listo.

El nombre viene de MCP (Model Context Protocol), el protocolo con el que los asistentes se conectan a herramientas externas. WebMCP lleva esa idea a las páginas web, pero no es lo mismo: no hace falta montar un servidor; las herramientas viven en la propia página y se ejecutan en el navegador del usuario, con él delante.

En qué estado está (octubre de 2026)

  • Quién lo impulsa: se desarrolla en el Web Machine Learning Community Group del W3C, con editores de Google y Microsoft.
  • Estado del texto: es un borrador de grupo comunitario (Draft Community Group Report). No es un estándar del W3C y todavía puede cambiar.
  • Chrome: Google abrió una vista previa en febrero de 2026 y un origin trial (prueba con dominios registrados) a partir de Chrome 149, anunciado en junio de 2026.
  • Otros navegadores: sin soporte estable.

Traducido: es una apuesta de futuro, no algo que vaya a traerte clientes mañana. Pero Google ya lo mide en sus auditorías (lo vemos más abajo) y adaptar los formularios principales cuesta poco.

Cómo se implementa: dos formas

1. API declarativa: anotar un formulario HTML

Es la vía sencilla y la que más interesa a una web de empresa. Se añaden atributos a un formulario que ya existe:

  • toolname: el nombre de la herramienta.
  • tooldescription: qué hace, en lenguaje claro.
  • toolparamdescription: la descripción de cada campo.
  • toolautosubmit: si el agente puede enviar el formulario directamente. Sin él, el usuario tiene que pulsar «Enviar».
<form toolname="solicitarPresupuesto"
      tooldescription="Envía una solicitud de presupuesto a la agencia.">
  <label>Nombre <input name="nombre" required></label>
  <label>Email <input type="email" name="email" required></label>
  <label>¿Qué necesitas? <textarea name="mensaje"></textarea></label>
  <button type="submit">Enviar</button>
</form>

Cuando quien envía es un agente, el evento submit lo indica (agentInvoked), así que puedes tratar esos envíos aparte, por ejemplo para medirlos.

2. API imperativa: registrar herramientas con JavaScript

Para acciones que no son un formulario (filtrar un catálogo, consultar disponibilidad, añadir al carrito) se registran herramientas con JavaScript en document.modelContext. Este es el ejemplo de la documentación de Chrome:

const addTodoTool = {
  name: "addTodo",
  description: "Add a new item to the to-do list",
  inputSchema: {
    type: "object",
    properties: { text: { type: "string" } },
  },
  execute: async ({ text }) => {
    return `Added to-do: ${text}`;
  },
  annotations: { readOnlyHint: false, untrustedContentHint: true },
};
const controller = new AbortController();
await document.modelContext.registerTool(addTodoTool, { signal: controller.signal });
// Para retirar la herramienta más adelante:
controller.abort();

Ojo con los tutoriales antiguos: las primeras versiones usaban navigator.modelContext y métodos que ya no existen. La referencia actual es document.modelContext.

Cómo probarlo

  • Activa chrome://flags/#enable-webmcp-testing y reinicia Chrome.
  • Instala la extensión Model Context Tool Inspector de Chrome para ver qué herramientas expone tu página y probarlas.
  • Para usarlo con visitantes reales mientras dure la prueba, hay que registrar el dominio en el origin trial.

WebMCP en PageSpeed: la categoría «Navegación agéntica»

Lighthouse, el motor de PageSpeed Insights, ha añadido una categoría nueva, «Navegación agéntica», todavía marcada «en desarrollo». Comprueba:

  • que el árbol de accesibilidad esté bien formado (por ejemplo, que cada campo de formulario tenga su etiqueta);
  • la estabilidad visual de la página (CLS);
  • si tienes llms.txt y si sigue las recomendaciones;
  • la cobertura de WebMCP en tus formularios y las herramientas registradas. Si no usas WebMCP, salen como «no aplicable» y no restan.

Nuestro caso: el 19 de octubre bikain.studio sacaba 2/3 en esa categoría. El fallo no tenía nada que ver con WebMCP: las casillas de «servicios» del formulario de contacto no tenían su etiqueta asociada, y un agente (igual que un lector de pantalla) veía casillas sin nombre. Lo arreglamos con una opción de Contact Form 7 y pasó a 3/3, con la accesibilidad de 92 a 97.

La lección: antes que WebMCP, lo que más pesa hoy es lo básico. Un agente usa tu web como lo haría una persona con un lector de pantalla.

Qué haría hoy una web de empresa

  1. Arreglar la accesibilidad de los formularios. Cada campo con su etiqueta, botones con texto claro y nada importante escondido en imágenes. Mejora la conversión y la puntuación de PageSpeed.
  2. Revisar que la IA puede leer tu web: contenido en el HTML, no solo cargado con JavaScript, y sin bloquear a los rastreadores de IA. Puedes comprobarlo con nuestro test de lectura para IA.
  3. Publicar un llms.txt correcto. Es barato, aunque su efecto real todavía es limitado.
  4. Anotar con WebMCP el formulario principal (contacto, presupuesto o reserva), con los atributos declarativos y sin toolautosubmit, para que la persona confirme el envío. Si el navegador no lo soporta, los atributos se ignoran y no rompen nada.
  5. Dejar la API imperativa para cuando haga falta: tiendas, reservas y catálogos, una vez el estándar se estabilice.

Todo esto forma parte de lo que llamamos SEO agéntico: preparar tu web para que los agentes de IA, además de leerla, puedan usarla. Tienes las definiciones en nuestro glosario GEO.

Preguntas frecuentes

¿WebMCP mejora mi posicionamiento en Google?

No hay ninguna señal de que WebMCP influya en el ranking de Google. Lo que sí cuenta, y PageSpeed ya lo mide, es la accesibilidad y la estabilidad de la página.

¿Es lo mismo que llms.txt?

No. llms.txt es un archivo de texto que orienta a los modelos sobre qué contenido leer. WebMCP permite que un agente haga cosas en tu web: enviar un formulario, consultar, reservar.

¿Lo uso ya en producción?

Los atributos declarativos en un formulario no rompen nada en navegadores que no los entienden, así que se pueden añadir ya. La API imperativa, mejor en pruebas: el estándar todavía cambia.

¿Qué agentes lo usan?

Está pensado para agentes que funcionan dentro del navegador, con el usuario delante. A día de hoy está en fase de prueba en Chrome y su uso real todavía es pequeño.

¿Quieres saber cómo ven tu web los agentes y los asistentes de IA? En nuestra agencia GEO lo medimos y lo arreglamos.