文章

无障碍用户体验设计在Smartsheet

介绍

当你在像Smartsheet这样的工作管理平台上工作时，这对很多人来说每天都是至关重要的任务，你会发现任何引入摩擦、障碍或导致令人沮丧的客户体验的东西都是你的敌人。问题的影响可能从单个用户无法完成任务开始，但是每个受影响的用户所影响的工作可能很快就会失控。这最终会导致生产力和收入的大规模损失。ob欧宝娱乐app手机下载

在Smartsheet，我们的客户遍及所有行业，无论组织大小，我们对每个客户的目标都是相同的。我们正在努力确保我们的每一位客户都能获得与Smartsheet相同的世界级体验。

COVID-19因素

当我在2020年5月加入Smartsheet的用户体验团队时，COVID-19的封锁才刚刚开始。当公司争先恐后地弄清楚如何在突然100%远程工作的情况下保持员工的生产力和士气时，我们很幸运地在整个组织中采用了Smartsob欧宝娱乐app手机下载heet并充分发挥作用。我们继续推进我们的路线图，小心地优先考虑那些能够帮助公司转向更有活力的工作方式的项目。创造一个更容易使用的产品是我们的优先项目之一。ob欧宝娱乐app手机下载作为一个团队，我们必须弄清楚“更易于访问”的产品对我们的用户意味着什么，以及我们将如何实现这一目标。ob欧宝娱乐app手机下载

定义可访问性路线图

我们首先需要更新我们的VPAT，它已经过时了。我们使用WAVE和Accessibility Insights等工具确定了四个关键问题，这些工具可以检查网页并自动标记无障碍违规。我们确定并决定首先解决以下高优先级问题:

颜色对比:确保我们的UI元素具有足够的对比度，以便在WCAG 2.0 AA标准下清晰可见
alt文本:确保任何重要的图像和视觉效果都有适当的描述，而非必要的视觉效果则被适当地隐藏
咏叹调标签:确保我们所有的UI元素都有精心制作的ARIA标签和任何必要的描述，以提供适当的上下文
ARIA标记:确保适当地使用额外的ARIA标签，例如角色，以便我们可以更好地控制用户体验ob欧宝娱乐app手机下载

可访问性见解Chrome扩展标志着各种违规，并包括如何解决这些问题的建议。

我们选择了这四个问题作为我们希望在与外部可访问性测试供应商开始正式测试过程之前识别和修复的问题。我们希望通过移除我们知道会出现的违规来优化测试的影响。我们还希望通过新的设计工作来解决键盘导航问题，包括对现有功能的重新设计。

将无障碍放在首位

虽然修复现有代码的可访问性问题是重要的一步，但它是反动的。将这些问题视为代码缺陷，会迫使工程团队以牺牲计划工作为代价来优先修复这些问题。为了长期的成功，我们需要在产品周期的早期设计可访问性。ob欧宝娱乐app手机下载2020年，我们的任务是创建一个新的设计系统;对我们的基本UI进行大规模重新设计:这是我们从一开始就设计可访问体验的最佳时机。多亏了我们的新设计系统，我们已经完成了一半。

访问组件

新的设计系统由一系列常用组件、字体样式、颜色和间距指南组成。单个组件的设计目的是:

满足色彩对比度要求
在其他工具中包括键盘焦点状态
为设计师提供构建模块，以创建具有一致视觉层次、间距、对齐等的用户体验。

我们所缺少的是帮助设计师创造无障碍优先体验的工具和指导。

添加到我们的a11y工具包

甚至在确定四个关键的可访问性(a11y)问题之前，我们需要确保我们的内部团队了解如何在未来避免a11y问题。

我专门为易访问性注释创建了一个组件库。这将使设计人员能够为他们的工程合作伙伴提供键盘导航、视觉元素的替代文本、ARIA标签和其他标签的详细规格。

我们新的全球顶轨组件的a11y规格示例部分(设计未最终确定)。
我们在演示中为刚接触Smartsheet的用户体验设计师增加了一个章节，介绍了a11y规格组件以及如何使用它们。
我做了一个演示，用一个新功能作为案例研究，通过思考可访问性考虑因素，如咏叹调角色、标签顺序、咏叹调标签和咏叹调描述，来为与焦点变化元素交互的结果提供有价值的背景。