这是我们要看的最后一个原则。 从广义上讲，它指出网站的内容和导航必须易于理解。 尽管实施许多建议的责任在于插件或主题的“最终用户”（或发布内容的人），但仍有一些建议可供那些插件和主题的开发人员实施。
可读（3.1）
第一条准则规定内容应“可读易懂”。 许多建议与内容的阅读水平有关，并且与不寻常的单词，缩写和首字母缩略词的使用有关，这些都不与开发人员相关。
我们可以实施的一项建议是，应该能够以编程方式识别网页的人工语言。 为此，应通过lang属性在<html>元素上指定lang 。 另外，应使用dir属性指示内容是否从右到左。
WordPress通过提供language_attributes()来打印所需的属性，从而简化了这一过程。 在主题的header.php中：
<html <?php language_attributes(); ?>> language_attributes()函数设置站点的语言，并在必要时设置方向，并过滤输出，从而允许插件（例如，多语言插件）适当地更改属性。
可预测的（3.2）
第二条准则指出，网站应该以可预测的方式呈现和表现。 通过确保主题HTML标记结构合理且合乎逻辑，可以实现许多建议。 随之而来的是许多“请勿做”的建议，即不要进行会破坏网页自然和逻辑行为的更改。
焦点行为
我们在本系列的第四篇文章（“可操作的”）中提到不使用tabindex 。 此建议基于此建议，即指出当某项获得焦点时，不应将其视为页面状态发生某些更改的触发因素。
例如，获得焦点的表单按钮不应引起该表单的提交，而获得焦点的链接不应引起该链接的激活。 这并不是说当适当的项目获得焦点时，不应出现工具提示或子菜单（如果是导航菜单）。 这些例子并不构成状态的改变。 松散地说，您可以将项目的关注点等同于将项目悬停。
不要阻止焦点
您应该避免将焦点从接收它的元素上移开。 例如，永远不要执行以下操作：
$('a').on('focus',function(){ $(this).blur(); });需要用户输入时帮助用户（3.3）
确保已识别错误
默认情况下，与主题开发人员相关的唯一表格是登录/注册，搜索和评论表格。 在这些主题中，主题开发人员通常仅对后两个主题给予任何关注。 由于搜索表单永远不会导致“错误”，因此我们在本节中将重点放在注释表单上。
WordPress可以很好地通知用户错误，并准确告知他们该错误是什么。 但是，这样做是通过允许用户离开原始页面，并向他们显示“死角”错误页面来实现的。
如果用户返回到原始页面，则表单将失去焦点，因此他们将不得不再次查找它。 更好的解决方案是阻止用户在正确填写表单之前提交表单。 但是，在执行此操作时，必须向用户传达输入的值无效，否则您将被困住。
有许多可用的客户端验证脚本，并且构建自己的简单验证脚本也非常容易。 重要的是：
- 用户离开具有无效值的字段（或尝试提交表单）后出现的错误消息应该传达出存在错误以及错误所在的位置（即，标识字段）。
- 应该使用ARIA属性将错误消息标识为警报：
role="alert"。 - 在适当的情况下，错误消息应尽可能明确，以告知用户为什么不接受输入的值。
这是一个简单的示例，基于WebAIM自己的可访问表单验证示例 （我鼓励您阅读），如果name字段为空，则会添加一条错误消息。
jQuery(document).ready(function($) {
$('#author').on( 'blur', function( e ){
var value = $(this).val();
if( !value ){
if( $('#author-error').length > 0 ){
$('#author-error').remove();
}
$( '<p id="author-error" class="alert alert-error" role="alert"></p>' )
.insertAfter( $('#author') )
.text( 'Name field error: Please provide a name' );
}else if( $('#author-error').length > 0 ){
$('#author-error').remove();
}
});
});WebAIM示例还可以防止用户使该字段无效，并将其返回到该字段以更正错误。 如果这样做，我建议您不要在该值为空的情况下将用户返回该字段，否则，您将使那些意外赋予该字段焦点但无意提交表单的用户感到沮丧。
如本系列前面所述，您不应仅依靠颜色或位置来传达含义。 在这种情况下，错误消息从文本来看应该很明显，与它们相关的字段也应该如此。
提供标签
主题仅应使用comment_form()来显示评论表单，并且这将以可访问的方式处理标签。 同样，默认搜索表单也不需要进一步的工作。 但是，在自定义或样式化这些表单时，您应该：
确保标签始终可见
标签必须始终可见。 具体来说，这意味着占位符不构成标签，并且不应用作搜索。 有几个原因：
- 屏幕阅读器的支持不一致。
- 占位符通常为柔和的颜色，可能难以阅读。
- 由于占位符会在该领域获得关注时消失，因此它会给认知障碍者造成可用性问题。
在适当的地方，提供进一步的说明
如果表单字段需要进一步的说明，则可以在该字段之后提供这些说明，但仍可以使用aria-describedby属性将其明确链接。 该属性引用的元素的内容在字段标签之后读出。
以W3C网站为例：
<form>
<label for="fname">First name</label>
<input name="" type="text" id="fname" aria-describedby="fname-description">
<p id="fname-description">A bit of instructions for this field linked with aria-describedby. </p>
</form>但是，您应该注意，屏幕阅读器之间对此功能的支持不一致 。
识别必填字段
必填字段应使用aria-required="true"属性进行标记。 由comment_form()生成的默认WordPress注释表单已经可以处理此问题，因此您无需在此处采取任何操作。 但是，如果您选择自定义注释表单，则应注意这一点。
结论
本文总结了有关W3C可访问性原则以及如何实现这些原则的粗略主题开发人员指南。 在本系列的最后一篇文章中，我们将探讨一些简单的方法，以进一步发展，并积极鼓励和帮助主题（或插件）的最终用户产生可访问的内容。
翻译自: https://code.tutsplus.com/tutorials/accessibility-part-5-understandable--cms-21796
1073
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
