WebAIM -考虑网页的可访问性

万博体育官网网址访问的图片

大多数人都知道需要为图像提供替代文本。图像的可访问性不仅仅是图像本身ALT文本。关于图像还有许多附加的可访问性原则和技术。

重要的

也看到我们的文章替代文本有关图像选择和长期的描述更多信息。

图片可以增强理解能力

人们很容易认为图像是坏的可访问性,因为替代文字基本上是替换文本的图像,为用户即无法感知图像。这种思想的逻辑延伸,是纯文字网站是理想的可访问性。然而,这种逻辑是有缺陷的,很多人都可以从图像大大受益,而屏幕阅读器用户都通过适当的替代文本“文本仅”版本。

插图、地图等。

许多概念通过插图、地图、图表等最有效地传达。想象一下在没有插图的情况下学习人体解剖学。这里有一个手部肌肉的例子。

手部肌肉的医学图示

很难想象,仅仅任何文字说明可能是由于理解的文字辅以插图。在这种情况下,一张图片胜过万个言,至少。插图,地图,图表等可增强理解,特别是对那些有认知和学习障碍。

动画

网页上的动画很少促进无障碍环境。大多数时候,他们只是讨厌,喧宾夺主。广告往往以动画从网页的主要目的是分散我们的注意力。

然而,精心设计的动画可以通过呈现媒体内容或集中注意力于重要内容来增强内容。动画图形可以呈现一系列图像,这些图像传达了静态图像无法充分呈现的内容。突出显示或其他动画可以让用户关注重要的内容,比如错误消息或所需的输入。当页面顶部的“文章内容”链接被激活时,一个动画会简单地突出目标内容区域,以帮助吸引视觉注意力。

请注意

动画应该总是这样用户控制要么持续时间很短。不断变化的图像会使页面的其他部分变得更加困难,或者对于易分心的用户来说,完全无法访问。万博体育官网网址

WCAG 2成功标准2.2.2(A级)要求自动地移动,闪烁,或滚动内容,持续5秒以上,可以暂停,停止,或由用户隐藏。常见故障包括:转盘或滑块通过内容自动动画或周期。

图标

对于“设置”,“垃圾”和“菜单”图标的典型许多网页使用图标来补充或替换文本。复杂的内容和功能,比如点击齿轮图标进行“设置”,可以通过一个非常小的图标轻松地传达。图标应该简单、容易理解和一致。图标总是需要熟悉才能有用。跨越文化和语言,它们可能会被误解。在许多情况下,相邻文本是有用的。

带有文字的图标在这个例子中,由于相邻的文本传送图标的内容(并且可能包含在同一条链路图标内),图标应该有alt = " "所以它们没有被单独识别。

颜色信实

颜色一定不能用作传达意义的唯一手段。这个实例说明制造旅游预订的日历。绿色表示日期可用,而红色表示日期不可用。谁能够感知颜色的用户不会有任何麻烦区分它们。但是,谁也无法感知的颜色不好,由于色盲或视力不佳,可能会无法区别分辨出轻松的用户。此外,用户可以选择重写页面颜色,他们需要高对比度模式。此外,由于谁是盲人用户也是色盲,日历颜色将是毫无意义的,以他们。

依靠红色和绿色来传达意义的日历

确保当颜色被移除时没有任何意义被丢失,即使是在图像中。工具,如Vischeck要么可以删除所有的页面颜色和模拟色盲。

对比

传达文字图片必须出示有足够的​​对比度文本。如果图像是低质量的,或当图像被放大图像内的文本对比度是特别重要的。

请注意

WCAG 2套最小对比度阈值的文本和图像的文本。测试图像中的文本对比度可能很困难,因为RGB颜色值没有在代码中定义。我们建议使用“吸管”实用程序在你的浏览器中检测颜色,然后运行它们WebAIM对比检查

非文本的对比

对于“设置”,“垃圾”和“菜单”图标的典型当文本以外的元素传递意义时,这些元素的可感知性与文本的可感知性同样重要。

出于这个原因,WCAG 2.1成功标准1.4.11(AA级别的)要求的图形对象和作者定制界面组件具有至少3的对比度比。这适用于元素如

  • 图标
  • 图表和图形组件
  • 纽扣
  • 表单控件
  • 重点指标和概述

低对比度的图标伴有文字这种对比要求适用于理解所需的图形内容——图标、图表、图形等等。在本例中,由于图标伴有符合对比的文本,所以图标的3:1要求并不适用。这篇课文(必须符合4.5:1文本的对比度要求)传达的意思和图标只是增强。

放大的图像的像素化

当用户缩放浏览器或使用屏幕放大镜软件,图像就会失去忠诚,成为像素化。

像素化的图片,上面写着“Lorem Ipsum”,但很难读懂

真实的文本可以平滑地缩放到任何缩放级别,在本例中会更清晰。

Lorem存有

虽然图像中的文本有时是不可避免的,但只要可能,就应该使用真实的文本。CSS可以应用自定义字体、颜色、渐变和阴影到真实的文本。True text还使用更少的带宽,支持翻译,可搜索,更容易维护和定制。

请注意

wcag2成功标准1.4.5 (AA级)要求图像不用于呈现文本,如果真实文本也能实现同样的视觉呈现。标志是免税的。

引起癫痫发作的图形

重要的

明亮的、频闪的图像或媒体可能导致癫痫发作在一些人。癫痫发作可能是危险的,甚至危及生命。不要负责使他们。

为了潜在地触发感光性癫痫患者的癫痫发作,一个闪烁的图像或多媒体必须:

  1. 每秒闪3次以上,
  2. 足够大(一个非常小的正在闪烁的映像,比如游标,不会导致捕获),并且
  3. 明亮,有明显的闪光对比。

此外,红色更容易引起癫痫发作。虽然大型的、闪烁的图片在网络上并不多见,但让人揪心的媒体在网络视频中更为常见,尤其是含有闪动特效的高清视频。必须避免这样的媒体!

请注意

wcag2成功标准2.3.1 (A级)定义了频率,大小,对比度,和选通的图像的颜色的阈值。