南京网站制作公司

当前位置: 网站首页 - 新闻动态 - 网站知识 -

使您的网站更易于访问的 5 种简单方法

发布时间:2024-11-08

来源:

停下来想一想昨天。想象一下您有多少使用计算机来度过一天。您在网上订购了需要的东西吗?你申请工作了吗?您是否安排了医生预约?


让我们面对现实吧,我们今天都比历史上任何时候都更多地依赖网站。您甚至不必离开家来支付账单、去杂货店,甚至去看医生。我们都经历过那些令人沮丧的时刻,当某些东西在网站上无法正常工作时。现在,想象一下这是否是您每天都会遇到的问题。


网站应该是“用户友好的”,但通常并非每个人都如此。很多时候,网站在设计时并未考虑到辅助功能,因此任何残障人士都可以使用它们。


使您的网站更易于访问的 5 种简单方法

通过提高网站的可访问性,您可以使其对任何人都更有用,无论他们是处理永久性残疾(例如视力障碍)还是暂时残疾(例如手臂骨折),甚至是情境性残疾(例如屏幕上的明亮阳光)。


此外,您还可以扩大潜在受众范围,确保您不会隔离任何用户或潜在客户。


不用担心,您不必投入大量额外资源来使您的网站更易于访问。


确保您的站点无需鼠标即可使用

所有用户都应该能够清晰、合乎逻辑地浏览您的网站内容。但是,并非每个人都可以使用鼠标或触控板。辅助技术帮助残障人士访问网站,帮助确保每个访问者都能访问这些信息和功能。有些人使用键盘、单开关输入、口棒(用作打字棒或翻页器)或屏幕阅读器。


避免使用仅在用户将鼠标悬停在项目上时激活的元素,因为仅键盘用户或屏幕阅读器通常无法访问它们。您可以通过尝试在没有鼠标的情况下导航来轻松测试您的网站。


问问自己这些问题:


是否可以仅使用键盘上的 Tab 键功能访问所有内容?

我有明确的重点状态吗?

Tab 键顺序是否按逻辑流动?

有关一些其他帮助,您可以访问 WebAIM,它提供了键盘辅助功能设计指南。


向所有图像添加替代文本

确保屏幕阅读器可以访问您的网站的另一种方法是为所有图像添加替代文本。


替代文本是图像的简要说明,例如“戴眼镜的年轻人在繁忙的咖啡店里用笔记本电脑工作”。大多数用户永远不会看到描述,但屏幕阅读器依赖于它们。屏幕阅读器是盲人或视障人士使用的一种辅助技术。该软件应用程序使用文本转语音 (TTS) 引擎将屏幕上的信息转换为语音。


什么是好的替代文本?文本应包含您希望通过图像传达的信息,并且应该具有相当的描述性。这对于图表和信息图表等内容至关重要。如果图像中包含文本,则该文本也应包含在 alt 格式中。


但是,如果图像仅用于装饰,则可以将 alt 文本留空。


问问自己这些问题:


每个关键图像(非装饰性元素)都有替代文本吗?

我的 alt 文本是否具有描述性?

是否所有信息都由替换文本或其他方法直观地显示(例如图表)?

精心设计的替代文本实际上也可以改善您网站的 SEO。这可能意味着您有更多的流量和转化率。确保为图片提供描述性摘要 - 并在适用时包含关键词 - 以通过替代文本提升你的 SEO。


重新考虑颜色选择

颜色是网站中一个关键但经常被忽视的元素。不同的人以独特的方式感知颜色,因此您的网站对每个人来说看起来都不一样。色盲是一种常见的残疾。红绿色是最常见的色觉缺陷形式,其次是蓝黄色。您应该使用高颜色对比度和其他方法设计网站,而不是单独使用超链接的颜色,例如粗体或带下划线的文本。


“网站上的号召性用语按钮通常用鲜艳的颜色表示,”Armstrong 说。“大多数人都会浏览网站,所以如果号召性用语按钮处于某人难以看到的颜色范围内,那么你可能会错过销售。”


如果背景文本和前景文本之间的对比度较低,则某些文本也可能难以阅读。确保您的文本在您选择的任何背景中脱颖而出。


不确定如何测量颜色之间的对比度?您可以在 WebAIM 上找到一些颜色对比度检查工具。我们也非常喜欢 Contrast Checker。


不要使用自动播放的媒体

这是另一种提高网站可访问性的方法,我们都可以支持:不要使用在没有用户首先提示的情况下启动的媒体元素。


“当你访问一个页面时,它开始发出噪音,这对每个人来说真的很烦人,”阿姆斯特朗说。“虽然我们大多数人都会很快地点击'关闭'干扰,但那些依赖辅助技术的人可能无法很容易地关闭它,或者根本无法关闭它。这是失去访客的快速方法。


使用屏幕阅读器时,弄清楚如何关闭媒体可能特别困难。如今,大多数网站都使用 JavaScript 来添加交互性和功能,但动态内容可能会给屏幕阅读器带来问题。因此,开发人员必须牢记这一点,以确保适当的可访问性。


自动播放媒体不仅令人烦恼,而且对于任何对快速闪烁的灯光和移动模式敏感的光敏性癫痫 (PSE) 患者来说,也可能对健康造成危害。


这是一个免费的PSE分析工具,开发者可以通过马里兰大学的信息研究学院追踪研发中心使用,来识别他们的网页内容和软件中的癫痫发作风险。


此外,最好避免在设计中使用轮播和滑块,以防止在移动到下一个图像或幻灯片之前需要更多时间来吸收信息的用户感到沮丧。


问问自己这些问题:


用户是否可以启动所有内容(无自动播放)?

所有媒体播放器都可以与键盘一起使用吗?

任何地方都有快速闪烁的灯光和移动的图案吗?

专业提示:如果您有时间和资源,请为所有媒体提供隐藏式字幕和转录。


为您的链接指定唯一的描述性名称

使您的网站对 ADA 更友好的另一种简单方法是使用正确描述您的链接将要去向的文本。例如,使用“单击此处”不是很具有描述性。这对于可能无法在页面其余部分的上下文中阅读链接的屏幕阅读器用户来说是无效的。您应该更具体,例如 “Read About Us” 而不是简单的 “Read More”。对于使用语音识别软件的访问者来说,这要容易得多。


另一个例子:如果你有一个电子邮件注册表单,而不是最后一个按钮“提交”,而是希望使用“立即订阅”。这提供了用户将要执行的操作的更清晰描述。


屏幕阅读器用户通常通过第一个字母进行搜索来浏览链接,因此请务必先显示链接中最独特的内容。


结论:


这五种使您的网站更易于访问的简单方法并不能涵盖所有内容,但它是使您的网站对每个人都更有用的良好开端。请记住,您进行这些设计更改是为了消除阻止人们访问您的网站以及购买您的产品或服务的任何障碍。


“现在肯定对无障碍有了更多的认识,”阿姆斯特朗说。“越来越多的公司意识到,让网站无障碍化更容易。他们开始看到,他们可以做很多小的改变,这些改变可以产生很大的不同。


“做出任何改变都是朝着正确方向迈出的一步——它可以提高知名度和包容性,向你的用户表明每个人都受到欢迎。”

策略思维与细节的完美结合,有效帮您减少试错成本

策略思维与细节的完美结合,有效帮您减少试错成本

立即与安优联系,开启网站设计全新体验

立即与安优联系,开启网站设计全新体验

立即与安优联系
开启网站设计全新体验

立即与安优联系
开启网站设计全新体验

在线咨询

在线咨询

拨打电话

返回顶部

品质设计 用心服务

  • 12年+定制经验

  • 600+客户选择

  • 高效售后保障

7*24小时服务热线