字段标签Label
输入以后提示消失，怎么知道这一栏填的是邮箱还是公司？
字段标签给控件一个稳定、可理解的名称。HTML label 可以通过 for 与控件 id 关联，或包含可标记的控件，使浏览器和辅助技术识别两者关系；标签文字应在输入后仍然清楚。
标签就是这格的名字。示例可以消失，名字不能让人填到一半忘记。
表格上的“公司名称”印在格子旁，不会因为你写了公司名就被擦掉。
类比到这里为止：网页除了看得见，还需要程序上的关联；把一段文字挪到输入框旁边，不一定形成正确关系。
询盘里的邮箱、型号和数量都有明确标签，点击标签可以把焦点交给对应输入区，手机上也能扩大可操作区域。
检查标签有没有真正连上
- 视觉
- 文字说明的是紧邻的正确控件，必填信息明确。
- 程序关系
- 标签关联到唯一控件，而不是重复 id 或另一个字段。
- 操作
- 点击标签能将焦点或操作交给对应的可用原生控件。
让用户回看时仍能理解
输入示例邮箱后，框内提示会消失，外面的邮箱标签仍然存在。页面若已有字段值，用户也应不必清空它才能知道字段名称。
输入以后提示消失，怎么知道这一栏填的是邮箱还是公司？
可以操作，也可以重试。数据为虚构示例，不连接真实业务系统。
正在准备当前演示，正文可以继续阅读。
继续看项目应用与交付检查
字段标签 在项目中负责什么
- 什么时候用
- 用户需要识别输入、选择、开关或其他表单控件的用途时。
- 它解决什么
- 减少歧义并支持辅助阅读，让填写者能在输入前后理解字段。
- 它不负责什么
- aria-label 可以提供程序名称，但并不自动提供持续可见的字段说明。placeholder 不应作为正常设计里的唯一标签。
- 放进真实项目
- 把“Company email”“Expected quantity”等标签和输入框明确绑定。
字段标签是输入控件的正式名称，帮助用户和辅助技术理解要填什么
“Email”“Company”“需求说明”应在用户输入前就清楚可见，尤其在长表单和错误回看时。
- 01
用稳定、用户语言写标签。
- 02
把标签保持可见，不只放占位符。
- 03
让错误信息引用同一字段名称。
看得见、对得上、输入后还认得。
容易混淆的地方
label 的 for 指向控件 id，不是 name。id 用于页面关联，name 通常用于原生表单收集字段，两者职责不同。
填写邮箱后，框内“邮箱”二字消失了，回看表单时不知道这一栏是什么。怎样修正？
你可以这样告诉 AI Agent
“
我在处理这件事：把“Company email”“Expected quantity”等标签和输入框明确绑定。请以“字段标签”为主线，先说明它在这里负责什么、不负责什么；再列出必要输入、建议动作和可验证结果。用外贸独立站的业务语言回答，不确定的信息标为待确认。
内容依据与延伸
本站用原创中文解释把专业概念映射到外贸独立站；定义和机制继续以官方资料为准，业务例子再回到 外贸独立站询盘优化实战 验证。
本站整理说明：原创整理：Web 开发、产品设计、AI 协作与外贸独立站实践