使您的网站易于访问的几种方法

已发表: 2017-02-15

构建页面及其资产使其对机器友好,无论该机器是什么。 添加允许用户(包括残障用户)和机器直接获得有意义的内容的常识技术,并确保您正在朝着使您的网站易于访问和搜索引擎友好的方向发展。

我们都熟悉 WordPress 的强大功能,它允许新手或非技术人员设计和开发自己的网络资产。 该平台易于设置,并为主题和插件提供了一个可靠的框架,这些框架将决定您的内容和功能将如何为任何访问者提供。

如果您希望残障人士可以访问您的网站,您会发现基本的 WordPress 有很多东西可以促进无障碍网站的开发,并且不难通过添加插件和良好的技术。

在我们开始之前,有两个重要的因素需要注意。 首先,单独实施这四种技术不会使任何网站在符合所有必要要求的情况下完全可供所有人访问,但它将解决最常见的 Web 访问障碍并提供更大的可访问性。

其次,重要的是要理解,只有通过设计、开发和最佳内容创作实践的合作才能实现可访问性。 设计师可能会设计一个可访问的主题,开发人员可能会添加可访问的功能,但如果内容作者插入了没有 alt 标签的有意义的图像,则网页的全部含义将无法访问。

考虑到这一点,这里有四个提示,可让您轻松访问您的网站。

图像的替代文本

众所周知,Web 可访问性的最大障碍是正确使用 alt 文本来描述网页上的图像。 如果每个构建网站的人都解决了这一点,它将消除最多的可访问性投诉。 这就是为什么我们迫切需要开发一个惊人的插件 SEO Image Optimizer,它填补了图像上缺少 alt 标签的空白。

要理解的基本点是,如果您要在您的网站上放置图像,则必须使用替代文本正确标记它们。 换句话说,您在网上发布的每张图片都必须对机器人在搜索引擎上列出您的图片有意义。

alt 标签中的信息允许屏幕阅读器(向有视觉障碍的用户朗读网页)、纯文本浏览器和不会加载图像的慢速连接的用户理解图像传达的信息。

如果图像没有意义,例如纯粹用于装饰,则有两种处理方法。 如果您使用 CSS 将其加载为背景图像,屏幕阅读器将忽略它,并且该图像不需要 alt 标签(请注意,因为这也适用于有意义的图像:如果您在背景中加载它,屏幕阅读器将忽略它)。 如果图像使用 HTML 显示但纯粹是装饰性的,则使用 alt 标签但将其留空。 这告诉屏幕阅读器图像存在但对用户没有意义并且可以被忽略,这使得您的网站更容易被读者访问

当您在图像上贴上标签时,请使用一些描述性文字,让看不见的人理解图像的含义。 这需要判断:为什么图像会出现在这里,它传达了什么信息,以及哪些词最能传达相同的含义。 不要陷入对每个视觉细节的字面描述中,传达意义。

一个典型的例子是放大镜图像用作开始搜索的按钮。 图像是有意义的,所以它应该被描述。 将其描述为“放大镜”对用户没有帮助。 他们需要知道的是,单击此按钮将开始搜索,因此“单击此处搜索”甚至只是“搜索”的替代文本可能是最合适的。

只有服务于目的的图像必须被标记。 这些示例如下:

用作按钮的图像

用作链接的图像

用于任何其他控件的图像

与内容直接相关的图像

这种技术适用于所有网站,当然,不仅仅是 WordPress 网站。 然而,WordPress 比大多数都更容易,首先是允许内容作者在 Visual 和 HTML 视图之间切换,其次是在使用添加媒体功能插入图像时为 alt 文本提供一个字段。

插件以获得更好的可访问性

可以通过使用各种插件来增强 WordPress 的可访问性。 这些插件易于设置,它们将使有各种残疾的用户能够访问该站点。 以下是我发现的一些插件,它们可以使您的网站易于访问。

访问密钥

访问密钥插件允许将访问密钥分配给您网站上的链接和控件。 例如,可以为主页链接分配访问键组合alt+h,并且可以为搜索按钮分配alt+s组合键。 访问密钥(例如所提供的示例)使视障用户和行动不便的用户能够轻松访问他们想要的内容。

轻松转推

Easy Retweet 是一个插件,可让您向页面添加可访问的按钮,以便在 Twitter 上分享您的内容。 这样,如果残障人士希望与他们的朋友分享您的页面,他们可以毫无困难地做到这一点。

AStickyPostOrderER

AstickyPostOrderER 允许您选择显示内容的顺序。 您可以选择从最旧到最新或以相反的顺序显示内容。

Hackadelic SEO 目录

Hackadelic SEO 目录插件使您能够为您的帖子或页面提供目录。 这将使您的内容易于查找。

WP-民意调查

WP-Polls 允许残障人士参与您网站上的任何民意调查

新插件一直在开发。 使用 WordPress 仪表板功能搜索更多信息。 尝试不同的插件并要求您的残障用户给您反馈

使用任何插件时,请确保使用的插件与您选择的主题以及彼此兼容。 如果您的插件与您的主题不兼容,它们要么无法工作,要么会给尝试浏览您网站的禁用用户带来更多问题。 如果您的插件彼此不兼容,您的网站可能会变得不可用或内容显示不正确。

标题的方法

当您设计页面时,以正确的顺序使用标题来构建内容至关重要: <h1><h2><h3>等等。 当您使用标题构建内容时,使用屏幕阅读器的人可以获得页面内容的摘要并更轻松地浏览它们。 屏幕阅读器用户可以通过按字母“H”前进和“shift+H”后退来访问他们想要的内容部分。

您可以使用标题 1 到 6 标记您的内容,以使您的网站易于访问。 检查您的主题如何使用标题(例如,您的主题可能会或可能不会将<h1>应用于网站标题,并且该网站标题可能会或可能不会出现在每个网页上。无论哪种方式,请确保使用的第一个标题是<h1>并且在适当的情况下,以下标题(页面标题、页面子部分、段落标题)按顺序下降到<h6>

排序有一定的灵活性,但最明智的选择是保持标题按数字顺序排列,并且不要混淆它们,因为这会给用户和搜索引擎带来危险(不要像这样混合它们 - > <h1><h4><h2>等)。

导航链接很有用

最后,您需要在网站设计中包含导航链接。 这些导航链接将允许残障用户跳过导航栏或其他菜单和搜索框,并通过单击这些链接跳转到页面上的某些位置。 或者,用户可以快速跳转到网站上所需的部分。 这些链接需要出现在用户需要跳转到有意义的内容的任何地方。 这些链接可能会说的例子是:

跳到主要内容

跳转到导航栏

跳转到搜索

一些 WordPress 主题可能已经提供了此类链接。 如果是这种情况,您将需要检查这些链接以查看是否必须添加您自己的任何链接。 但是,其他主题不会提供导航链接。 因此,您需要自己添加这些链接。

包起来

我将重复我之前所说的,这些步骤都不能保证您 100% 可访问网站,但是是的,它会提高您网站对访问您网站的每个访问者的可访问性,并且您的网站比 90% 的 WordPress 网站更容易访问.

残障访问者将能够像其他访问者一样浏览您的网站。 由于这些访问者还包括搜索机器人,因此您应该确信一件事,使您的网站可访问也将使您的业务受益,并帮助您在搜索引擎中排名靠前,最终为您的业务带来更多利润。

我希望这篇博文对您有用,您将从这里获取一些关键元素,您将