400 998 0226设计无障碍视图的最佳做法
- 版本 ：2022.1 及更高版本
适用于： Tableau Desktop
您创建了一个很好的视图，并且您想要确保所有用户都可以看到和理解您放在一起的数据 - 但是一些用户有视觉或身体障碍。那么您可以做什么？
Tableau 支持多个控件，使您能够构建在 Tableau Online 或 Tableau Server 使用遵守 Web 内容辅助功能准则 (WCAG 2.0 AA) 的视图时，构建符合 US Section 508 要求的视图。确保从 Tableau Online 或 Tableau Server 共享的内容遵循针对辅助功能制作视图中的步骤，并符合以下 WCAG 2.0 AA 原则：
可感知 - 信息和用户界面组件必须采用可感知的方式向用户呈现。考虑采用替代文本和替代方式来呈现内容。
可操作 - 用户必须可通过他们用于与视图交互的不同设备或方法来访问用户界面组件和导航。
可理解 - 用户必须能够理解视图中呈现的信息。例如，为视图中显示的不同元素使用可明显区分的名称和标签。
遵循本文中介绍的最佳做法，并结合针对辅助功能制作视图中所述的步骤，构建在 Tableau Server 或 Tableau Online 上发布后可供所有用户访问的视图。
保持简单
WCAG 2.0 AA 原则： 可理解
您可能有想要用视图传达的许多信息。但是，密集型视图可能难以理解，或者很难使用屏幕阅读器或键盘进行导航。使用以下准则可帮助您传达需要传达的一切内容，而不会使用户因为视图数据过多而受不了。
尽可能聚合数据，帮助减少所显示的标记数。并且，如果在视图中显示超过 1000 个标记，将可能导致视图由服务器（而不是浏览器）渲染，而对于 WCAG 合规性而言，尚不支持服务器渲染的视图。
用户也可以访问“查看数据”页面（默认情况下已启用）来查看标记的基础数据，或可将数据从该页面下载到无障碍应用程序，通过该方式查看数据。
示例：此示例显示两种不同的条形图视图，用于阐述详细视图和聚合视图的差异。
无法轻松访问 - 标记太多 更容易访问 - 聚合视图 
此示例显示数据聚合程度更高的同一视图。
关键数据点仍然包括在内，但现在用户阅读和理解起来更容易。
标记数从超过 5000 个减少到约 20 个。
通过将焦点放在视图上，然后按 Enter 打开“查看数据”页面，用户仍然可阅读标记的基础详细信息。
这么多详细信息使得视图更难于理解。
视图显示超过 5000 个标记，而未包括足够的文本来指明不同标记所表示的信息。
需要屏幕阅读器的用户很难使用。
请考虑使用简单的图形元素，如允许您使用文本、颜色和形状向视图添加其他上下文的条形图或折线图。
限制标记数量，只显示强调最重要数据点的那些标记。
有关如何构建这种视图的信息和示例，请参见针对辅助功能制作视图中的保持简单。
标题和说明
WCAG 2.0 AA 原则： 可感知、可理解
如果在标题和说明中提供良好的描述性文本，则可以为使用辅助技术的用户提供上下文，并且可以帮助他们了解视图中的数据。使用以下准则来适应 Tableau 的视觉特性，以满足您的所有用户的需求。
将您的视图视为用于描述它的文本的补充。
使用标题和说明中的文本来描述您的可视化项以及您所显示的内容。
使用简单易懂的语言。避免使用术语、首字母缩写或缩写。
不要在您的文本说明中包含像“某某的图像”或者“某某的图片”这样的字眼，因为屏幕阅读器有时已经包括此信息。
避免使用全大写字母（例如在标题中），因为它们可能难以阅读。
示例：此示例显示两个不同的条形图。一个使用非常少的文本，另一个使用标题和说明来添加上下文
无法轻松访问 - 文本太少 更易于访问 - 添加描述性文本来提供上下文 
此示例显示同一视图，但在标题和说明中都包括了附加说明性文本。
使用了相同的色标和大小区分比例，但向条形标记中添加了标签来提供附加上下文。
单字标题不足以描述相关信息。
各个标记用颜色和大小区分。但如果没有附加文本，则可能很难理解这些标记的上下文。
没有说明或其他说明性文本来帮助解释此视图。
有关如何构建包括上下文文本的视图的信息和示例，请参见针对辅助功能制作视图中的显示更多文本并使其有用。
其他文本
WCAG 2.0 AA 原则： 可感知、可理解
除了仅在视图中添加标题和说明之外，使用文本可以帮助用户了解您正在显示的不同元素的上下文，以及帮助描述不同控件（例如图例和筛选器）与数据之间的关系。
添加其他文本时，请遵循以下指南：
在图例或筛选器的标题中使用文本来描述控件及其作用。您也可以使用仪表板上的文本区域为可视化项添加更多上下文，以进一步描述您正在显示的内容。
尽可能按标签参考控件。例如，将图例标签从“Subcategory”（子类）更改为“Color key for product type”（产品类型的色键）可帮助用户理解控件与数据的关系。
如果在您的视图中包括链接文本，请使用文本来描述链接会将用户带到的位置。例如，使用像这样的链接文本：“1999 至 2000 年全球变暖统计数据”。避免像“单击此处”、“更多” 或“更多信息”这样的措辞。这些链接文本示例太过宽泛，可能会使用户感到迷惑。
考虑使用自然语言生成 (NLG) 工具来帮助生成数据驱动型可视化项文本叙述。例如 Automated Insights 的 Wordsmith、 Narrative Science 的 Narratives for Tableau，或者 ARRIA 的 Natural Language Insights 扩展程序。
示例：此示例显示两个气泡图。一个气泡图仅使用在创建视图时默认显示的文本，另一个气泡图在整个视图中添加了特定于上下文的文本，可帮助在视图中传达含义。
无法轻松访问 - 文本太少 更易于访问 - 更多描述性文本 
此示例显示同一视图，但包括了附加说明性文本。
标题和说明中增加了附加文本，用于解释标记的关系，并提供有关视图所显示内容的附加上下文。
添加了用于显示利润数字的标记标签，因此用户不必只依靠颜色来理解此信息。
此视图只为工作表标题使用默认文本，并为筛选器和图例使用默认标签。
各个标记仅通过大小和颜色加以区分。
视图中没有说明或其他说明性文本来帮助提供上下文。
有关如何构建包括附加上下文文本的视图的信息和示例，请参见针对辅助功能制作视图中的显示更多文本并使其有用。
颜色和对比度
WCAG 2.0 AA 原则： 可感知、可理解
您可以使用颜色来帮助区分视图中的标记。然而，对于有视觉障碍的用户，只使用颜色并不总是能够十分明显地进行区分，尤其是当视图中有许多标记时。在视图中使用颜色时，请遵循以下指南：
Tableau 提供了一个色盲调色板，可用来帮助您为视图选择适当的颜色。对于您使用的任何调色板，请尝试提供足够的对比度，并分配在深淡色谱上彼此不同的颜色。
对于线条标记，请使用像形状、大小和标签这样的附加选项来帮助区分各个标记。
使用对比分析器工具帮助选择具有足够对比度的最佳文本颜色和背景。确保文本颜色对比度很强，并满足 4.5:1 的对比度标准（3:1 表示大文本）。
示例：此示例显示两个折线图。一个折线图使用的颜色只能区分线条，另一个折线图使用了更恰当的颜色加形状来区分标记。
无法轻松访问 - 只使用颜色来区分标记 更易于访问 - 使用颜色和形状来区分标记 
此示例显示同一视图，但同时使用了颜色和形状来标识标记。
颜色图例和带有明确标题的形状图例标识了颜色和形状在视图中所代表的内容。
此视图仅使用颜色来区分线条。
视图中的标记未使用能让有视觉障碍的用户完全看清楚的调色板。
有关如何构建使用颜色来帮助区分标记的视图的信息和示例，请参见针对辅助功能制作视图中的考虑周到地使用颜色并提供对比度。
发布您的视图
WCAG 2.0 AA 原则： 可感知、可操作、可理解
为了使视图可供用户使用，请将视图发布到 Tableau Server 或 Tableau Online，在工具栏菜单中单击“共享”。用户可以使用屏幕阅读器或键盘与视图和工具栏按钮进行交互。 有关详细信息，请参见Tableau 视图的键盘辅助功能。
注意：Tableau 的 Web 编辑不支持 WCAG 合规性，因此必须在发布的工作簿中关闭“Web 编辑”权限。
有关如何发布和嵌入工作簿、查找嵌入代码以复制到网页以及关闭工具栏的信息，请参见针对辅助功能制作视图中的发布和共享视图。