无障碍

区块主题支持无障碍,并简化了添加无障碍的过程。

Landmark

组、模板片段和查询区块可以成为一个landmark。有两种方法来创建landmark。

使用区块标记
"tagName":"header”创建页眉landmark。

<!-- wp:group {"tagName":"header"} -->
<header class="wp-block-group"><!-- wp:site-title /--></header>
<!-- /wp:group -->

使用网站编辑器
区块面板中高级部分的HTML元素提供了以下landmark选项:

<header> <main> <section> <article> <aside> <footer>.

 

跳至内容

通过在组、模板片段或查询块上选择<main> landmark,可生成跳至内容的链接。在此了解更多关于跳到内容链接的信息。

<!-- wp:group {"tagName":"main"} -->
<main class="wp-block-group"><!-- wp:heading -->
<h2 id="hello-world">Hello World</h2>
<p>Welcome to WordPress. This is your first post. </p>
<!-- /wp:heading -->

 

无障碍导航菜单

导航块无需额外代码即可实现以下无障碍支持。

  • 支持响应式视图
  • 支持键盘导航
  • 插入<nav> landmark role
  • 插入ARIA属性aria-labelaria-hidden

 

补充资源

 

更新日志:

  • Created 2022-01-25