为神经化用户构建包容性UI
#javascript #网络开发人员 #前端 #a11y

为神经化用户构建包含UI

最常见的是,人们在包含可访问性功能时会想到具有各种听力或视力能力的用户。您甚至可能会想到老年用户或“暂时残疾”用户(就像手臂骨折的人一样),但我们也记得还要注意我们的认知和神经差异用户。

有时这些用户可能并不总是有目的,而是由于缺乏意识。我也对此感到内gui。我的女儿是我注意这种意识的全部原因。
为了提供一点见解,我有一个7岁的年轻人自闭症,并且患有感官处理障碍。几年,我在电视上打开了Starz应用程序,并且随着徽标在屏幕上的扩大,响亮的鼓声响了。我看着我的女儿抓住她的耳朵,紧紧地闭上了眼睛,电视看不见的电视跑到角落。我很困惑。我以前见过很多次,这从未打扰我。我以为她也许她反应过度。然后,在打开Netflix应用程序时,发生了同样的问题,在大声铃声和一系列闪烁的颜色滚动之后,我看着我的女儿,她泪流满面,闭着眼睛,紧紧地遮住了耳朵。我想知道...发生了什么事?为什么这是她的反应?

我学到的是有些患有自闭症和/或感觉处理障碍的人往往会以不同的方式感知感官刺激。可能不会影响自己的声音,但对她来说可能会痛苦和压倒性。另外,她对明亮闪烁的灯光的容忍度很低。

她是我在这里的原因。发生这些事件后,我开始怀疑其他有多少其他人会受到响亮或重复的噪音的影响,或者在使用网络时会闪烁,弹性动画。我想鼓励您为像她这样的用户以及具有各种认知和神经异常能力的其他人创建(例如:ADHD,自闭症和阅读障碍)。

问题和障碍用户具有不同的神经疾病或认知能力:

  • 鲜艳的颜色超负荷,这可能会过度刺激甚至分散到网络体验

  • 大量文本可能会使很难理解,损害阅读理解和单词识别

  • 在屏幕上有可见的计时器,这有时会引起焦虑并产生不必要的压力

  • 大声的音乐和/或声音效果

  • 闪烁的灯光和带有脉冲图案的灯在某些情况下可能会引起癫痫发作

  • 闪烁的图像,gif,自动滚动部分,它们可能过度刺激和分散注意力

  • 一个块中的图像或信息太多,内容拥挤,混乱的部分挤满了文本,图像,视频等。这被称为视觉噪音。

以下是您可能要实施的一些实践:

  1. 在整个网站/应用程序中保持导航/菜单位置一致。这为所有用户创建可访问性和可预测性。用户需要了解菜单项的顺序,以及搜索栏和导航链接的位置。

  2. 如果可能的话,请勿包含以特定速率或模式闪烁,反复闪烁或脉动的内容。如果需要此类型的内容,请在显示内容之前向用户添加警告。如果不是必需的,它甚至可以为用户提供一种关闭动画的方法。

  3. 使用户能够使用暂停之类的命令并停止在诸如旋转图像或幻灯片之类的内容上停止。另外,隐藏非相关文章或内容的能力。

  4. 使用屏幕掩码。这是一个遵循鼠标或触摸的阅读工具,以帮助消除页面分散注意力。这使用户能够一次聚焦一个信息。 (Google Chrome在其浏览器上使用屏幕掩码工具可以使用)

当然,所有列出的技术都无法在每个应用程序上实施。目的是找到一种方法来确保患有神经疾病的用户可以调整和导航适合其个人需求的网站。轻微的更改,例如字体尺寸,颜色对比度以及继电器信息的替代方法(即视频,音频)可以使您有所作为。

我们都有独特的能力,个性和交流方式。对于我们来说,重要的是,作为开发人员,设计师,内容创建者,要理解,当我们创建,构建,设计和写作时,目的是使我们的网站和应用程序首先可访问时,Web体验对我们所有人都得到了增强。