使网站可访问的基本原则【手机网站开发】

可访问性,屏幕阅读器以及用户如何与语音命令应用程序交互的主题可能难以掌握。 但对于90%的网站,有简单的选择,将确保网站是大多数可访问,即使没有深入了解无障碍原则...

可访问性,屏幕阅读器以及用户如何与语音命令应用程序交互的主题可能难以掌握。 但对于90%的网站,有简单的选择,将确保网站是大多数可访问,即使没有深入了解无障碍原则。

在这篇文章中,将只讨论五个对任何网站的可访问性都有重大影响的事情。 

手机网站开发

相关链接:跨桌面和移动的移动网络行为【手机网站开发】

1. 按钮是标准HTML

按钮触发动作。 也许他们保存进度,提交表单,打开面板或发送消息。 无论如何,它们是按钮。 所以,如果您正在做任何这些任务:您应该使用标准的HTML按钮。 这可以是类型的输入元素“提交”类型的输入元素“按钮”,或者一个按钮元素。 网站设计制作中任何其他选择不是按钮。

为什么这会产生影响? 按钮可从键盘本地使用。 这意味着您的浏览器和操作系统已经知道如何处理按钮元素。 您可以在您的网站设计制作中添加JavaScript以使任何元素响应鼠标点击; JavaScript不关心它使用什么元素。 但是这些元素不能用于键盘。 用户将无法找到或激活它们。

如果在您的网站设计制作中您已经建立的东西,看起来像一个按钮,但实际上是一个跨度或股利 ,那么很多用户将无法找到它,或者用它。

2. 链接永远是链接

很像按钮,链接服务于一个网站设计的特定目的:他们带您去某个地方。 链接也可以从键盘本身使用,所以您可能会试图使用链接来执行一些按钮式的操作; 但您应该抵制这种诱惑。 链接是许多元素之一,您可以将JavaScript附加到并启动类似按钮的事件,例如提交表单。 链接是比使用像一个div或跨度完全非语义元素更好的选择,但他们还是会引起一些问题。

目击的用户可能在网站设计中无法区分看起来像按钮的东西和实际上是按钮的东西之间的区别; 但屏幕阅读器用户会被告知。 因此,如果屏幕阅读器找到链接,则用户可能期望它将她带到网站设计相同页面上的新页面或新位置。 如果它实际上立即执行一个动作,那可能是令人沮丧的,并且肯定使得界面更难使用。

请记住,那就是,一个一个元素不是链接。 A元素是一个“锚”的元素。 如果添加href属性,那么它有什么地方去了,就变成了链接。 否则,它仍然是一个锚点:您可以使用链接定位的着陆点。 但锚点不是从键盘本身可用的东西 - 在网站设计制作中只有一个链接。

3. 图像孤独是无意义的

图片为网站设计添加情感,信息和上下文内容。 他们可能传达心情,说明图表,或指示您的购物车中的商品现在缺货。 但这些图像只传达这些信息,如果您能看到它们。 视觉残疾人不能访问图像本身。 要使图片可访问,请提供有意义的文字,以分享图片中的内容。

图片并不意味着插入您的网页设计的.png或.jpg文件。 图像是以图形方式表示文本的任何信息。 它也可以是用于指示菜单或.svg资源的图标字体字符。 没关系:如果它是视觉的,它需要文本。

您提供替代文字的方式将因图像而异。 如果它是直接一个img元素,使用alt属性。 对于图标字体,您将受益于使用ARIA标签属性。 它变得复杂与.svg; 但您绝对可以让.SVG访问。

识别图像的优点需要考虑。 完全是观赏的图像不需要更多的上下文。 但请务必在该图片上提供一个空的alt属性,以通知屏幕阅读器此图片将被忽略。

4. 标签一切

您在网站设计制作上的任何地方都有表单吗? 它有标签吗? 如果没有,那肯定会导致某人的问题。 不难快速检查表单是否有标签。 首先,看看窗体。 确保表单字段旁边有文本,指示字段的用途。 这是一个好的第一步。 现在点击文本。 不是字段本身,而是它旁边的文本。 您的光标是否自动移动到输入字段中? 如果是,则该字段被适当标记。

如果表单没有标签,那么屏幕阅读器用户不知道该字段中属于什么,除非通过探索 - 搜索可能指示其所属的附近文本。 如果附近有文本没有明确标记字段,用户可能会找到它。 但她真的不能确定她听到的文本实际上属于这个领域。

您最近查看过您的结帐程序吗? 没有什么像解决一个复杂的拼图输入信用卡信息。 它导致一个废弃的购物车。

5. 管理“焦点”

手机网站开发

相关阅读:将会杀死你的B2B电子商务发布的7个错误 【手机网站开发】

“焦点”是一个可访问性术语,描述网站设计上的键盘命令将在哪里生效。 如果您当前正在输入文本字段,则焦点位于该文本字段中。 如果你点击tab键,你应该被移动到窗体中的下一个字段,如果有的话。

不是所有的用键盘导航的人都是盲人。 事实上,相当大比例的用户至少部分地从键盘一直导航。 填写表单的人很少拿起他们的鼠标点击下一个表单域:他们打他们的选项卡键并向前移动。

对导航键盘有更多依赖的人通常使用Tab键来浏览您的网站设计。 如果用户在通过键盘导航时无法看到他在您的网站上的位置,您的网站可能几乎无法使用。

通过键盘导航取决于两个关键特性。 首先,用户应该能够访问页面上的所有内容。 这意味着任何下拉菜单应该可以从键盘到达。 正确创建的控件和链接 - 使用合法的按钮和链接 - 不会是一个问题。 但是,如果您的网站设计制作已经使用DIV, 跨度大 ,或锚元素,就会有麻烦。

第二,当用户到达可聚焦的东西时,他需要看到他已经到达它,在一个明显而不是微妙的方式。

6. 不完美,但更好

这五个基本网络开发领域将覆盖大多数用户的需求。 您会有一个完全可访问的网站吗? 不,不一定。 这份清单并不详尽。 但是,对于访问您网站的每个人,您都能获得更好,更有用的体验。

建站行微信公众号二维码

建站行微信号:jianzhanhang