Um kit de ferramentas para desenvolvedores para preparar seu site para agentes

Kasper Kulikowski

Michael Hablich

Publicado em: 22 de junho de 2026

À medida que os agentes de IA evoluem de apenas gerar texto para navegar, interagir e concluir tarefas complexas no seu site, os desenvolvedores precisam de ferramentas dedicadas para garantir uma experiência de alta qualidade para esses usuários não humanos. A nova categoria de navegação agêntica do Lighthouse, combinada com melhorias no Chrome DevTools, oferece auditorias determinísticas e uma estrutura de testes para ajudar você a criar sites prontos para agentes.

A mudança para a Web de agentes envolve duas etapas principais: agentes pesquisando na Web e agentes usando a Web.

Quando os agentes apenas pesquisam sites, os princípios de otimização de mecanismos de pesquisa (SEO) ainda se aplicam. Nesta postagem do blog, vamos nos concentrar no trabalho que os desenvolvedores podem fazer quando um agente interage diretamente com o site.

Auditar, melhorar e depurar seu site pronto para agentes

Para que um agente de IA conclua um fluxo de forma confiável no seu site, como agendar um horário ou fazer um pedido, ele precisa de indicadores previsíveis e legíveis por máquina. Confira as ferramentas que ajudam a avaliar e melhorar essa preparação.

Auditar a prontidão do seu site para agentes

A nova categoria de navegação agêntica do Lighthouse está disponível a partir da versão M150 e oferece aos desenvolvedores um conjunto de auditorias determinísticas para avaliar a compatibilidade dos sites com agentes, incentivando a adoção de novos padrões do setor.

• O que as auditorias verificam: elas se concentram em três áreas principais que são essenciais para a interação com máquinas:

  • Acessibilidade: a acessibilidade é para humanos primeiro. Os agentes usam a árvore de acessibilidade, derivada do DOM para tecnologia adaptativa (TA), como modelo de dados principal. A auditoria de navegação com agente verifica um subconjunto de categorias da auditoria de acessibilidade que são essenciais para a interação da máquina. Por exemplo, ambas as auditorias verificam se cada elemento interativo tem um nome programático. Uma árvore de acessibilidade bem estruturada é a principal maneira de os agentes de IA entenderem sua página.
  • Estabilidade: mede a estabilidade visual usando o Cumulative Layout Shift (CLS) para garantir que os elementos não se movam inesperadamente, evitando cliques errados do agente.
  • Integração do WebMCP: verifica a disponibilidade de ferramentas registradas do WebMCP, formulários sem WebMCP declarativo e validade do esquema. A adoção do WebMCP ajuda os agentes a expor explicitamente a lógica e os formulários do seu site, tornando a interação confiável.

• A pontuação: ao contrário de outras categorias do Lighthouse, no momento da publicação, a navegação autônoma é informativa e sem comparativo. O foco é fornecer indicadores úteis (status de aprovação ou reprovação e avisos) em vez de um ranking definitivo.

Para saber mais sobre as verificações de auditoria específicas e o que você pode fazer para melhorar, consulte a documentação sobre Auditorias de navegação do agente para Lighthouse.

Tornar as interações entre o agente e o site mais rápidas e confiáveis

O WebMCP é um padrão proposto que visa expor ferramentas de estrutura a agentes de IA em sites atuais, acelerando e simplificando as interações dos agentes. Para mais informações sobre a implementação, consulte Leia sobre o WebMCP.

Implemente os recursos mais recentes usando seu agente de programação preferido

O Modern Web Guidance oferece uma coleção de práticas recomendadas e habilidades para ajudar desenvolvedores a criar sites prontos para agentes. Ela inclui a habilidade webmcp, que permite delegar a implementação das ferramentas do WebMCP ao seu agente de programação. Ao integrar o Modern Web Guidance ao seu fluxo de trabalho de desenvolvimento, você garante que o aplicativo seja criado com padrões modernos e fáceis de usar para agentes desde o início. Para saber mais, consulte a documentação do Modern Web Guidance.

Testar e depurar seu site com o Chrome DevTools para agentes

Para depuração avançada e desenvolvimento iterativo, o Chrome DevTools para agentes oferece uma persona de teste exclusiva. Ele permite transformar seu próprio IDE ou agente de programação assistido por IA em um agente de navegação, oferecendo um alto grau de controle.

Com o DevTools para agentes, você pode:

• Simular a interação do agente:você pode simular as etapas exatas que um agente realizaria, "se tornando o usuário" (ou o agente) para reproduzir falhas e verificar se os fluxos do seu site são deterministas.
• Invocação direta do Lighthouse:seu ambiente de teste pode invocar diretamente a ferramenta lighthouse_audit na guia ativa. Isso fornece uma verificação de integridade instantânea e de várias categorias com base no estado atual da página, permitindo que você verifique as correções de forma iterativa em relação aos padrões de navegação com agente.
• Screencast e depuração:a ferramenta oferece recursos detalhados de registro e screencast para que você veja exatamente como o agente percebe e interage com a página. Isso expõe alguns indicadores legíveis por máquina, como a árvore de acessibilidade, que podem confundir o agente.

Isso ajuda a garantir uma experiência de alta qualidade para usuários não humanos antes da implantação.

Para saber mais sobre os recursos e a configuração do Chrome DevTools para agentes, consulte nosso repositório do GitHub.

Observação: verifique se a depuração remota está ativada em chrome://inspect. Se você quiser acionar as ferramentas do WebMCP no Chrome DevTools para agentes, verifique se o navegador, por exemplo, o Chrome Canary, está em execução e se o flag do Chrome necessário para o WebMCP está ativado: chrome://flags/#enable-webmcp-testing.

O exemplo de configuração a seguir do Chrome DevTools para agentes (~/.gemini/config/mcp_config.json para AntigravityCLI ou configurado em Antigravity) se conecta ao Chrome Canary.

{
  "mcpServers": {
    "chrome-devtools": {
      "command": "npx",
      "args": [
        "-y",
        "chrome-devtools-mcp@latest",
        "--autoConnect",
        "--categoryExperimentalWebmcp",
        "--channel=canary"
      ]
    }
  }
}

Dica: os recursos experimentais do Chrome DevTools para Agentes, como --categoryExperimentalWebmcp ou --experimentalScreencast, podem se comportar de maneira instável. Se você estiver usando o AntigravityCLI e notar um comportamento inesperado, reinicie a ferramenta.

Use a consulta de exemplo: "Usando o MCP do Chrome DevTools, acesse https://googlechromelabs.github.io/webmcp-tools/demos/pizza-maker/ e crie uma pizza com 10 cogumelos e 2 pimentões. Não se esqueça de me dar um resumo do que você fez e quais ferramentas chamou."

Você também pode usar o Lighthouse para fazer uma auditoria de prontidão do agente:

Quero fazer uma auditoria do Lighthouse com um agente em https://googlechromelabs.github.io/webmcp-tools/demos/french-bistro/?notoolname usando o MCP do Chrome DevTools. Me dê um resumo completo.

A seguir

Para contribuir e participar da discussão, consulte o repositório oficial do Lighthouse.

Para mais informações sobre o WebMCP, consulte a documentação do WebMCP. Para mais informações sobre o Modern Web Guidance, consulte a documentação do Modern Web Guidance. Para mais informações sobre como otimizar seu site para IA generativa, consulte Otimizar seu site para recursos de IA generativa na Pesquisa Google.