作为营销人员,当我们谈到数字可及性时,我们指的是有意创造一种能被尽可能多的人访问的体验。
为数字无障碍设计意味着很多事情。这意味着为有感官或认知障碍的人设计。这意味着为身体有限制的人设计。这意味着为那些依赖于适应性和辅助技术(如屏幕阅读器或放大镜)来观看数字内容的个人设计。
关键在于从一开始就在你的数字体验中建立可访问性,而不是像事后才想到的那样把它硬塞进去。下面,我列出了在创建数字营销材料时需要考虑的一些关键的可访问性原则。
原则为开发人员
1. 应用标准的HTML语义
可访问设计从标准HTML语义开始。标准HTML允许屏幕阅读器在页面上声明元素,以便用户知道如何与内容交互。当使用没有语义信息的HTML标记时——例如用于视觉样式的
和——浏览器将按照开发人员的意图显示元素,不幸的是,这可能对用户没有太大帮助。
请记住,用户使用屏幕阅读器的体验可能非常不同。例如,使用
语义介绍
或自定义编码来覆盖默认的浏览器样式将生成类似于头部的内容。但是,屏幕阅读器不会理解或声明元素是标题。
关键的外卖
尽可能使用标准HTML,以便屏幕阅读器在朗读时保持结构和内容。
使用结构元素对元素进行分组,并在页面上创建单独的区域,如页眉、导航、主页和页脚。屏幕阅读器识别这些结构元素,并向用户宣布它们,并允许在元素之间进行附加导航。
2. 启用键盘导航
所有的网站都应该是可通过键盘访问的,因为不是所有的消费者都可以使用鼠标或查看屏幕。事实上,根据WebAIM Low Vision的调查,60.4%的受访者总是或经常使用键盘进行网页导航。此外,永久或暂时失去手或肌肉控制能力的人也可以使用键盘或修改过的键盘进行导航。
要使键盘导航起作用,用户必须能够通过从焦点项移动到焦点项在页面中导航。用户通常遵循视觉流程,从左到右,从上到下,从标题到主导航,到页面导航,最后到页脚。当使用键盘进行导航时,enter激活一个焦点链接,空格键激活一个焦点表单元素。选项卡方便了元素之间的导航。转义允许用户关闭元素。
知道了这一点,考虑用户可能采取的操作是很重要的。经验法则是,如果您可以使用鼠标与可聚焦元素交互,那么请确保您可以使用键盘进行交互。这些元素可能包括链接、按钮、表单字段或日历日期选择器。
关键的外卖
确保用户可以通过键盘导航到网站的所有交互组件。列出所有站点的可定焦元素,并创建易于使用的焦点指示器。
构造基础源代码,以正确排列内容和导航。使用CSS控制元素的视觉方面。
如果下拉菜单中有太多链接,允许用户绕过导航窗口。
3.使用属性
当涉及到链接文本和url描述时,屏幕阅读器可以跳过文章中的链接。如果使用模糊的链接文本,如“点击这里”或“阅读更多”,它提供了非常少的上下文或意义,让人在屏幕阅读器上解释。
你的链接文字要有针对性和描述性,并包含有意义的短语来描述链接所连接的内容。使用更具体的语言,如“联系我们的销售团队”,而不是“联系我们”。对于图像和视频,指定ALT属性并使用描述性文件名。
关键的外卖
在你的链接中去掉那些无关的、非描述性的词,比如“点击这里”、“这里”和“阅读更多内容”。“无障碍的10个原则”比“点击这里阅读无障碍的10个原则”读起来更好。
优化文件名和URL名称,并使用打开和关闭字幕的视频内容。考虑添加准确的视频记录。
4. 使用ARIA label属性
在某些情况下,您网站上的按钮或其他交互元素可能不包括辅助技术所需的所有信息。ARIA label属性允许assistive技术覆盖HTML标签,从而允许网站所有者为页面上的元素提供额外的上下文。
在下面的链接例子中,一个屏幕阅读器会宣布“Bing广告。链接”。
>必应广告
但是,如果按钮本身是一个action调用