Max Potential First Input Delay
820 ms
The maximum potential First Input Delay that your users could experience is the duration of the longest task. Learn more about the Maximum Potential First Input Delay metric.
页面构成与技术指标
正文
329
操作候选
69
图片
199
HTML
1255 KB
文案
标题字数
48
摘要字数
35偏短
H1
1
H2
7
动作
主要入口
注册
表单
1
站内链接
302
站外链接
6
安全与页面元信息
HTTPS
有
HSTS
有
CSP
有
nosniff
有
viewport
有
图标
有
JSON-LD
有
统计
无
构成
Next.js / Tailwind
脚本
75 ext / 18 inline
Alt
131 missing
语言
zh
第三方域
1
Lighthouse
移动端模拟 · 性能评分
49 / 100
2026-09-05 · 本次测试有警告，结果可能不完整。
查看详情
移动端模拟 · 实验室数据，非真实用户体验数据
2026-09-05T03:57:38.380Z · Lighthouse 13.4.1
本次测试有警告，结果可能不完整： The page may not be loading as expected because your test URL (https://v0.dev/) was redirected to https://v0.app/. Try testing the second URL directly.
性能49/ 100
可访问性82/ 100
最佳实践92/ 100
SEO100/ 100
LCP · 主要内容出现29,427 ms
CLS · 布局偏移0.000
TBT · 主线程阻塞599 ms
FCP · 首次内容绘制3,067 ms
SI · 视觉加载速度6,547 ms
分数会受服务器、网络和测试环境影响，独立于品味／转化评分。诊断保留 Lighthouse 原文。
Browser errors were logged to the console
Errors logged to the console indicate unresolved problems. They can come from network request failures and other browser concerns. Learn more about this errors in console diagnostic audit
对应元素与资源
{
"type": "table",
"items": [
{
"source": "network",
"description": "Failed to load resource: the server responded with a status of 404 ()",
"sourceLocation": {
"url": "https://v0.app/api/chat/chat/attributes?chatId=efF9NLUDS4u",
"line": 0,
"type": "source-location",
"column": 0,
"urlProvider": "network"
}
},
{
"source": "console.error",
"description": "useServerQuerySWR: You are trying to access asserted data for scoped.designSystems promise: null response.data: undefined uniqueKey: @\"designSystems\",#, fetchKey: @\"@\\\"designSystems\\\",#,\",\"client-only\", store.get(atom): [object Object] but no promise was found. This is probably because you are trying to access data from a server component.",
"sourceLocation": {
"url": "https://v0.app/chat-static/_next/static/immutable/chunks/1afvjiubxi20p.js",
"line": 81,
"type": "source-location",
"column": 66069,
"urlProvider": "network"
}
}
],
"headings": [
{
"key": "sourceLocation",
"label": "Source",
"valueType": "source-location"
},
{
"key": "description",
"label": "Description",
"valueType": "code"
}
]
}Time to Interactive
30.5 s
Time to Interactive is the amount of time it takes for the page to become fully interactive. Learn more about the Time to Interactive metric.
Avoid multiple page redirects
Est savings of 1,050 ms
Redirects introduce additional delays before the page can be loaded. Learn how to avoid page redirects.
对应元素与资源
{
"type": "opportunity",
"items": [
{
"url": "https://v0.dev/",
"wastedMs": 1047.021
},
{
"url": "https://v0.app/",
"wastedMs": 0
}
],
"headings": [
{
"key": "url",
"label": "URL",
"valueType": "url"
},
{
"key": "wastedMs",
"label": "Time Spent",
"valueType": "timespanMs"
}
],
"overallSavingsMs": 1047.021
}Minimize main-thread work
5.1 s
Consider reducing the time spent parsing, compiling and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to minimize main-thread work
对应元素与资源
{
"type": "table",
"items": [
{
"group": "scriptEvaluation",
"duration": 2280.7239999997473,
"groupLabel": "Script Evaluation"
},
{
"group": "other",
"duration": 1372.5639999999944,
"groupLabel": "Other"
},
{
"group": "scriptParseCompile",
"duration": 554.1040000000004,
"groupLabel": "Script Parsing & Compilation"
},
{
"group": "styleLayout",
"duration": 519.8359999999998,
"groupLabel": "Style & Layout"
},
{
"group": "paintCompositeRender",
"duration": 233.51599999999738,
"groupLabel": "Rendering"
},
{
"group": "parseHTML",
"duration": 71.25199999999998,
"groupLabel": "Parse HTML & CSS"
},
{
"group": "garbageCollection",
"duration": 59.43599999999999,
"groupLabel": "Garbage Collection"
}
],
"headings": [
{
"key": "groupLabel",
"label": "Category",
"valueType": "text"
},
{
"key": "duration",
"label": "Time Spent",
"valueType": "ms",
"granularity": 1
}
],
"sortedBy": [
"duration"
]
}Reduce JavaScript execution time
2.4 s
Consider reducing the time spent parsing, compiling, and executing JS. You may find delivering smaller JS payloads helps with this. Learn how to reduce Javascript execution time.
对应元素与资源
{
"type": "table",
"items": [
{
"url": "https://v0.app/",
"total": 1894.6520000000114,
"scripting": 815.6280000000105,
"scriptParseCompile": 54.775999999999996
},
{
"url": "https://v0.app/chat-static/_next/static/immutable/chunks/3g9tav583q7t9.js",
"total": 1389.860000000008,
"scripting": 1167.0120000000084,
"scriptParseCompile": 15.311999999999998
},
{
"url": "https://v0.app/chat-static/_next/static/immutable/chunks/17xddrdopbp9_.js",
"total": 716.532,
"scripting": 107.11600000000044,
"scriptParseCompile": 8.711999999999998
},
{
"url": "Unattributable",
"total": 404.2440000000001,
"scripting": 8.172,
"scriptParseCompile": 0
},
{
"url": "https://v0.app/chat-static/_next/static/immutable/chunks/3q9baiox9oh9u.js",
"total": 134.11200000000002,
"scripting": 0.724,
"scriptParseCompile": 133.24
},
{
"url": "https://v0.app/chat-static/_next/static/immutable/chunks/3gqsrlb36ed7p.js",
"total": 84.96800000000027,
"scripting": 72.11600000000027,
"scriptParseCompile": 9.236
},
{
"url": "https://v0.app/chat-static/_next/static/immutable/chunks/2l-dnyr8c1i8w.js",
"total": 54.476,
"scripting": 4.419999999999992,
"scriptParseCompile": 45.916000000000004
}
],
"summary": {
"wastedMs": 2442.380000000019
},
"headings": [
{
"key": "url",
"label": "URL",
"valueType": "url"
},
{
"key": "total",
"label": "Total CPU Time",
"valueType": "ms",
"granularity": 1
},
{
"key": "scripting",
"label": "Script Evaluation",
"valueType": "ms",
"granularity": 1
},
{
"key": "scriptParseCompile",
"label": "Script Parse",
"valueType": "ms",
"granularity": 1
}
],
"sortedBy": [
"total"
]
}Image elements do not have explicit `width` and `height`
Set an explicit width and height on image elements to reduce layout shifts and improve CLS. Learn how to set image dimensions
对应元素与资源
{
"type": "table",
"items": [
{
"url": "https://v0.app/chat-static/assets/homepage/ios/ios-light.png",
"node": {
"lhId": "1-507-IMG",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,1,SECTION,0,DIV,0,DIV,8,DIV,1,DIV,0,DIV,0,DIV,1,DIV,0,IMG",
"type": "node",
"snippet": "<img alt=\"iOS App\" src=\"/chat-static/assets/homepage/ios/ios-light.png\" style=\"width: 100%; height: auto; object-fit: contain;\">",
"selector": "div.w-full > div.relative > div.absolute > img",
"nodeLabel": "iOS App",
"boundingRect": {
"top": 5445,
"left": 89,
"right": 323,
"width": 234,
"bottom": 5953,
"height": 508
}
}
},
{
"url": "https://v0.app/chat-static/assets/homepage/templates/row02.png",
"node": {
"lhId": "1-493-IMG",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,1,SECTION,0,DIV,0,DIV,5,DIV,1,DIV,0,DIV,0,DIV,1,DIV,0,IMG",
"type": "node",
"snippet": "<img alt=\"\" class=\"w-full h-auto\" src=\"/chat-static/assets/homepage/templates/row02.png\">",
"selector": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"nodeLabel": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"boundingRect": {
"top": 4159,
"left": 110,
"right": 204,
"width": 94,
"bottom": 4524,
"height": 366
}
}
},
{
"url": "https://v0.app/chat-static/assets/homepage/templates/row03.png",
"node": {
"lhId": "1-494-IMG",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,1,SECTION,0,DIV,0,DIV,5,DIV,1,DIV,0,DIV,0,DIV,2,DIV,0,IMG",
"type": "node",
"snippet": "<img alt=\"\" class=\"w-full h-auto\" src=\"/chat-static/assets/homepage/templates/row03.png\">",
"selector": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"nodeLabel": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"boundingRect": {
"top": 4159,
"left": 208,
"right": 302,
"width": 94,
"bottom": 4524,
"height": 366
}
}
},
{
"url": "https://v0.app/chat-static/assets/homepage/templates/row04.png",
"node": {
"lhId": "1-495-IMG",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,1,SECTION,0,DIV,0,DIV,5,DIV,1,DIV,0,DIV,0,DIV,3,DIV,0,IMG",
"type": "node",
"snippet": "<img alt=\"\" class=\"w-full h-auto\" src=\"/chat-static/assets/homepage/templates/row04.png\">",
"selector": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"nodeLabel": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"boundingRect": {
"top": 4159,
"left": 307,
"right": 401,
"width": 94,
"bottom": 4524,
"height": 366
}
}
},
{
"url": "https://v0.app/chat-static/assets/homepage/templates/row01.png",
"node": {
"lhId": "1-492-IMG",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,1,SECTION,0,DIV,0,DIV,5,DIV,1,DIV,0,DIV,0,DIV,0,DIV,0,IMG",
"type": "node",
"snippet": "<img alt=\"\" class=\"w-full h-auto\" src=\"/chat-static/assets/homepage/templates/row01.png\">",
"selector": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"nodeLabel": "div.w-full > div.w-full > div.flex-1 > img.w-full",
"boundingRect": {
"top": 4159,
"left": 11,
"right": 105,
"width": 94,
"bottom": 4520,
"height": 361
}
}
}
],
"headings": [
{
"key": "node",
"label": "",
"valueType": "node"
},
{
"key": "url",
"label": "URL",
"valueType": "url"
}
]
}Missing source maps for large first-party JavaScript
Source maps translate minified code to the original source code. This helps developers debug in production. In addition, Lighthouse is able to provide further insights. Consider deploying source maps to take advantage of these benefits. Learn more about source maps.
对应元素与资源
{
"type": "table",
"items": [
{
"subItems": {
"type": "subitems",
"items": [
{
"error": "Large JavaScript file is missing a source map"
}
]
},
"scriptUrl": "https://v0.app/chat-static/_next/static/immutable/chunks/3q9baiox9oh9u.js"
},
{
"subItems": {
"type": "subitems",
"items": [
{
"error": "Large JavaScript file is missing a source map"
}
]
},
"scriptUrl": "https://v0.app/chat-static/_next/static/immutable/chunks/2l-dnyr8c1i8w.js"
}
],
"headings": [
{
"key": "scriptUrl",
"label": "URL",
"valueType": "url",
"subItemsHeading": {
"key": "error"
}
},
{
"key": "sourceMapUrl",
"label": "Map URL",
"valueType": "url"
}
]
}ARIA input fields do not have accessible names
When an input field doesn't have an accessible name, screen readers announce it with a generic name, making it unusable for users who rely on screen readers. Learn more about input field labels.
对应元素与资源
{
"type": "table",
"items": [
{
"node": {
"lhId": "1-0-DIV",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,0,DIV,2,DIV,0,DIV,2,FORM,1,DIV,0,DIV",
"type": "node",
"snippet": "<div contenteditable=\"true\" role=\"textbox\" id=\"prompt-composer-_new-chat_\" aria-multiline=\"true\" spellcheck=\"false\" translate=\"no\" class=\"tiptap ProseMirror max-h-[330px] w-full overflow-y-auto bg-transparent tex…\" tabindex=\"0\">",
"selector": "div.relative > form.@container/composer > div.w-full > div#prompt-composer-_new-chat_",
"nodeLabel": "\n",
"explanation": "Fix any of the following:\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 208,
"left": 25,
"right": 387,
"width": 362,
"bottom": 262,
"height": 54
}
}
}
],
"headings": [
{
"key": "node",
"label": "Failing Elements",
"valueType": "node",
"subItemsHeading": {
"key": "relatedNode",
"valueType": "node"
}
}
],
"debugData": {
"tags": [
"cat.aria",
"wcag2a",
"wcag412",
"TTv5",
"TT5.c",
"EN-301-549",
"EN-9.4.1.2",
"ACT",
"RGAAv4",
"RGAA-11.1.1"
],
"type": "debugdata",
"impact": "serious"
}
}Buttons do not have an accessible name
When a button doesn't have an accessible name, screen readers announce it as "button", making it unusable for users who rely on screen readers. Learn how to make buttons more accessible.
对应元素与资源
{
"type": "table",
"items": [
{
"node": {
"lhId": "1-1-BUTTON",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,0,DIV,2,DIV,0,DIV,2,FORM,2,DIV,1,DIV,1,BUTTON",
"type": "node",
"snippet": "<button class=\"focus-visible:ring-offset-background outline-hidden has-focus-visible:ring…\" data-prompt-primary-action=\"start-recording\" data-submission-flow=\"submit\" data-testid=\"prompt-form-send-button\" type=\"submit\">",
"selector": "form.@container/composer > div.@container/prompt-form-toolbar > div.ml-auto > button.focus-visible:ring-offset-background",
"nodeLabel": "form.@container/composer > div.@container/prompt-form-toolbar > div.ml-auto > button.focus-visible:ring-offset-background",
"explanation": "Fix any of the following:\n Element does not have inner text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute\n Element does not have an implicit (wrapped) <label>\n Element does not have an explicit <label>\n Element's default semantics were not overridden with role=\"none\" or role=\"presentation\"",
"boundingRect": {
"top": 262,
"left": 359,
"right": 387,
"width": 28,
"bottom": 290,
"height": 28
}
}
}
],
"headings": [
{
"key": "node",
"label": "Failing Elements",
"valueType": "node",
"subItemsHeading": {
"key": "relatedNode",
"valueType": "node"
}
}
],
"debugData": {
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.4.1.2",
"ACT",
"RGAAv4",
"RGAA-11.9.1"
],
"type": "debugdata",
"impact": "critical"
}
}Links do not have a discernible name
Link text (and alternate text for images, when used as links) that is discernible, unique, and focusable improves the navigation experience for screen reader users. Learn how to make links accessible.
对应元素与资源
{
"type": "table",
"items": [
{
"node": {
"lhId": "1-2-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,0,SECTION,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0 sm:hidden\" href=\"/templates/hkRpZoLOrJC\">",
"selector": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 535,
"left": 28,
"right": 384,
"width": 356,
"bottom": 735,
"height": 200
}
}
},
{
"node": {
"lhId": "1-3-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,0,SECTION,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,1,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0 sm:hidden\" href=\"/templates/zdiN8dHwaaT\">",
"selector": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 803,
"left": 28,
"right": 384,
"width": 356,
"bottom": 1004,
"height": 200
}
}
},
{
"node": {
"lhId": "1-4-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,0,SECTION,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,2,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0 sm:hidden\" href=\"/templates/JUFK37Esjlj\">",
"selector": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 1072,
"left": 28,
"right": 384,
"width": 356,
"bottom": 1272,
"height": 200
}
}
},
{
"node": {
"lhId": "1-5-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,0,SECTION,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,3,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0 sm:hidden\" href=\"/templates/LHv4frpA7Us\">",
"selector": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 1340,
"left": 28,
"right": 384,
"width": 356,
"bottom": 1540,
"height": 200
}
}
},
{
"node": {
"lhId": "1-6-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,0,SECTION,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,4,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0 sm:hidden\" href=\"/templates/7YygHkO1oj4\">",
"selector": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 1608,
"left": 28,
"right": 384,
"width": 356,
"bottom": 1808,
"height": 200
}
}
},
{
"node": {
"lhId": "1-7-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,0,SECTION,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,5,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0 sm:hidden\" href=\"/templates/99MAOQptgL3\">",
"selector": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.has-focus-visible:ring-offset-background > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 1876,
"left": 28,
"right": 384,
"width": 356,
"bottom": 2077,
"height": 200
}
}
},
{
"node": {
"lhId": "1-8-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,0,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/dashboard-m-o-n-k-y-b7GDYVxuoGC\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 29,
"right": 267,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-9-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,1,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/garden-city-game-yAouuBHDmnT\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 285,
"right": 523,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-10-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,2,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/3-d-gallery-photography-template-JUFK37Esjlj\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 541,
"right": 779,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-11-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,3,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/modern-smart-home-dashboard-t0b0i9Q0jMS\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 797,
"right": 1035,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-12-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,4,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/new-components-shadcn-ui-rjaI1QX2ApZ\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 1053,
"right": 1291,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-13-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,5,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/v0-icon-qK8iWfx4VMX\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 1309,
"right": 1547,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-14-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,6,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/modern-booking-page-8lNrJsEZHaF\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 1565,
"right": 1803,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-15-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,7,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/wadada-run-club-hero-maaLWRPC8Cr\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 1821,
"right": 2059,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-16-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,8,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/modern-agency-website-liquid-glass-ezmvVsZJxz8\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 2077,
"right": 2315,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-17-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,9,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/sleek-landing-page-R5iD4luh3cv\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 2333,
"right": 2571,
"width": 238,
"bottom": 6568,
"height": 508
}
}
},
{
"node": {
"lhId": "1-18-A",
"path": "1,HTML,1,BODY,3,DIV,2,DIV,0,DIV,1,DIV,0,DIV,0,DIV,0,MAIN,1,DIV,0,DIV,3,SECTION,0,DIV,1,DIV,0,DIV,0,DIV,10,DIV,0,DIV,0,DIV,1,DIV,0,A",
"type": "node",
"snippet": "<a class=\"absolute inset-0\" href=\"/templates/the-orb-RumDfOqDMPi\">",
"selector": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"nodeLabel": "div.w-[240px] > div.shadow-base > div.absolute > a.absolute",
"explanation": "Fix all of the following:\n Element is in tab order and does not have accessible text\n\nFix any of the following:\n Element does not have text that is visible to screen readers\n aria-label attribute does not exist or is empty\n aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty\n Element has no title attribute",
"boundingRect": {
"top": 6060,
"left": 2589,
"right": 2827,
"width": 238,
"bottom": 6568,
"height": 508
}
}
}
],
"headings": [
{
"key": "node",
"label": "Failing Elements",
"valueType": "node",
"subItemsHeading": {
"key": "relatedNode",
"valueType": "node"
}
}
],
"debugData": {
"tags": [
"cat.name-role-value",
"wcag2a",
"wcag244",
"wcag412",
"section508",
"section508.22.a",
"TTv5",
"TT6.a",
"EN-301-549",
"EN-9.2.4.4",
"EN-9.4.1.2",
"ACT",
"RGAAv4",
"RGAA-6.2.1"
],
"type": "debugdata",
"impact": "serious"
}
}`[user-scalable="no"]` is used in the `<meta name="viewport">` element or the `[maximum-scale]` attribute is less than 5.
Disabling zooming is problematic for users with low vision who rely on screen magnification to properly see the contents of a web page. Learn more about the viewport meta tag.
对应元素与资源
{
"type": "table",
"items": [
{
"node": {
"lhId": "1-19-META",
"path": "1,HTML,0,HEAD,1,META",
"type": "node",
"snippet": "<meta name=\"viewport\" content=\"width=device-width, initial-scale=1, maximum-scale=1\">",
"selector": "head > meta",
"nodeLabel": "head > meta",
"explanation": "Fix any of the following:\n maximum-scale on <meta> tag disables zooming on mobile devices",
"boundingRect": {
"top": 0,
"left": 0,
"right": 0,
"width": 0,
"bottom": 0,
"height": 0
}
}
}
],
"headings": [
{
"key": "node",
"label": "Failing Elements",
"valueType": "node",
"subItemsHeading": {
"key": "relatedNode",
"valueType": "node"
}
}
],
"debugData": {
"tags": [
"cat.sensory-and-visual-cues",
"wcag2aa",
"wcag144",
"EN-301-549",
"EN-9.1.4.4",
"ACT",
"RGAAv4",
"RGAA-10.4.2"
],
"type": "debugdata",
"impact": "moderate"
}
}测试环境与原始指标
{
"finalUrl": "https://v0.app/",
"userAgent": "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) HeadlessChrome/151.0.0.0 Safari/537.36",
"formFactor": "mobile",
"throttlingMethod": "simulate",
"throttling": {
"rttMs": 150,
"throughputKbps": 1638.4,
"requestLatencyMs": 562.5,
"uploadThroughputKbps": 675,
"cpuSlowdownMultiplier": 4,
"downloadThroughputKbps": 1474.5600000000002
},
"metrics": [
{
"id": "largest-contentful-paint",
"unit": "millisecond",
"value": 29426.592000000004
},
{
"id": "cumulative-layout-shift",
"unit": "unitless",
"value": 0
},
{
"id": "total-blocking-time",
"unit": "millisecond",
"value": 598.5
},
{
"id": "first-contentful-paint",
"unit": "millisecond",
"value": 3066.5919999999996
},
{
"id": "speed-index",
"unit": "millisecond",
"value": 6546.910340332711
}
]
}01 / 值得借鉴
好设计，具体好在哪
空白输入不再是唯一出发点
输入框下面列出 Contact Form、Image Editor 等示例；作品缩略图为用户提供具体的结果预期。
模板带出处而非匿名装饰
模板卡片同时呈现作品、作者和站内互动信息，使它们成为可以继续探索的内容。
02 / 下一步
值得继续打磨的地方
- 01
补齐中文界面的局部翻译
标题与输入提示已是中文，示例分类和 Start with a template 仍是英文。
将界面分类和区块标题纳入同一语言字典；保留作者及作品原名，核对手机换行。
03 / 设计语言
把气质拆成可复用的参数
色彩
背景
#fafafa文字
#171717强调
#ffffff字体与尺度
- 标题字体
- GeistSans
- 正文字体
- GeistSans
- 标题 / 正文
- 32px / 16px
间距与形状
- 区块间距
- 0px
- 组件内距
- —
- 卡片圆角
- —
- 按钮圆角
- 8px
参数来自页面元素采样，空值表示未取得；不将单个元素的参数当作全站规范。
04 / 检查依据
观察与实测依据
数据来自同次页面采集；字体、圆角和间距为具体元素采样，不代表全站唯一设计规范。空值为未取得。HTML 为源码体积，不是压缩传输量；脚本数为 DOM 标签数，不是请求数。
品味1 项观察
补齐中文界面的局部翻译
标题与输入提示已是中文，示例分类和 Start with a template 仍是英文。
将界面分类和区块标题纳入同一语言字典；保留作者及作品原名，核对手机换行。
mobile.png: Chinese composer and English template heading
链接分享预览
v0 by Vercel - Build Full-Stack Web Apps with AI
您的协作式 AI 助手，帮助您设计、迭代和扩展全栈 Web 应用程序。
05 / 开始动手
把下一步，交给你的 AI
优化指令用于调整这个页面；设计指令用于借鉴它的视觉语言。「做同款」会附带截图与实施步骤。复制后粘贴到你的代码助手中。
查看完整指令
请基于 https://v0.dev 的 2026-09-05T02:31:13.435Z 页面快照优化当前项目。先确认当前实现与快照差异，不要把已变化的内容重新改回旧版。
设计基线
白底、黑色小按钮和细边框构成安静的工具界面。先放标题与输入框，再放示例提示词，最后进入带作者信息的模板网格；手机改为单列。
{
"colors": [
{
"role": "bg",
"hex": "#fafafa"
},
{
"role": "ink",
"hex": "#171717"
},
{
"role": "accent",
"hex": "#ffffff"
}
],
"fonts": {
"body": "GeistSans",
"display": "GeistSans",
"stack": [
"GeistSans"
]
},
"radius": {
"button": "8px",
"card": "",
"field": "0px"
},
"space": {
"section": "0px",
"card": ""
},
"type": {
"h1": "32px",
"body": "16px",
"weight": "600",
"lineHeight": "24px",
"letterSpacing": "-1.28px"
}
}
数据来自同次页面采集；字体、圆角和间距为具体元素采样，不代表全站唯一设计规范。空值为未取得。HTML 为源码体积，不是压缩传输量；脚本数为 DOM 标签数，不是请求数。
执行事项
1. 补齐中文界面的局部翻译
将界面分类和区块标题纳入同一语言字典；保留作者及作品原名，核对手机换行。
依据: mobile.png: Chinese composer and English template heading
验收
- 在 1440×900 和 390×844 分别核对文字、布局和主要操作“注册”。
- 保留已有品牌、登录和业务链路，不从静态截图推断交互故障。
- 只修复有证据的项；涉及安全响应头时先用报告模式验证现有资源及认证兼容性。
- 对比修改前后的截图，并执行相关功能测试。不要声称未经测试的功能已通过。