---
title: "WebMCP: o que é e como preparar o site para agentes de IA"
url: "https://patrickperdigao.com.br/blog/webmcp"
description: WebMCP é a proposta do Google e da Microsoft para sites oferecerem ferramentas a agentes de IA no navegador. Veja como funciona, o status e como implementar.
author: Patrick Perdigão
author_url: "https://patrickperdigao.com.br/"
published: 2026-10-17
updated: 2026-10-17
category: SEO Técnico
tags: WebMCP, agentes de IA, MCP, Chrome, formulários, GEO, SEO técnico
reading_time: 10 min
---

# WebMCP: o que é e como preparar o site para agentes de IA

> WebMCP é a proposta do Google e da Microsoft para sites oferecerem ferramentas a agentes de IA no navegador. Veja como funciona, o status e como implementar.

Por Patrick Perdigão · Publicado em 17 out 2026 · 10 min de leitura · Tema: [SEO Técnico](https://patrickperdigao.com.br/blog/tema/seo-tecnico.md)

## TL;DR

WebMCP é uma proposta de padrão web em que a própria página registra "ferramentas" (buscar, filtrar, agendar, finalizar compra) que um agente de IA no navegador pode chamar, em vez de adivinhar onde clicar. Há dois jeitos de implementar: anotando formulários HTML com toolname e tooldescription, ou registrando ferramentas em JavaScript com document.modelContext.registerTool(). O Chrome oferece a API em origin trial desde a versão 149, mas a especificação ainda é um rascunho de grupo comunitário do W3C e quase nenhum agente popular consome essas ferramentas.

1. WebMCP não substitui SEO nem GEO: ele atua quando um agente já está na sua página e precisa executar uma tarefa.
2. Formulários bem feitos, com label em cada campo, já são meio caminho: a API declarativa usa os labels como descrição dos parâmetros.
3. Vale testar agora em uma ou duas ações principais, como implementação progressiva, sem depender disso para nada.

## O que é WebMCP?

**WebMCP é uma proposta de padrão web em que a página registra ferramentas (com nome, descrição e parâmetros) para que agentes de IA no navegador executem tarefas no site de forma estruturada.** Em vez de o agente ler a tela e adivinhar em que botão clicar, o site diz: "aqui está a ferramenta `buscar_produtos`, ela recebe estes parâmetros e devolve isto".

Hoje, um agente que navega por você (para comparar preços, preencher um formulário ou marcar um horário) trabalha como uma pessoa que nunca viu o site: tira prints, procura campos, tenta clicar. Isso é lento, caro e quebra quando o layout muda. O WebMCP troca o "clicar no lugar certo" por uma chamada de função.

O nome vem do MCP, o Model Context Protocol, criado pela Anthropic para conectar agentes a ferramentas externas. A diferença é onde a ferramenta mora:

| | MCP | WebMCP |
| --- | --- | --- |
| Onde roda | Em um servidor separado | Dentro da página aberta no navegador |
| Quem mantém | Você publica e opera o servidor | O próprio código do site |
| Login e sessão | Precisa de autenticação própria | Usa a sessão do usuário no navegador |
| Para quem | Agentes em apps e IDEs | Agentes que operam no navegador |
| Exemplo | Um servidor que consulta o estoque pela API | Um formulário de busca que o agente chama direto |

## Em que pé está o WebMCP?

**É uma proposta em teste: o Chrome oferece a API em origin trial, e a especificação é um rascunho de grupo comunitário do W3C, não um padrão.** Ela é editada por Brandon Walderman, da Microsoft, e por Khushal Sagar e Dominic Farolino, do Google.

| Data | O que aconteceu |
| --- | --- |
| 10/02/2026 | O Chrome abre a prévia do WebMCP para desenvolvedores, atrás de uma flag |
| 2026 | A API muda de `navigator.modelContext` para `document.modelContext` |
| Chrome 149 | Começa a origin trial, que permite testar em sites reais |
| 16/10/2026 | Versão mais recente do rascunho da especificação no W3C |

> [!WARNING] Ainda pode mudar bastante
> O próprio Chrome descreve o WebMCP como um padrão proposto, em discussão e sujeito a mudanças. A troca de `navigator.modelContext` para `document.modelContext` no meio de 2026 é um exemplo: código escrito no começo do ano já precisou de ajuste.

E a adoção? Análises independentes de meados de 2026 apontam que quase nenhum site implementou o WebMCP e que os agentes mais usados ainda não consomem essas ferramentas. As extensões de exemplo do Chrome usam o Gemini pela API, e o próprio Chrome avisa que elas são separadas do Gemini no Chrome. Ou seja: é um tema para preparar, não para esperar resultado amanhã.

## Onde o WebMCP entra no SEO e no GEO?

**Depois da busca: quando um agente já chegou à sua página e precisa concluir uma tarefa.** SEO e GEO cuidam de ser encontrado e citado; o WebMCP cuida de ser usável por quem não é humano.

| Camada | Pergunta que responde | O que fazer |
| --- | --- | --- |
| SEO | O buscador encontra e indexa a página? | Rastreamento, indexação, conteúdo |
| GEO | A IA cita o meu conteúdo na resposta? | Conteúdo citável, entidade, fontes |
| Acesso de robôs | Os robôs de IA conseguem entrar no site? | Regras de CDN e `robots.txt` |
| WebMCP | Um agente consegue executar uma tarefa no site? | Ferramentas para as ações principais |

Se você ainda está estruturando as duas primeiras camadas, comece pelo [guia sobre GEO](https://patrickperdigao.com.br/blog/o-que-e-geo). E nada disso funciona se o CDN barra os agentes antes de eles chegarem à página, o que acontece com mais frequência do que parece, como mostra o post sobre o [Cloudflare e os robôs de IA](https://patrickperdigao.com.br/blog/cloudflare-robos-de-ia).

## Como implementar com formulários HTML (API declarativa)?

**Adicione os atributos `toolname` e `tooldescription` a um formulário: o navegador transforma o formulário em uma ferramenta e os campos viram os parâmetros.** É o caminho mais simples, quase sem JavaScript.

```html busca.html
<form toolname="buscar_artigos"
      tooldescription="Busca artigos do blog sobre SEO, GEO e growth por palavra-chave."
      action="/blog/artigos">
  <label for="q">Palavra-chave</label>
  <input id="q" type="search" name="q" required>
  <button type="submit">Buscar</button>
</form>
```

Os atributos disponíveis:

| Atributo | Onde vai | Para que serve |
| --- | --- | --- |
| `toolname` | `<form>` | Nome da ferramenta, baseado no que ela faz |
| `tooldescription` | `<form>` | O que a ferramenta faz e quando usar |
| `toolautosubmit` | `<form>` | Envia o formulário sozinho quando o agente chama a ferramenta |
| `toolparamdescription` | Campo (`input`, `select`...) | Descrição do parâmetro; sem ele, o navegador usa o `<label>` ou o `aria-description` |

Repare no último item: se o campo tem `<label>`, o navegador já usa o texto do label como descrição do parâmetro. Formulários acessíveis estão, na prática, meio prontos para agentes.

Para devolver uma resposta ao agente (ou um erro de validação), o evento de envio ganhou o `agentInvoked` e o `respondWith()`:

```js
form.addEventListener('submit', (e) => {
  if (!e.agentInvoked) return; // envio feito por uma pessoa: segue normal
  e.preventDefault();
  e.respondWith(buscarArtigos(new FormData(form).get('q')));
});
```

Há ainda duas pseudo-classes CSS, `:tool-form-active` e `:tool-submit-active`, para mostrar ao usuário que o agente está usando aquele formulário.

## Como implementar com JavaScript (API imperativa)?

**Chame `document.modelContext.registerTool()` com o nome, a descrição, o esquema dos parâmetros (JSON Schema) e a função que executa a ação.** É o caminho para ações que não são um formulário, como filtrar uma lista, mudar uma configuração ou montar um carrinho.

```js webmcp.js
if ('modelContext' in document) {
  const controle = new AbortController();

  document.modelContext.registerTool({
    name: 'filtrar_por_tema',
    title: 'Filtrar artigos por tema',
    description: 'Lista os artigos do blog de um tema. Use quando o usuário pedir artigos sobre um assunto específico.',
    inputSchema: {
      type: 'object',
      properties: {
        tema: { type: 'string', enum: ['seo-tecnico', 'geo-aeo', 'entity-seo', 'conteudo', 'growth'] },
      },
      required: ['tema'],
    },
    annotations: { readOnlyHint: true },
    execute: async ({ tema }, { signal }) => {
      const res = await fetch(`/blog/tema/${tema}`, { signal });
      return res.ok ? `Artigos de ${tema} abertos em /blog/tema/${tema}` : 'Tema não encontrado';
    },
  }, { signal: controle.signal });

  // Para remover a ferramenta depois: controle.abort();
}
```

O `if ('modelContext' in document)` garante que nada roda em navegadores sem suporte, que hoje são quase todos. É implementação progressiva: quem não tem a API não carrega nada a mais.

### As anotações de segurança

As anotações dizem ao navegador e ao agente o que a ferramenta faz, e o navegador pode pedir confirmação ao usuário com base nelas.

| Anotação | Quando usar | Exemplo |
| --- | --- | --- |
| `readOnlyHint` | A ferramenta só lê dados | Buscar, filtrar, consultar estoque |
| `consequentialHint` | A ação é irreversível ou de alto impacto | Finalizar compra, cancelar pedido, enviar mensagem |
| `untrustedContentHint` | A resposta traz conteúdo de terceiros | Avaliações e comentários de usuários |

> [!IMPORTANT] Ferramenta também é porta de entrada
> A especificação dedica uma seção inteira a riscos: injeção de prompt pelas descrições ou pelas respostas das ferramentas, ações ambíguas e vazamento de dados. Na prática: nunca exponha uma ação sensível sem `consequentialHint`, peça só os parâmetros necessários e marque com `untrustedContentHint` tudo que vem de usuários.

## Que ferramentas expor no seu site?

**As ações que um cliente faria de qualquer jeito: buscar, filtrar, consultar, agendar, orçar e comprar.** Comece pela ação que mais gera receita ou contato, e não por tudo de uma vez.

| Tipo de site | Primeiras ferramentas |
| --- | --- |
| E-commerce | Buscar produtos, filtrar por preço e tamanho, consultar frete, adicionar ao carrinho |
| Serviço local | Ver horários livres, agendar, pedir orçamento |
| SaaS | Criar conta de teste, consultar planos, abrir chamado de suporte |
| Conteúdo e mídia | Buscar artigos, filtrar por tema, assinar a newsletter |
| Viagem e reservas | Buscar disponibilidade por data, comparar opções, reservar |

Para lojas, o WebMCP complementa os protocolos de compra dentro das IAs, explicados no guia de [feeds de produto e comércio agêntico](https://patrickperdigao.com.br/blog/feeds-de-produto-comercio-agentico).

Algumas regras para nomes e descrições, que é o que o agente lê para decidir:

- **Nome pelo que a ferramenta faz:** `agendar_consulta`, e não `form1` ou `submit`.
- **Descrição com o "quando usar":** "Use quando o usuário quiser marcar um horário" ajuda o agente a escolher a ferramenta certa.
- **Parâmetros com valores fechados quando possível:** um `enum` evita que o agente invente valores.
- **Respostas curtas e úteis:** devolva o resultado ou o próximo passo, não a página inteira.

## Como testar o WebMCP?

**Ative a flag `chrome://flags/#enable-webmcp-testing` no Chrome e use o Model Context Tool Inspector para ver e chamar as ferramentas da página.** Para testar com visitantes reais, há a origin trial a partir do Chrome 149.

1. **Ative a flag** e reinicie o Chrome.
2. **Abra a página** e confira se as ferramentas aparecem no Model Context Tool Inspector.
3. **Peça a tarefa em linguagem natural** ("ache artigos sobre GEO") e veja se o agente escolhe a ferramenta certa, com os parâmetros certos.
4. **Use o DevTools** para conferir como o navegador interpretou o JSON Schema.
5. **Inscreva o domínio na origin trial** se quiser que a API funcione para visitantes, não só no seu navegador.

> [!TIP] Não pese a página por causa disso
> Carregue o código do WebMCP só depois da detecção de recurso e fora do caminho crítico. Assim, a implementação não afeta o carregamento nem os Core Web Vitals de quem não usa a API, que hoje é quase todo mundo.

## Quais erros evitar?

| Erro | O que fazer no lugar |
| --- | --- |
| Tratar o WebMCP como fator de SEO | Ver como camada de usabilidade para agentes, depois do SEO e do GEO |
| Expor dezenas de ferramentas de uma vez | Começar pelas uma ou duas ações principais |
| Nomes genéricos (`tool1`, `submit`) | Nomes e descrições pelo que a ferramenta faz e quando usar |
| Ação irreversível sem anotação | `consequentialHint` em compras, cancelamentos e envios |
| Formulários sem label | Label em todos os campos, que viram a descrição dos parâmetros |
| Código sem detecção de suporte | `if ('modelContext' in document)` antes de registrar |
| Usar `navigator.modelContext` de tutoriais antigos | Usar `document.modelContext`, a versão atual |

## Checklist

- [ ] Ações principais do site listadas (buscar, filtrar, agendar, orçar, comprar)
- [ ] Formulários com label em todos os campos e nomes de campo claros
- [ ] Ferramentas com nomes descritivos e descrições que dizem quando usar
- [ ] Ações irreversíveis marcadas com consequentialHint
- [ ] Conteúdo de usuário marcado com untrustedContentHint
- [ ] Código carregado só se o navegador suportar a API (detecção de recurso)
- [ ] Testes com a flag do Chrome e o Model Context Tool Inspector

## Perguntas frequentes

### O que é WebMCP?

É uma proposta de padrão web que permite a uma página registrar ferramentas, com nome, descrição e parâmetros, para que agentes de IA no navegador executem tarefas no site de forma estruturada. A especificação é editada por engenheiros da Microsoft e do Google no Web Machine Learning Community Group do W3C.

### Qual a diferença entre WebMCP e MCP?

O MCP (Model Context Protocol) conecta um agente a um servidor, fora do navegador, e exige que você publique e mantenha esse servidor. O WebMCP roda dentro da página aberta no navegador: as ferramentas usam o mesmo código, a mesma sessão e o mesmo login do usuário, sem um servidor separado.

### O WebMCP já funciona no Chrome?

Em teste. O Chrome oferece o WebMCP em origin trial desde a versão 149, e para desenvolvimento local dá para ativar a flag chrome://flags/#enable-webmcp-testing. A especificação ainda é um rascunho de grupo comunitário e pode mudar.

### WebMCP ajuda no SEO?

Não diretamente. O WebMCP não é sinal de ranqueamento nem afeta a indexação. Ele importa para um momento depois da busca: quando um agente de IA está na sua página tentando concluir uma tarefa para o usuário, como comprar, agendar ou pedir um orçamento.

### Preciso implementar o WebMCP agora?

Não é obrigatório. Como a adoção pelos agentes ainda é pequena, o melhor custo-benefício hoje é deixar os formulários bem marcados, com labels e nomes claros, e testar o WebMCP em uma ou duas ações principais, como implementação progressiva que não afeta quem não usa a API.

## Fontes e referências

- [W3C Web Machine Learning Community Group: especificação WebMCP (Draft Community Group Report)](https://webmachinelearning.github.io/webmcp/)
- [Chrome for Developers: WebMCP](https://developer.chrome.com/docs/ai/webmcp)
- [Chrome for Developers: WebMCP Declarative API](https://developer.chrome.com/docs/ai/webmcp/declarative-api)
- [Chrome for Developers: WebMCP Imperative API](https://developer.chrome.com/docs/ai/webmcp/imperative-api)
- [Spronta: The State of WebMCP (julho de 2026)](https://www.spronta.com/blog/state-of-webmcp-july-2026/)

## Sobre o autor

Patrick Perdigão é especialista em seo e growth. Especialista de SEO na Omie, instrutor na Alura e professor na EducaSEO. Perfil completo: https://patrickperdigao.com.br/index.md

## Continue lendo

- [O que é GEO (Generative Engine Optimization): o guia para ser citado pela IA em 2026](https://patrickperdigao.com.br/blog/o-que-e-geo.md): GEO é otimizar conteúdo para ser citado pelos AI Overviews, Modo IA, ChatGPT e Perplexity. Entenda como funciona, o que muda no SEO e por onde começar. (GEO & AEO, 11 out 2026)
- [Cloudflare e os robôs de IA: o que mudou em 2026 e o que conferir no seu site](https://patrickperdigao.com.br/blog/cloudflare-robos-de-ia.md): Em 15/09/2026 o Cloudflare mudou o tratamento de robôs de IA. Entenda Search, Agent e Training e a opção que pode tirar o seu site do Google. (SEO Técnico, 12 out 2026)
- [Modo IA do Google e SEO: como funciona o query fan-out e como ser citado](https://patrickperdigao.com.br/blog/modo-ia-do-google-seo.md): Entenda o Modo IA do Google, como o query fan-out divide cada pergunta em várias buscas e o que fazer para o seu conteúdo ser citado nas respostas. (GEO & AEO, 14 out 2026)