# WebCode2M：面向网页设计稿代码生成的真实世界数据集 > WebCode2M 将约 256 万张真实网页截图与净化后的 HTML/CSS 代码及元素边界框布局树配对。数据取样自 Common Crawl 快照，经清洗（移除脚本、元数据与隐藏元素，并将样式合并为单一样式块）后用 Playwright 渲染，再由基于 10,000 条人工标注样本训练的神经评分器筛选。论文以 Pix2Struct-1.3B 微调出基线模型 WebCoder，提出衡量 DOM 结构召回率的 TreeBLEU 指标，并在短、中、长三个各含 256 个网页的测试子集上评测专用、开源及商业多模态模型。 - 作者：Yi Gui; Zhen Li; Yao Wan; Yemin Shi; Hongyu Zhang; Bohua Chen; Yi Su; Dongping Chen; Siyuan Wu; Xing Zhou; Wenbin Jiang; Hai Jin; Xiangliang Zhang - 原标题：WebCode2M: A Real-World Dataset for Code Generation from Webpage Designs - 发表载体：WWW 2025 - 发表状态：会议论文 - 出版／提交日期：2025 年 4 月 22 日 - 日期依据：ACM 文章页面与 ACM 提交的 Crossref 元数据均将出版日期记为 2025-04-22；本条目不以 4 月 28 日至 5 月 2 日的会议日期作为出版日期。 - arXiv 首次提交：2024 年 4 月 9 日 - arXiv：2404.06369 - 已复核的 arXiv 版本：v2 - DOI：10.1145/3696410.3714889 - 来源复核于：2026-10-18 - 收录于：2026-10-19 - 原始论文： - PDF： - 代码： - 项目： - BibTeX： - 目录页面： - 记录 JSON： - 英文版：[English](https://awesomerea.org/papers/paper-webcode2m/index.md) ## 研究范围与局限 任务是根据设计图生成静态 HTML/CSS。净化过程会移除脚本，因此不重建交互、客户端行为或后端逻辑；输出以视觉得分、CLIP 相似度和 TreeBLEU 评判，而非功能等价性。论文报告，所有被评测模型都无法准确还原图像元素，且目标代码越长得分越低。768 个测试网页取自高分候选并经人工检查；评分器准确率约为 90%，训练集中仍有低质量样本，作者也提醒爬取内容可能仍含不当材料。商业模型仅以模型家族命名，约三分之一的 Gemini 测试样例因 recitation 错误失败，因此相关比较只反映当时情况。数据集卡片声明的 CC BY 4.0 许可不能清除所爬取网页代码、文本或图片的权利。 ## 与本合集的关联 补充带布局树和结构指标的大规模真实设计稿到代码训练语料，与本节中规模较小的真实网页基准及合成网站重建基准互补。 ## 发表与复核说明 arXiv v1（2024-04-09）的标题为“VISION2UI: A Real-World Dataset with Layout for Code Generation from UI Designs”；所审阅的 v2（2025-02-22，备注“WWW'25”）采用最终标题并载有 DOI。ACM 页面与 Crossref 将 Bohua Chen 列于 Yi Su 之前，而 arXiv v2 将 Yi Su 列前；本条目遵循出版方顺序。项目页面链接论文、naturalcc 代码目录及 Hugging Face 数据集。所审阅的数据集卡片修订版 f53cd4a（2025-03-05）声明 CC BY 4.0，说明该数据集也称 Vision2UI，提醒可能含不当内容，并指向一个净化版本；其数据目录约 1.1 TB。naturalcc 仓库声明 MIT 许可。其 webcode2m README 仍使用早期名称：UICoder 模型与 vision2ui_test 测试集，后者现已重定向至 webcode2m_test。环境文件固定 Python 3.10、PyTorch 2.1.2 与 Transformers 4.33.1。 ## 一手来源 1. 2. 3. 4. 5. 6. 7. 8. 9. 10. ## 关于此条目 已依据论文及一手来源复核。请通过原始论文或 BibTeX 引用原作者。 原创说明采用 MIT 许可；外部项目、论文与素材保留各自的权利和许可。