当前位置: 首页 关于我们 新闻动态
品牌介绍 新闻动态 联系我们
宝安网站建设分享改善网站用户体验的5种方法
浏览次数:248次 发布日期:2022-04-16

  您设计了一个壮观的用户界面,您特别引以为豪。但是,您只面临一个问题:并非所有用户都可以访问它。宝安网站建设觉得这个事实出现在测试中:作为 QA 过程的一部分,您应该确保每个人都可以访问您的网站。除了成为一名[敏感词]设计师的一个方面之外,确保您的网站完全可访问还有很多好处。

  您的网站更有可能健壮并且在搜索引擎上排名靠前。它也更有可能产生业务,因为客户讨厌在完成购买之前必须清除障碍。虽然您当然希望品牌的数字体验保持吸引力,但宝安网站建设有几种方法可以在不牺牲设计的情况下提高页面的可访问性。

  一、字体大小、可读性和易读性

  根据之前的一项调查,内容过多的页面在残疾受访者的问题列表中名列前茅。

  不要过度填充你的页面也是很好的设计感。争夺消费者注意力的东西越多,他们就越有可能不知所措并完全从您的网站上反弹。

  从本质上讲,您需要将您的业务系统化,其中一个步骤是使您的页面清晰易读。

  您可以通过使用内置格式功能来做到这一点。任何包含长测试块的页面都应该分成小标题,并带有清晰明了的标题——一个 <h1> 标签。

  简单地分解文本将使人们更轻松地扫描您的页面。但是,正确使用格式意味着那些有视力障碍并使用屏幕阅读器的人可以跳到他们需要的部分。

  确保您的副标题正确标记,而不仅仅是更大的字体。如果您使用列表,请在 HTML 中使用 <ul> 或 <li> 标记将其标记,这将确保它以正确的格式呈现。

  一个更简单的技巧是确保您选择的字体足够大,并与背景提供足够的对比度,使其易于阅读。Web 内容可访问性指南建议对比度至少为 4.5:1,但启动文本有例外情况。

  也有人建议,无衬线字体——是的,包括(但不限于)Comic Sans——可能更容易让患有阅读障碍的人阅读。

  二、考虑色盲和你的颜色

  以下是您在构建网站时可能没有考虑的事情:色盲人可能难以区分您使用的色调。由于色盲人群占美国人口的 5-10%,因此您可能会疏远大量用户。

  在这里,众包测试可能是一个有用的工具:你会从几个不同的角度来了解区分的容易程度,特别是如果你使用黑白进行测试。

  事实上,黑白测试是一种很好的方式,可以让您自己了解特征在没有明亮色调的情况下如何脱颖而出。红绿色盲是最常见的类型,人们无法区分两者。

  想想有多少错误消息以红色突出显示。当您以灰度查看页面时,很明显添加颜色不足以引起注意。考虑清楚地标记任何图表并添加额外的提示 - 例如强调您的目标的感叹号,或通过色盲测试运行您的网站。

h3.jpg

  三、HTML 和 CSS 的分离

  到处都是屏幕阅读器用户的祸根,HTML 和 CSS 交织在一起意味着机器陷入了混乱。另外,可怜的听众会被他们不需要的信息轰炸。

  幸运的是,我们现在能够分离 HTML 和 CSS。您可以在需要的地方使用 CSS 元素构建页面,例如页面顶部的站点菜单,而将它们固定在适当位置的 HTML 代码也可以在页面底部发挥作用。

  这可能需要进行一些功能测试,尤其是在您不习惯的情况下。尝试放置以确保屏幕阅读器之类的工具可以像完全可见的人一样应对。

  链接和表单框说明

  通用 CTA

  您查看了多少页面,其中号召性用语 (CTA)是通用的“单击此处”或“阅读更多”?如果屏幕阅读器按顺序读出这些按钮,您认为将它们彼此区分开来有多容易?

  好吧,你猜对了:一点也不容易。

  方便地,有一个快速解决方法:您可以将链接命名为更具体的名称,没有视觉障碍的人也可以看到,或者您可以使用 aria-label 属性。

  这意味着您网站的可见元素保持不变,但屏幕阅读器将宣布替代标签。当你大声朗读时,你的“阅读更多”标签可以变成“阅读更多关于网站可访问性”。

  形式

  填写表格是大多数企业潜在客户收集策略的重要组成部分——如果您正在进行调查,这一点尤其重要。尽管如此,仍有大量网站推送的表单充其量难以填写,最坏的情况是完全无法访问。

  一种让表格更容易填写的超级简单方法?让自动填充发挥它的魔力。您很可能会从非残障人士和残障人士那里获得更多潜在客户,这仅仅是因为您消除了注册道路上的障碍。

  事实上,根据 The Manifest 的说法,81%的受访者在开始填写表格后就放弃了。因此,启用自动填充将使您的网站更易于访问并提高您的整体注册量,从而听起来对我们来说是一场胜利。

  这对您的定位和重新定位策略特别有帮助:谁不想要更多的订阅者?

  下载

  另一个简单的调整是这样标记任何下载链接。这对视力正常的用户也非常有用,用 CSS 编写代码很有意义。您甚至可以注意到文件有多大,以防人们在手机上查看并且不喜欢下载大量文件或数据或 Wi-Fi 信号较弱。

  四、图片和视频

  在可访问性方面经常被忽视的另一个元素是带有视觉元素的替代文本和音频。您所有的基本图像都应标有替代文字,简要描述图片中的内容。理想情况下,所有视频都应为听障人士提供文字记录和/或字幕。如果看起来合适,您甚至可以为任何视频添加音频描述。

  随着程序的变化和关于什么是好的设计的新研究的出现,及时了解软件测试新闻总是一个好主意。在可访问性方面尤其重要。残障人士经常被忽视,以至于直到最近设计师才开始考虑网站的可访问性。

  仅使用键盘导航来尝试您的网站,或者甚至使用眼罩来查看您是否可以轻松导航。或者,理想情况下,您可以招募一些有残疾的 QA 测试人员,将他们独特的见解带到桌面上。

  五、最后的想法

  谁知道呢,您甚至可能会找到一个成为标准实践的解决方案,为更高的可访问性和可用性铺平道路。当然,这可能需要在后台进行一些修改,但好处——不仅仅是从财务角度来看——是无穷无尽的。以专业的可访问性为每个人优化您的网站体验,您的网站的潜力将是无限的。

深圳做网站开发公司,响应式网站建设服务商,高端网站制作方案,企业建站服务定制价格
网站地图 版权所有:深圳市万创科技有限公司 粤ICP备14001694号
友情链接: 万创科技 Google推广公司 苏州网站建设 永康网络公司 外贸网站建设 青岛网站建设 合肥网站建设 互联网加盟

陈小姐:

136-3280-8615

扫码有优惠

了解更多请添加微信:
13632808615

复制并跳转微信

x