CSS reading-flow和reading-order这两个CSS新特性可以改变外部设备访问DOM元素的顺序，从而提高用户的无障碍访问体验，渐进增强特性，现在就可以在项目中使用。
文章关键字 ‘tabindex’
CSS reading-flow和reading-order属性简介
2025年10月20日，星期一告别pointer-events:none使用HTML inert属性真正禁用
2022年10月20日，星期四
细说iOS Safari下focus的行为
2020年10月26日，星期一
iOS Safari浏览器下的focus行为和其他浏览器都一些明显不一致的地方，有时候会给开发带来困扰，这里就说说相关的细节知识，均源自于自己日常开发，希望可以给遇到类似问题的前端同行带来帮助。
CSS :focus-visible伪类让我感动哭了
2019年03月24日，星期日
:focus-visible可以让我们知道元素的聚焦行为到底是鼠标触发还是键盘触发，从而可以更有效地控制浏览器中因为focus行为触发的outline轮廓样式，解决了我一个困扰我多年的难题。
实力科普：为什么浮层或弹框一定要有叉叉关闭按钮？
2018年07月14日，星期六之前自己发了个安利LuLu UI组件的微博，其中有位同行对于弹框组件提了这么一个问题：大佬，这种info类型的，为什么还要带个x？明明有确定按钮，似乎这个叉叉按钮去掉也没什么事，是不是很多人有类似的疑问？我很早之前就有过这样的想法，而且还付诸实践，直接把几个提示框右上角关闭按钮去掉，好干净好清爽，而且功能也没什么问题，还洋洋得意。后来，不断学习和积累，才发现当初的我对交互设计和用户体验的认知还很浅薄。
借助HTML5 details,summary无JS实现各种交互效果
2018年01月15日，星期一HTML5 details, summary这两个标签元素内置交互行为，我们可以充分利用这种交互特性不借助任何JavaScript代码实现各种交互效果。当然，前提需要解决自定义以及outline等体验问题。本文就将带你深入探索这两个非常实用的标签元素。
HTML tabindex属性与web网页键盘无障碍访问
2017年05月13日，星期六HTML虽然入门简单，但是，要想日后深入，却要花费非常大量的时间，因为一些看似非常简单的属性，实际上牵扯到另外一个完整领域的知识。例如本文要介绍的这属性tabindex，与web网页无障碍访问息息相关，而且是键盘访问领域的。
这些属性不仅可以触发浏览器层面的行为，本身对HTML的元素的交互特性甚至UI表现都会有影响。
CSS :focus伪类JS focus事件提高网站键盘可访问性
2017年04月23日，星期日所谓“键盘可访问性”，指的是用户只使用键盘访问网站的能力。例如，我们的iMac鼠标没电了，或者鼠标坏了，或者在智能电视中访问我们的网站，此时就只能依赖于键盘访问了。
我们只要平时注意HTML语义化，例如按钮不要使用<span>，<div>等标签，不要重置outline，基本上键盘可访问性就已经及格了。
若想再进一步提供，就需要看看本文的内容了……
翻译-盲人如何使用互联网的8个误区
2013年03月6日，星期三虽然翻译的文章不少，但是，有时会看走眼，开始感觉不错，翻译完了发现其实没啥货。本文内容呢，还算不错的，说句良心话，自己也是学到了不少东西，至少对屏幕阅读器有个更准确的认识。至于细节什么的，您自己点击进去看看吧。希望能对你构建可访问性的网站提供一点帮助。
span与a元素的键盘聚焦性以及键盘点击性研究
2013年02月20日，星期三我们平时涉及点击交互事件的时候，都是使用的a元素或者button元素，原因是可以相应键盘focus效果以及回车触发点击事件，这是众所周知的。
但是，可能存在一些特殊情况，我们需要使用默认没有键盘可访问性的元素，例如span元素，我们可以通过一定的设置支持键盘的可访问性，这是不为所知的，也是本文的重点所在。
我的应用
我的应用