关于对话框关闭请求的思考 (#博客文章)
💡
原文英文，约700词，阅读约需3分钟。
📝
内容提要
文章讨论了Chrome新增的dialog元素的closedby属性，允许通过“关闭请求”或点击对话框外部来关闭对话框。作者指出，许多网站使用自定义对话框，往往无法正确响应ESC键或手机的“返回”按钮，影响用户体验。自定义对话框与原生对话框的行为不同，使用“返回”按钮关闭对话框存在风险。
🎯
关键要点
- Chrome新增了dialog元素的closedby属性，允许通过关闭请求或点击对话框外部来关闭对话框。
- 关闭请求可以通过ESC键在桌面设备上触发，但在手机上则可能通过返回按钮或手势触发。
- 许多网站使用自定义对话框，往往无法正确响应ESC键或手机的返回按钮，影响用户体验。
- 自定义对话框的实现通常存在可聚焦性差、无法被屏幕阅读器识别等问题。
- 移动设备的返回按钮可能会关闭对话框或导航到不同的URL，存在不确定性。
- 使用返回按钮关闭对话框的做法存在风险，可能导致用户体验不佳。
❓
延伸问答
Chrome的dialog元素新增了什么属性？
Chrome新增了dialog元素的closedby属性，允许通过关闭请求或点击对话框外部来关闭对话框。
关闭请求是如何触发的？
关闭请求可以通过在桌面设备上按ESC键触发，在手机上则可能通过返回按钮或手势触发。
自定义对话框存在什么问题？
自定义对话框通常存在可聚焦性差、无法被屏幕阅读器识别等问题，影响用户体验。
使用手机的返回按钮关闭对话框有什么风险？
使用返回按钮关闭对话框可能导致导航到不同的URL，存在不确定性，影响用户体验。
为什么许多网站不使用原生对话框？
许多网站使用自定义对话框，往往因为开发者对原生dialog元素的了解不足，导致实现不佳。
自定义对话框与原生对话框有什么不同？
自定义对话框的行为与原生对话框不同，通常无法正确响应ESC键或手机的返回按钮。
➡️
