服务热线：
021-51085186
服务热线：
021-51085186
mabili英国广播公司(BBC)工作后不久,我回答了来自屏幕阅读器用户投诉有困难找到一个最喜欢的节目通过 BBC iPlayer的主页 。
网站最近经历了一个独立的可访问性审计表明,除了零星的小问题,这是相当容易。
我打电话给客户建立到底问题是,和我们一起导航主页使用屏幕阅读器。 就在那时我意识到,尽管所有的传统配料一个访问页面的地方-标题, 围咏叹调地标 、文本选择等等,这不是为屏幕阅读器用户非常有用。
iPlayer的旧主页。 ( 查看大版本 )
第一个问题是,子导航是仅有的两个链接:“电视”和“广播”与其他关键领域,如“类别”,“渠道”和“Z”埋在内容页面的顺序,使其用户更难找到。
iPlayer旧主页显示的“类别”,“渠道”和“Z”的内容。 ( 查看大版本 )
第二个问题是如何详细页面的屏幕阅读器用户。 一旦听到的不是链接到一个程序,该程序将宣布两次因为缩略图和标题为程序提出了两个不同的链接。 这使得页面再听和措辞混淆因为链接到相同的目的地不同。
iPlayer旧主页显示重复的链接。 ( 查看大版本 )
最后,键盘访问页面上是不合逻辑的。 在“类别”区域,例如,一个点击一个类别将揭示四项旁边的面板。 访问类项目的完整列表,您必须单击再次在同一链接清单页面。 这是一个主要障碍为用户和客户交谈时,我感到的地方完全放弃使用该应用程序。
iPlayer的旧主页显示突出显示的“类别”链接。 ( 查看大版本 )
很明显,尽管与可访问性网站建好,不是设计时考虑到可访问性,这是问题的发源地。
在英国广播公司(BBC),许多内部标准和指导方针时,团队必须遵循交付可访问网站和移动应用程序。 关键的是:
还有一个强大的企业文化的可访问性;BBC是一个 公共资金资助的组织 和可访问性被认为是其核心职责,是一个更强的司机比法律要求。 那么,这是怎么发生的?
问题是,标准和指导方针的一部分往往比设计,更注重代码对产出比的结果,比经验更在合规。 因此,技术兼容的页面可以建立不为残疾用户最实用。
它似乎并不明显,但视觉设计可以产生巨大影响的用户无法看到该页面。 我经常发现移动应用程序和网站的问题进行访问的视觉设计,通过命令结构,不允许它。
这并不意味着标准和指导方针是冗余的,远非如此。 但是我们发现在英国广播公司(BBC)是标准需要坐,和通知,一个可访问性框架,贯穿产品管理、用户体验,开发和质量保证。 因此,可访问性源自用户体验。 大部分的思想和要求应考虑前面,这样可怜的易访问性不是设计。
BBC iPlayer网站重新设计,重新重视给包容性设计,虽然坚持英国广播公司(BBC)的标准和指导方针,是由四个原则(下图)。 然后我们的我们的标准和指导方针来创建一个集中的需求列表用户体验。 我们也开始训练设计师来标注自己的设计可访问性。
我们的四个主要原则如下:
千万不要认为仅仅因为用户可以访问内容的一种方式,他们希望访问内容的一种方式。 因为BBC的iPlayer“音频描述”和“手语”格式,它从来没有在任何怀疑,这两个应该有自己的专用清单页面,通过“类别”下拉链接访问。 (注意所有点播内容是有字幕的,这就是为什么没有“字幕”的类别。 字幕可以打开媒体播放器)。
“类别”下拉“音频描述”和“签署”部分。 ( 查看大版本 )
然而,用户研究和反馈表示,尽管人们想要专用的类别,他们也希望能够以同样的方式搜索和浏览内容,其他用户将和选择他们喜欢的格式。 多年来我一直联系的绅士,抱怨老iPlayer页面,他自己说,“不要寄到残疾筒仓!”
这意味着,从一开始的设计需要路标“音频描述”和“签署”内容通过搜索结果,A到Z,类别和其他清单页面。 不做出任何假设或刻板印象残障人士是很重要的——例如,一个有着严重的视力障碍可能不总是用音频描述;新闻、体育、音乐和生活事件的程序通常不支持音频描述因为评论员已经提供丰富的评论。
如搜索列表页面,显示在这里,表明什么格式程序可用。 ( 查看大版本 )
点播页面也替代格式列表,允许用户选择他们想要的东西。 展望未来,选择也可以包含在选择你的格式 标准的媒体播放器 ——BBC媒体播放器用于所有BBC点播和直播视频产品,包括iPlayer。
截图显示高清的播放页面和广告格式。 ( 查看大版本 )
从来没有离用户控制是至关重要的。 在iPlayer的一个关键方面,很灵敏,不抑制触控放大。 一次又一次地在用户测试中,我们发现用户缩放内容,甚至在响应网站,文本可能会故意大。
由于iOS错误,纠正在iOS 6中,触控放大的能力被抑制时由于贫穷许多网站调整方向是景观从肖像。 现在这已经是固定的,没有理由继续抑制放大。
控制的另一个方面是自动播放。 在iPlayer目前播放生活内容,这可能是一个问题,因为视频的声音可以让屏幕阅读器用户很难听到他们的读者的输出。 然而,我们知道的屏幕阅读器用户请求自动播放,因为这意味着他们不需要导航到播放器,播放按钮和激活游戏。 答案是看如何给用户控制播放选择的或者自动播放,例如使用一个弹出和储蓄偏好和饼干。
需要有一种新的和熟悉的之间的平衡。 用户了解如何与页面交互和应用程序使用熟悉的设计模式。 这是在为iOS和Android原生应用显得尤为重要,在标准UI组件有内置的可访问性。
同样重要的是使用的语言在BBC的iPlayer的本地应用程序和网站响应。 平台允许的,一致的标签标题、链接和按钮——不仅仅是视觉,但也通过选择屏幕阅读器用户——确保经验是熟悉和被认可的“BBC iPlayer,无论平台。
联系到这个,新设计加强逻辑结构内的代码,进而支持导航屏幕阅读器用户。 关键在于确保模式用于跨页面标题结构重复,这样用户在不同的地方找不到主标题取决于他们的页面。 而结构通常被视为开发商的责任,它需要决定在设计之前签署为了防止贫困结构编码,后面有更详细的描述。
英国广播公司(BBC)不仅仅是会议上可访问性代码,内容和设计要求,但也包含所有用户的有用的功能,增加价值,包括残疾用户。 大部分的反馈我们从残疾用户属于可用性问题,在某种程度上可以由任何人经历,但严重影响残疾用户。 当我们合并功能与特定的障碍,帮助用户获得更丰富的、更容易体验每个人收益。
出现一次又一次的一个障碍是找到一个最喜欢的节目。 我和许多屏幕阅读器用户说他们他们的桌面快捷方式保存到他们最喜欢的节目,但由于改变url,经常丢失内容。 一个简单的方法来解决这一问题,好处是确保所有用户在网站上有一种机制来保存收藏。 最爱和选项列表中添加你所希望的方式进一步提高。 这听起来无关的可访问性,但它是最收到残疾用户请求的功能。 简单地访问收藏夹页面看最新一集的东西,而不必搜索网站,那将让一切截然不同。
“最爱”页面,选择排序的“Z”和“最近”。 ( 查看大版本 )
想办法让人们更快地得到他们想要的内容也影响中可用的媒体播放器本身。 一旦完成一集玩,退出媒体播放器和导航回到网站找到一些用户的下一个事件是一个巨大的开销。 添加一个“更多”按钮,玩家本身,显示下一个事件或项目类似于当前,减少了需要的工作量用户发现新的内容。
“您可能还喜欢“插件显示相关内容和第二集在标准的媒体播放器。 ( 上述原则存在创建一个心态,帮助产品所有者和用户体验从业者都在塑造和设计的产品。 除了这四个原则,一套准则用于设计更多的访问接口。 以下是一个子集的” 28日
) BBC iPlayer一个关键功能,增加了价值的原生iOS和Android应用程序,以及网站(当在Chrome) ”:
26 确保文本和背景超过WCAG 4.5:1的对比最低的两倍。 )
的指导方针 支持谷歌Chromecast 色彩对比
BBC的iPlayer主页内容有更好的新秩序,搜索工具、结构和键盘访问。 ( 查看大版本 )
在发射,BBC的频道收藏的iPlayer的导航,一个“热门”和“电视指南,类别。 “这些页面的所有坐在开始,高的内容。 在视觉上容易看到,他们也轻松地发现屏幕阅读器用户通过一个隐藏的标题和标签导航地标:
<divrole="navigation"><h2>iPlayer navigation</h2>
在之前的“类别”是无法使用屏幕阅读器用户我采访,他们现在著名的页面和全键盘通航。 自推出以来,增加更多的渠道意味着频道链接被安置到在自己的下拉菜单。
搜索工具也被添加,让用户进行预测搜索,浏览到Z或查看最近关注的项目。 这是所有键盘可访问,它使用的标题,并在适当的地方的地标。
主页旋转木马也完全键盘可访问。 流中的每个程序提出了作为一个链接,文本的阅读顺序开始与主信息:通道归因,程序名,集信息、抽象和程序持续时间。
工作也一直在进行改进可见焦点和标准带来iPlayer网站和媒体播放器与英国广播公司(BBC)页眉和页脚。 粉红下划线用于悬停和关注国家在主BBC现在导航中使用标准的媒体播放器来表示当一个按钮被选中——例如,当字幕开启。 这只替换使用颜色来表示选中状态,与徘徊,专注的状态。
徘徊,专注粉色下划线用于BBC iPlayer头。 ( 查看大版本 )活跃的和不活跃的徘徊和国家关注的副标题按钮标准的媒体播放器。 ( 查看大版本 )
你可以阅读更多关于采取了什么措施 iPlayer访问 和使 标准的媒体播放器可访问 ,包括创建一个 可以在Flash媒体播放器 ,英国广播公司的互联网上的博客。
所有的想法在包容性设计,来自产品负责人,UX从业者和设计师需要捕捉和传达给开发人员和工程师。 在英国广播公司(BBC),我们搬到一个模型,设计需要注释的可访问性。 这包括:
带注释的用户体验的一个例子显示标题和标签。 ( 查看大版本 )
上面的设计,显示一个早期版本的BBC iPlayer主页,概述了的地方 < h1 >来 <代替>标题应该。 用户体验的医生不需要深入了解代码,而是了解数据在页面的层次结构。 这样,一个同样可以接受的方法是表明“主标题”,“二级标题,”“第三级标题”等等。 开发人员可以把这个翻译成语义标记。
同样,指示内容帮助开发人员代码内容的逻辑顺序正确的序列(即源顺序)——这是至关重要的屏幕阅读器或发现键盘页面的用户的理解。
注释以这种方式用户体验是识别关键设计,不允许逻辑页面结构,内容或行为。 这是第一步生成的风格指南文档集中,颜色等等。 进一步的,这些需求也可以用于生成用户验收标准和自动化质量保证测试。
即使你在敏捷的方式工作,在设计迭代交付,而不是一个完整的形式,注释仍能工作。 只要页面的基本框架被很好地定义,视觉设计可以进化。
很容易陷入困境的访问输出和忘记,最终,可访问性是人。 因此,记住以下,无论你是在产品,用户体验,开发或质量保证:
培养这些关键原则在整个团队将会很长一段路要确保产品是残疾人的包容性和可用的。 听用户并积极包括他们的反馈,以及坚持组织的标准和指导方针,是至关重要的。
