Day72 《Web表单设计》读书笔记

输入框内的标签

在屏幕空间有限的情况下，应当将标签放入输入框中，形成一个整体。

注意事项

• 光标定位到输入框时，标签应消失或者往输入框上移，不应该影响内容输入
• 输入框内标签应当直观表明它是标签

混合对齐

应该避免在同一表单中采用混合对齐方式，会干扰人们寻找完成表单的明确路径。

最佳实践

• 表单标签应当使用简洁的自然语言，大小写一致，问题应该尽量直观，容易理解
• 如果要减少填写时间，或者考虑多语言的时候，或者标签长度需要灵活多变，可采用顶对齐标签
• 如果屏幕垂直空间有限，可采用右对齐标签
• 如果要求人们浏览表单标签，知道必填问题或者回答多个问题中的若干特定问题，可采用左对齐标签
• 如果表单较短，屏幕空间极度有限，可采用输入框内标签，同时需确保合适的交互和情境
• 使用输入框内标签时，需确保能清晰区分标签和数据
• 如果考虑在同一应用工具的不同表单采用不同标签对齐方式，应当平衡情境和一致性
• 单一表格中采用不同标签对齐方式会破坏明确完成路径，人们会觉得迷惑