## 待分类 - 下拉菜单中一个选项如果禁用了，是隐藏还是显示好？ - 目前站显示，因为禁用并显示有机会教育用户，为什么禁用。 - 如果隐藏了可能会导致其他菜单的位置发生变化，熟练用户可能会发生误操作。 - 当然，如果禁用项特别多，已经浪费空间的地步，那就按场景作最优选择。 ## 概念 为了减少用户犯错造成的挫败感，很多产品会采用禁用状态来限制其犯错，却可能引发出可用性的问题。 ## 最佳实践 - 尽量标注为什么禁用，用户可以自主学习 - 该问题的重灾区是工具类软件，用着用着一些功能突然就灰掉了，只能慢慢摸索是哪里的问题。功能之所以不可用肯定有个原因，不论是直接显示还是鼠标悬停时显示，有必要让用户明白原由或者如何解决，避免把用户困在死胡同。 - 优秀案例 1，hubspot 的低代码建站产品，提示为什么禁用，并且还有链接进行指引： ^5d50ed - 优秀案例 2，cirquits 。 ## 反面案例 ### Broker Post Load 公司的一款 SaaS 产品，用户填写表单较多时，有可能注意不到一个再角落的必填项，却又无法保存数据，很是苦恼，下方为案发现场。 ### 宽尔 C3 系统 单据中的流程按钮，如果禁用了，用户将不知道为什么不可用，点击之后报错其实也有一定的教学作用。 例如：用户想结束某个单据，点了以后发现原来订单还没有开票，不能结束，用户就会自发的去了解发票的事。 ## 其他观点 ### Adam Dannaway [Adham Dannaway on Twitter: "Make disabled buttons more inclusive: ✅ Change the cursor to “cursor: not-allowed” ✅ Prevent the click via JavaScript ✅ Avoid the “disabled” attribute in HTML and use “aria-disabled” instead ✅ Use ARIA live regions to announce dynamic content" / Twitter](https://twitter.com/AdhamDannaway/status/1624786515539771393) 和我的观点一致。 Mem 收藏 < [https://mem.ai/p/1V9FFsQn8dfmi6wlPr8D>](https://mem.ai/p/1V9FFsQn8dfmi6wlPr8D>) Make disabled buttons more inclusive : ✅ Change the cursor to “cursor: not-allowed” ✅ Prevent the click via JavaScript ✅ Avoid the “disabled” attribute in HTML and use “aria-disabled” instead ✅ Use ARIA live regions to announce dynamic content ### Fiori [[Which UI Elementt Sate#^80002f]] 也谈到了何时该禁用，大体思路是，如果禁用的原因显而易见，是可以禁用的，因为禁用本身也是在弱化不可用的信息。 ### Shopify - Shopify 有个不同的观点 - 直接禁用按钮，让用户不会犯错，减少挫败感， - 地址 [[Polaris Design System#^24c426]] - 这是一个深刻的问题，应该根据不同的场景来考虑。 ## 资源 - [Disabled Buttons in User Interface (babich.biz)](https://babich.biz/disabled-buttons-in-user-interface/)