移动端登录与注册设计：让账户步骤清晰易懂

选择账户变得有用的时刻

从用户想完成的事出发。如果核心体验无需账户即可使用，就先让用户探索；当他们需要保存偏好、跨设备访问、协作或完成交易时，再请求登录。Apple 的《人机界面指南》建议尽可能延后登录，并在需要账户时解释益处。

与启动时的阻断界面相比，情境化提示更容易理解。例如，阅读应用可先允许用户浏览书目，等他们选择同步阅读清单时，再请求创建账户。如果一开始就必须创建账户，应在展示字段前解释原因。说明应具体且适度：“创建账户，以保存项目并在另一台设备上打开”比“加入我们的社区”更有用。

• 将必需信息与可选的个人资料信息分开。
• 对于游客结账或一次性任务，考虑能否等用户获得眼前价值后再创建账户。
• 身份验证成功后，将用户带回他们原本要完成的操作。

让登录选项清晰、易识别

用户应该能够分辨自己是在创建账户，还是返回已有账户。为两条路径设置不同标签，使主要操作在视觉上清晰，并将其他方式放在可比较、却不会令界面拥挤的位置。适用时使用服务提供商名称和平台认可的按钮样式；单独写“继续”无法解释下一步会发生什么。

仅提供产品实际支持且能够维护的方式。电子邮箱、通行密钥或平台身份选项可能适合不同受众。将它们呈现为选择，不要声称某一种方式对所有人都最简单或最安全。解释任何额外的必填信息。

回访用户可能不记得之前的登录方式。让恢复账户和切换登录方式容易找到，并说明电子邮箱与另一种方式关联时该怎么办。账户关联说明可以帮助用户保留对现有账户的访问权限。

让表单重点明确，并兼容用户的工具

只索取创建或访问账户所需的字段。使用始终可见的标签，不要仅以占位文字充当标签；选择合适的输入类型和键盘，并明确下一步操作。如果注册需要多项信息，应将相关字段分组，并将可选偏好推迟到用户进入产品之后。

身份验证应兼容自动填充和密码管理器。使用标准字段名称和语义，避免通过自定义行为阻止填充凭据。不要禁止粘贴密码：用户可能依赖密码管理器或其他工具。WCAG 指南明确提到，应允许浏览器和第三方密码管理器填充登录字段。

不同设备和密码管理器的行为可能不同，因此要在受支持的平台检查流程，并允许手动更正。登录失败后，实际可行时应保留电子邮箱等有用的非敏感信息。

• 使用“电子邮箱地址”等可见标签，以及清晰的密码标签。
• 适当时允许用户显示或检查密码，但不要让该控件成为更正输入的唯一方式。
• 将主按钮放在字段附近，并使用“创建账户”或“登录”等指向具体操作的标签。

为错误、恢复和下次访问做好设计

有用的错误提示会用文字指出受影响的字段或失败步骤，并告诉用户如何继续。当邮箱格式无效或字段为空时，“出错了”还不够。WCAG 2.2 成功标准 3.3.1 要求用文字识别并描述检测到的输入错误；不能只靠颜色或图标传达。

使用中性措辞，并将针对字段的说明放在字段附近。例如，对于格式不正确的地址，假设文案可以写：“请输入 [email protected] 格式的电子邮箱地址。”登录失败时，产品可以写：“无法用这些信息登录。请检查邮箱和密码，或重置密码。”避免在错误信息中暴露敏感账户信息；措辞应符合产品的隐私和防滥用需求。

说明用户请求重置后会发生什么，提供返回登录的路径，并帮助他们找到之前使用的登录方式。在后续访问中，清楚显示已登录状态，并提供账户设置、退出登录和帮助入口。如果可以在应用内创建账户，也应让账户删除入口容易找到。

• 将错误与对应字段关联，并确保不依赖颜色也能感知。
• 将恢复操作放在登录表单附近，避免让用户无谓地重新开始。
• 同时检查首次使用和回访用户状态，包括电子邮箱变更、登录方式不可用等情况。

实用的账户流程评审

分别以新用户、回访用户和需要恢复访问权限的用户身份走查流程。结合上下文检查界面。移动端模式资料库可以帮助团队比较不同表单如何组织输入、标签和操作。

• 如果账户并非必需，用户能否在登录前体验到有用的产品价值？
• 界面是否说明为什么需要账户，以及哪些信息是必填的？
• 用户能否区分注册、登录、其他方式和账户恢复？
• 字段标签是否始终可见，自动填充和粘贴能否输入凭据？
• 错误提示是否用文字指出问题、保留有用输入，并建议下一步？
• 成功后，用户是否返回最初开始的任务？