Web中的焦点管理
在A11Y中有一个非常重要的点就是关于Web页面或应用上焦点的管理。焦点的管理涉及到多个部分,比如焦点的顺序,焦点的样式等等。这些看上去细微的地方,对于Web的可访问性是非常的重要,特别是对于重度依赖于键盘操作的用户群体来说更为重要,因为焦点的顺序能更这些用户带来更好的体验,另外焦点的样式也能更好的告诉用户现在所处的位置,能有效指导用户在Web上的导航位置。今天和大家一起聊聊Web中有关于焦点方面的知识,如果您感兴趣的话,欢迎继续往下阅读。
![大漠](https://res.fequan.com/upload_file/avatar_image/202404/100131_e26031.jpg)
在A11Y中有一个非常重要的点就是关于Web页面或应用上焦点的管理。焦点的管理涉及到多个部分,比如焦点的顺序,焦点的样式等等。这些看上去细微的地方,对于Web的可访问性是非常的重要,特别是对于重度依赖于键盘操作的用户群体来说更为重要,因为焦点的顺序能更这些用户带来更好的体验,另外焦点的样式也能更好的告诉用户现在所处的位置,能有效指导用户在Web上的导航位置。今天和大家一起聊聊Web中有关于焦点方面的知识,如果您感兴趣的话,欢迎继续往下阅读。
我们在 UI 还原的过程中,难免会碰到水平或垂直方向的分隔线。在现代 Web 的开发中,大部分前端开发者首先的方案是使用非 <hr>
标签元素,通过 CSS 或 SVG 来制作分隔线,即使在使用 React 或 Vue 构建 Separator
(或 Divier
)组件,也是采用非 <hr>
标签。可以说,时至今日,<hr>
标签元素已被大部分开发者给遗忘了。既然如此,为什么我要用一篇文章的篇幅来聊 <hr>
元素呢?这主要是出于 Web 的可读性(无障碍)出发点。希望阅读文这篇文章之后,你会有一个更好的选择。
在开发电子商务网站或应用避免不了价格这个字段。事实上呢?很多电子商务网站的页面或应用的价格字段都没有提供一个较了的用户体验,或者说没有提供无障碍体验。而作为 Web 开发者,我们一些小小的改变就可以大大提升用户体验。接下来和大家一起聊聊,我们应该如何在自己的项目中为价格做出小小的改变来提高用户的体验。