@googledevs: Modern Web Guidance + Chrome DevTools for agents = A powerful new workflow. Matthias Rohmer takes you inside the #Googl…

Modern Web Guidance + Chrome DevTools for agents = A powerful new workflow.

Matthias Rohmer takes you inside the #GoogleIO Chrome Dev Prompt Lab to demo the next generation of web development. See coding agents in action and learn how to leverage AI evaluators for your projects.

Watch the full session: https://goo.gle/4dxkzQv

TL;DR: Chrome is driving the Web Agent era with new APIs like WebMCP and HTML-in-Canvas, making it easy for developers to expose web page functionality to AI agents while preserving semantics, accessibility, and security boundaries.

Starting with a personal demo: HTML-in-Canvas and WebMCP

Paul Kinlan (Chrome Developer Relations) kicked off with a nostalgic demo: he rebuilt his 30-year-old childhood bedroom using HTML-in-Canvas — a 3D scene embedding a real browser. Users could browse the web, select text, and even search for WebGPU. The key breakthrough: inside the Canvas 3D, the DOM is fully accessible. This breaks the previous limitation where Canvas-based experiences couldn’t use browser features.

Next, he showcased WebMCP (Web Model Context Protocol). In the same 3D scene, an agent could access a set of tools: turning off lights, restarting the computer, etc. The user just said “turn off the light,” and the agent invoked the light switch tool; said “shut down and restart,” and the agent executed a multi-step operation. Paul stressed this is an experimental demo but shows future possibilities.

Our development environment: From QBasic to AI agents

Paul contrasted his programming environment from 30 years ago — QBasic, no syntax highlighting, no language server, American English spelling nearly made him quit — with today’s seemingly similar text-based development environment, but the development workflow has dramatically changed. He outlined Chrome’s three goals:

1. Ensure websites participate in the agent future, making the web a first-class experience.
2. Ensure tools understand modern web capabilities and are built for the modern web baseline.
3. Give developers early visibility into the platform direction to prepare for the coming years.

The agent era: From browsing to delegation

Paul believes agents represent a major shift in computing since the invention of the internet. Users no longer just browse and manually act; they delegate tasks to agents that span multiple websites and steps (e.g., find a hotel, integrate restaurants, find a kombucha bar). This shift will happen much faster than the mobile-first era (nearly a decade from iPhone invention to widespread adoption). In the past six months, the developer’s role has already changed dramatically.

The good news: existing modern web development principles like semantic HTML and accessibility are exactly what helps agents understand web pages. We need to recommit to these best practices.

Agent capabilities in Chrome: Gemini and Skills

Earlier this year, Chrome introduced Gemini, enabling users to chat, navigate, summarize content, create quizzes, etc., all within the same tab. It works because the web page actively describes its own functionality and structure. Further, Chrome launched Skills — users can extract product specs from ready-made skill libraries, summarize long documents, and turn conversations into repeatable, remixable skills that work across websites. This lets non-developers delegate tasks like programmers.

WebMCP: Turning web pages into agent tools

While LLMs can infer intent via screenshots, DOM, and clicks, developers need more controlled methods. WebMCP is designed for this — it’s a proposed specification aiming to expose HTML forms and JavaScript functions as callable tools for agents, making websites easier to participate in the agent ecosystem.

Core idea: No need to set up a separate MCP server or CLI; just expose the current browser tab, and the agent can read the tool list and interact. For example, an online shoe store could expose tools like search, add to cart, checkout. The agent selects and executes the appropriate tool based on user intent (“find a size 10 brown shoe”).

Two implementation approaches:

• HTML form approach: Add extra attributes (e.g., tool-description, tool-parameter) to existing forms, telling the agent the form’s purpose and how to fill it. This leverages HTML semantics already familiar to developers.
• Imperative API: Use navigator.modelContext.registerTool, passing name, description, input schema. When the agent matches a tool, it executes the function with the given data.

The advantage: tools run in the browser, sharing the user’s login state, cookies, and local storage — something no other non-browser MCP implementation can achieve. All operations stay within the browser’s security boundary.

Practical application: Expedia experiment demo

Paul showed a hypothetical Expedia integration (experimental, not live). The user said “find a hotel near Grandma on July 4th.” Gemini created a task plan, and multiple tools on the system (search accommodations, update filters, navigate to property) were automatically invoked. The agent determined which tool fit, executed the action, and eventually guided the user to confirm or directly check out. The demo reflects how future agents will complete cross-page, cross-tool tasks for users.

Open specification and experimental status

WebMCP is designed as an open specification, and Google is collaborating with cross-industry standards bodies. It’s still highly experimental; Chrome and Gemini are continuously iterating. Paul urged developers to try it early and provide feedback, as the platform direction evolves quickly.

“If you can tell the tool ‘this is a well-designed website, here is its structure,’ we can help agents and tools achieve user goals.”

Summary: Prepare for the agent era

Paul believes the web is transitioning from a medium for human browsing and manual actions to a medium where agents delegate tasks for humans. Many websites already work with agents today but aren’t optimized. Developers need to:

• Stick to semantic HTML and accessibility design.
• Understand and try new APIs like WebMCP.
• Keep an eye on Chrome’s Skills and Gemini capabilities.

This is a huge opportunity — keeping the web central in the AI agent ecosystem.

Source: @googledevs: Modern Web Guidance + Chrome DevTools for agents = A powerful new workflow (https://www.youtube.com/watch?v=YuMdsHIXatY&feature=youtu.be)