首页   

构建无障碍设计:为老年人提供友好体验的 15 个关键 UX 原则

交互设计学堂  · 设计  · 2 天前

译者推荐:探索数字世界的无障碍设计,这篇文章为设计师提供了宝贵的指南。它深入讨论了如何通过以无障碍为中心的研究、清晰直观的导航、视频字幕、键盘无障碍等策略,让互联网对老年人和残疾人更加友好。文章还涵盖了易读排版、高对比度设计、色盲考虑、响应式设计等关键点,确保所有用户都能轻松访问和享受数字内容。无论你是设计师还是对无障碍设计感兴趣的读者,这篇文章都是你不可错过的资源。



你是否尝试指导过你的奶奶如何在家庭聊天中分享她自制千层面的照片?


如果你点头了,那说明你并不孤单。


互联网是一个浩瀚的地方,虽然我们中的许多人可以轻松驾驭它,但也有无数人觉得它有点像迷宫。


让我们来看看,作为设计师需要考虑哪些方面,才能让那些网络经验有限的人更容易访问数字世界,并使其更具包容性。


1.以无障碍为中心的研究


除了了解用户的需求和目标,在研究过程中还要特别注意老年人和残疾人的无障碍要求。


随着年龄的增长,典型的认知变化会影响网络导航。这些变化可能包括注意力下降、信息处理速度减慢或难以进行多任务处理。


以下是一些专门针对以老年人的需求和偏好为中心的用户研究方法:


  • 用户访谈


与老年人进行一对一访谈,了解他们的技术习惯、需求、障碍和偏好。在设计问题时要考虑到潜在的认知和记忆障碍。


  • 针对老年人群的调查


考虑到老年受访者在视觉或认知方面可能存在的局限性,应制作简单、清晰、直观的调查问卷。


  • 用户画像


创建代表不同类别老年人的详细用户画像。考虑不同程度的技术熟练程度、身体缺陷和认知挑战等因素。


  • 情境观察


在老年人的自然环境中,如家中、老年中心或成人教育课程中观察老年人。这样可以深入了解他们在现实世界中与技术和环境的互动。


  • 为老年人绘制旅程图


绘制用户旅程图,详细描述老年人的体验,发现潜在障碍和与他们年龄组特定的接触点。


2.清晰直观的导航


保持导航简单直观,使用清晰的标签,合理组织内容。


增大按钮、链接和表单字段等互动元素的尺寸,使其易于点击。


考虑在元素之间留出足够的间距,以防止意外点击。


例如,英国广播公司(BBC)网站采用简单直观的导航方式,顶部菜单简单明了,方便用户访问新闻、体育、天气等不同栏目,这种方法有利于不同能力的用户操作。



3.视频和字幕


对于视频和播客等多媒体内容,应提供文字稿和字幕,这可确保有听力障碍的用户能够访问这些内容。


4.键盘无障碍


确保所有互动元素都能用键盘操作使用,这将有助于那些因运动障碍或个人偏好而依赖键盘操作的用户。


这个英国政府网站是键盘导航的杰出范例,该设计允许用户以标签方式有逻辑地浏览内容,并访问所有互动元素。



5.图像的替代文本


尽管已经提到了图像的替代文本在响应式设计中的重要性,但必须强调的是,所有图像、信息图表和图形都应该有描述性的替代文本,以帮助依赖屏幕阅读器的用户。


6.渐进式披露


以线性和直接的方式呈现信息。


从基本内容开始,在用户滚动或互动时提供访问更详细信息或高级功能的选项。这样可以避免一下子向用户提供过多的信息。


避免复杂的交互或多级菜单,以免让网络经验有限的用户感到困惑。


Airbnb 的预订流程是渐进式披露的最佳范例。它从基本细节入手,逐步公开房源和房东的更多信息,确保用户不会被信息淹没。


Airbnb


7.易读的排版


使用清晰的字体和适当的字号。


正文的基本字体大小至少为 16 像素(px),这是公认的良好可读性标准。这种字体大小可为大多数用户提供舒适的阅读体验。避免使用小于 16 像素的字体大小,并允许用户自行调整文字大小。


8.背景与文字的对比度


确保文字与背景之间有足够的对比度,以符合WCAG(《网页内容可访问性指南》)标准。这通常意味着在浅色背景上使用深色文字,反之亦然。


使用对比度检查工具或浏览器扩展程序测试颜色组合,以验证是否符合要求。


WCAG 建议标准文字与背景的对比度至少为 4.5:1,大文字为 3:1。


9.考虑色盲


请记住,有些用户可能有色觉缺陷(色盲)。请避免单纯依靠颜色来传达信息,而应使用其他提示方式,如文字标签或图案。


Toptal Colorblind Web Page Filter: :通过这款在线工具,你可以查看任何网页在各种类型的色盲患者眼中的效果。


例如,谷歌地图上的交通信息页面(右侧)就是原发性色盲患者看到的交通信息。


Google Maps


10.响应式设计


确保网站具有响应性,能适应各种屏幕尺寸和设备。确保文字保持可读性,图片有替代文字,互动元素可通过键盘导航。


11.降低认知负荷


保持界面简洁、重点突出。避免屏幕上出现过多的选项或干扰因素,让用户不知所措。


在说明和标签中使用通俗易懂的语言,避免使用专业术语或复杂术语。


12.明确的行动号召 (CTA)


使用清晰和描述性的 CTA 引导用户完成所需的操作,明确用户点击按钮或链接后会发生什么。


触摸界面上的按钮对角线至少应为9.6 毫米(iPad 为 44×44像素)。


13.用户友好的表单


如果您的网站包含表单,请将其设计成用户友好型。尽量减少必填字段的数量,提供清晰的说明,并提供内联验证,以帮助用户顺利完成任务。


14.引导式入门


如果您的网站需要用户注册或账户设置,则应提供有指导的入门流程,逐步说明并尽量滅少数据输入。使用简洁明了的表单协助用户创建账户或个人资料。


考虑提供入门教程或工具提示,帮助经验有限的用户学习如何有效地浏览和使用网站。


15.测试、测试、再测试


以下是一些检查设计无障碍程度的方法:


  • 无障碍性审核


根据公认的可访问性指南,如 Web Content Accessibility Guidelines (WCAG),评估产品的可访问性。


这些审核通常会提供详细的反馈和可行的建议,以改善无障碍环境。


  • 屏幕阅读器测试


屏幕阅读器是一种能朗读数字内容的软件应用程序。使用屏幕阅读器进行测试有助于确保盲人或视障用户可以访问内容。


流行的屏幕阅读器包括 JAWS、NVDA 和 VoiceOver。


  • 辅助技术测试


除屏幕阅读器外,还有其他辅助技术,如放大镜、语音识别系统和替代输入设备。使用这些技术进行测试,可以深入了解各种残疾情况。


  • 认知演练


这种方法涉及从认知障碍用户的角度评估产品或服务。


重点是了解系统对于那些可能以不同方式处理信息的人的直观性和易用性。


  • 无障碍任务分析


分解用户需要在平台上执行的任务,评估每个步骤的无障碍性。


这可以突出残疾人在完成特定任务时可能面临的具体障碍。


16.想了解更多吗?


书籍:


  • 《A Web for Everyone: Designing Accessible User Experiences》:作者 Sarah Horton 和 Whitney Quesenbery,这本书全面介绍了如何创建可供尽可能多的人使用的网站。

  • 《Designing User Interfaces for an Aging Population: Towards Universal Design》:Jeff Johnson 和 Kate Finn著。本书提供了实用的建议和实例,帮助确保您的产品可供老年人使用。


尼尔森-诺曼团队的文章:


“Seniors as Web Users” —— 本文将讨论老年人网站的可用性以及他们所面临的挑战。


平台和工具:


  • W3C’s Web Accessibility Initiative (WAI): 这里提供了网络无障碍的指南,其中自然包括对老年用户的考虑。

  • AARP’s Website: 由于美国退休人员协会关注的是 50 岁及以上人群的需求和兴趣,因此其网站和设计可以让我们深入了解什么能引起老年用户的共鸣。


如果您喜欢这篇文章,请关注我的个人主页,以免错过任何后续文章!


17.探索我的其他文章


  • Color theory for designers: a beginner’s guide

  • Typography: 9 steps to choose the right font

  • How Duolingo engaged 500 million users: 9 psychological tricks



作者:Tamila Zamotailo

译者:章欣怡

审核:李泽慧

编辑:林庭婷

本文翻译已获得作者的正式授权(授权截图如下)




— END —


注:交互设计学堂公众号接受投稿啦,如果你有好的原创设计类文章,可联系客服。别让灵感溜走,快来投稿吧~~

© 2024 精读
删除内容请联系邮箱 2879853325@qq.com