Vision-language models (VLMs) can generate webpages from screenshots, but a new benchmark reveals they fail at a critical task: making those pages actually work. Researchers have introduced LongWebBench, a comprehensive evaluation framework that tests whether VLMs can create long webpages that not only look right but also function correctly with interactive elements like menus, forms, and multi-step user actions.

The problem is significant because existing evaluations focus on short, single-screen webpages where success is measured primarily by visual similarity. Real-world websites, however, span multiple screens, contain repeated components, require consistent styling across distant sections, and must support complex user interactions. LongWebBench addresses this gap by testing both structural fidelity (does the page look correct across its full length?) and functional fidelity (do the interactive elements actually work?).

Why Do Vision-Language Models Struggle With Long Webpages?

The research reveals a troubling disconnect: webpages can appear visually plausible while failing to support executable interactions. A generated page might look perfect in a screenshot, but when tested in a browser environment, buttons might not open menus, filters might not work, forms might not submit, and navigation might break. This suggests that visual similarity alone is an inadequate measure of success for webpage generation.

The benchmark tested state-of-the-art open-source and proprietary VLMs under both single-image and multi-image input settings. The findings were clear: structural fidelity generally degrades as webpage length increases, meaning longer pages are harder for models to reconstruct accurately. This degradation happens even when models are given multiple image inputs rather than a single screenshot, indicating that the challenge runs deeper than just input limitations.

How to Evaluate Webpage Generation Beyond Visual Appearance

• Structural Fidelity Assessment: Use multi-dimensional VLM-based metrics to evaluate whether models preserve page scale, global layout, section hierarchy, visual styling, and information density across the entire webpage length, not just individual screens.
• Functional Verification Testing: Deploy generated webpages in actual browser environments and execute goal-oriented user interactions to confirm that prescribed actions lead to expected outcomes, such as form submissions or menu navigation.
• Long-Horizon Evaluation: Test webpages that exceed three viewport heights (roughly 3,200 pixels vertically) to ensure models can aggregate visual information across multiple screens and maintain consistency throughout.

LongWebBench itself contains 490 real-world long webpages for structural evaluation and 507 goal-oriented interaction tasks across 129 webpages for functional testing. The benchmark employs two complementary evaluation protocols: a multi-dimensional VLM-based metric for assessing long-range structural coherence, and a DOM-augmented agent-based pipeline that executes generated webpages in a browser to verify user-goal completion.

What Does This Mean for Vision-Language Model Development?

The findings highlight a critical gap in how VLMs are currently evaluated and trained. Most benchmarks emphasize visual fidelity on short webpages or isolated interaction validation, but few jointly assess global structure across long webpages and executable multi-step user interactions. This means models optimized for existing benchmarks may perform poorly on real-world webpage generation tasks.

The research also shows that the challenge extends beyond just generating code that looks right. Models must synthesize interaction logic that actually functions under browser execution. This requires understanding not just visual layout but also the underlying logic of how web components should behave, a significantly more complex task than visual reconstruction alone.

For developers and organizations considering VLMs for webpage generation, the takeaway is clear: benchmark scores and visual similarity metrics should not be the only evaluation criteria. Testing on real webpages with actual user interactions is essential before deploying these models in production environments. The code and data from LongWebBench are publicly available, enabling researchers and practitioners to conduct more rigorous evaluations of their own VLM implementations.