Why Multimodal Models Can't See Web Interfaces

Today, models interact with interfaces in two ways: reading source code (HTML, CSS, JavaScript, backend) or analyzing screenshots. Both approaches are inefficient — code doesn't show how an interface actually looks after rendering or which elements are truly accessible to users, while screenshots require analyzing a massive number of pixels. The browser already has the geometry, state, and visibility of every element. • **Code hides reality** — it doesn't reveal element offsets, overlaps, or hidden and inaccessible parts of the interface • **Screenshots are expensive** — they require different viewports and different states (hover, focus, modals, loading, video) • **A built-in module is needed** — persistent perception of structure, rather than a temporary "hand" that an agent rewrites as a script

AI-processed from Habr AI; edited by Hamidun News
Why Multimodal Models Can't See Web Interfaces
Source: Habr AI. Collage: Hamidun News.
Listen to article
Article Fact Sheet & Key Figures
ParameterDetails
Primary sourceHabr AI ↗
Editor-in-Chief
Key metric #1Code hides reality — it doesn't reveal element offsets, overlaps, or hidden and inaccessible parts of the interface
Key metric #2Screenshots are expensive — they require different viewports and different states (hover, focus, modals, loading, video)
Key metric #3A built-in module is needed — persistent perception of structure, rather than a temporary "hand" that an agent rewrites as a script

Two Failed Strategies

Today, multimodal models interact with websites in two ways. The first is reading source code: HTML, CSS, JavaScript, backend. The second is looking at screenshots. In practice, both approaches are inefficient.

Code doesn't reveal reality. From the source markup, a model can't tell where elements actually end up after rendering, whether they overlap each other, or whether a button has drifted off-screen. Code doesn't show that an element exists in the markup but is inaccessible to the user. You can expand the context to a million tokens, but code still won't give you the interface in its real, rendered state.

Screenshots solve part of the problem, but at the cost of massive overhead. A single frame isn't enough. You need different viewport sizes, different element states, hover, focus, modal windows, loading processes, dynamic changes. Full understanding may require video. A task the browser already understands as element structure, geometry, and state turns into heavy pixel analysis — expensive and inefficient.

How Humans See

We look at a website differently. We almost instantly distinguish text, backgrounds, buttons, borders, input fields, menus, and modal windows. On hover, we see interactive changes: a button's color shifts, feedback appears. We don't need to reconstruct the interface from either code or pixels.

We see structure. We see an oval with the text "log in" and immediately understand it's a button. We see block boundaries and the hierarchy of elements. None of this requires analyzing every pixel or studying all the styles and markup.

A Third Layer of Perception

Multimodal models need to see the same way. Interfaces shouldn't be just code or an image to them — they should be a structured representation suited for understanding a page, checking layout, and interacting with the UI.

There's no need to abandon transformers. Models need a new built-in perception module — a way to see an interface as a structure of elements, their states, visibility, and geometry. Not as a temporary "hand" that an agent rewrites as a script each time, but as a fundamental mode of perception.

Such a module would enable solving a broad range of tasks — from interface analysis to development, from layout verification to automation — while remaining universal. This isn't an attempt to sell a ready-made solution, but an attempt to name the problem: multimodal models have a crude tool for working with interfaces and need a more specialized way of perceiving them.

Story

Key Questions Answered

What are the key details on Two Failed Strategies?

Today, multimodal models interact with websites in two ways. The first is reading source code: HTML, CSS, JavaScript, backend. The second is looking at screenshots. In practice, both approaches are inefficient. Code doesn't reveal reality. From the source markup, a model can't tell where elements actually end up after rendering, whether they overlap each other, or whether a button has drifted off-screen. Code doesn't show that an element exists in the markup but is inaccessible to the user. You can expand the context to a million tokens, but code still won't give you the in

How Humans See?

We look at a website differently. We almost instantly distinguish text, backgrounds, buttons, borders, input fields, menus, and modal windows. On hover, we see interactive changes: a button's color shifts, feedback appears. We don't need to reconstruct the interface from either code or pixels. We see structure. We see an oval with the text "log in" and immediately understand it's a button. We see block boundaries and the hierarchy of elements. None of this requires analyzing every pixel or studying all the styles and markup.

What are the key details on A Third Layer of Perception?

Multimodal models need to see the same way. Interfaces shouldn't be just code or an image to them — they should be a structured representation suited for understanding a page, checking layout, and interacting with the UI. There's no need to abandon transformers. Models need a new built-in perception module — a way to see an interface as a structure of elements, their states, visibility, and geometry. Not as a temporary "hand" that an agent rewrites as a script each time, but as a fundamental mode of perception. Such a module would enable solving a broad range of tasks — fro

ZK
Zhemal Khamidun — CPO at Alpina Digital, product manager of AlpinaGPT. Building AI products since 2019. Hamidun News is a pet project that grew into a production aggregator with 6,000+ readers.
✦ Autonomous AI Agents

Delegate Deep Research, Coding & Workflows to an AI Agent

Deploy autonomous multi-step execution with NomadNet Agent (agent.nomadnet.ai) — automated web research, data synthesis, code generation, and complex task orchestration.

Launch NomadNet Agent →NomadNet AI Platform
What do you think?
Loading comments…