summaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorwebchick2014-06-13 02:46:38 (GMT)
committerwebchick2014-06-13 02:46:38 (GMT)
commited310e10602159d07226f302074a3985a4c6b9a7 (patch)
tree13f536eea3766b449732fb9c1763d414452b892f
parentd8505d2eb2569ec737d88ff9b929548ac808474a (diff)
Issue #2052473 by ricky.middaugh, lokapujya, Jalandhar, mgifford, jessebeach, BarisW, falcon03: Add aria-label or aria-describedby attributes to all <nav> elements.
-rw-r--r--core/includes/theme.inc2
-rw-r--r--core/modules/block/block.module7
-rw-r--r--core/modules/book/book.module15
-rw-r--r--core/modules/book/src/Plugin/Block/BookNavigationBlock.php3
-rw-r--r--core/modules/book/templates/book-all-books-block.html.twig9
-rw-r--r--core/modules/book/templates/book-navigation.html.twig5
-rw-r--r--core/modules/system/templates/breadcrumb.html.twig4
-rw-r--r--core/modules/system/templates/page.html.twig2
-rw-r--r--core/modules/toolbar/toolbar.module1
-rw-r--r--core/themes/bartik/templates/page.html.twig8
10 files changed, 32 insertions, 24 deletions
diff --git a/core/includes/theme.inc b/core/includes/theme.inc
index 290d0e6..e338fd1 100644
--- a/core/includes/theme.inc
+++ b/core/includes/theme.inc
@@ -2135,6 +2135,7 @@ function template_preprocess_page(&$variables) {
'#heading' => array(
'text' => t('Main menu'),
'class' => array('visually-hidden'),
+ 'attributes' => array('id' => 'links__system_main_menu'),
),
'#set_active_class' => TRUE,
);
@@ -2146,6 +2147,7 @@ function template_preprocess_page(&$variables) {
'#heading' => array(
'text' => t('Secondary menu'),
'class' => array('visually-hidden'),
+ 'attributes' => array('id' => 'links__system_secondary_menu'),
),
'#set_active_class' => TRUE,
);
diff --git a/core/modules/block/block.module b/core/modules/block/block.module
index ceffa1f..8c40c49 100644
--- a/core/modules/block/block.module
+++ b/core/modules/block/block.module
@@ -382,6 +382,13 @@ function template_preprocess_block(&$variables) {
if ($id = $variables['elements']['#block']->id()) {
$variables['attributes']['id'] = drupal_html_id('block-' . $id);
}
+
+ // Proactively add aria-describedby if possible to improve accessibility.
+ if (isset($variables['elements']['#block']->subject) && isset($variables['attributes']['role'])) {
+ $variables['title_attributes']['id'] = drupal_html_id($variables['elements']['#block']->subject);
+ $variables['attributes']['aria-describedby'] = $variables['title_attributes']['id'];
+ }
+
}
/**
diff --git a/core/modules/book/book.module b/core/modules/book/book.module
index 5f11fba..ad4b4d0 100644
--- a/core/modules/book/book.module
+++ b/core/modules/book/book.module
@@ -362,15 +362,6 @@ function book_form_node_delete_confirm_alter(&$form, $form_state) {
}
/**
- * Implements hook_preprocess_HOOK() for block templates.
- */
-function book_preprocess_block(&$variables) {
- if ($variables['configuration']['provider'] == 'book') {
- $variables['attributes']['role'] = 'navigation';
- }
-}
-
-/**
* Prepares variables for book listing block templates.
*
* Default template: book-all-books-block.html.twig.
@@ -389,7 +380,11 @@ function template_preprocess_book_all_books_block(&$variables) {
$elements = $variables['book_menus'];
$variables['book_menus'] = array();
foreach (Element::children($elements) as $index) {
- $variables['book_menus'][$index] = $elements[$index];
+ $variables['book_menus'][] = array(
+ 'id' => $index,
+ 'menu' => $elements[$index],
+ 'title' => $elements[$index]['#book_title'],
+ );
}
}
diff --git a/core/modules/book/src/Plugin/Block/BookNavigationBlock.php b/core/modules/book/src/Plugin/Block/BookNavigationBlock.php
index b36beff..604dbe6 100644
--- a/core/modules/book/src/Plugin/Block/BookNavigationBlock.php
+++ b/core/modules/book/src/Plugin/Block/BookNavigationBlock.php
@@ -136,6 +136,9 @@ class BookNavigationBlock extends BlockBase implements ContainerFactoryPluginInt
$pseudo_tree[0]['link'] = $book;
$book_menus[$book_id] = $this->bookManager->bookTreeOutput($pseudo_tree);
}
+ $book_menus[$book_id] += array(
+ '#book_title' => $book['title'],
+ );
}
if ($book_menus) {
return array(
diff --git a/core/modules/book/templates/book-all-books-block.html.twig b/core/modules/book/templates/book-all-books-block.html.twig
index b84b593..6160982 100644
--- a/core/modules/book/templates/book-all-books-block.html.twig
+++ b/core/modules/book/templates/book-all-books-block.html.twig
@@ -8,7 +8,8 @@
*
* Available variables:
* - book_menus: Book outlines.
- * - book_id: The parent book ID.
+ * - id: The parent book ID.
+ * - title: The parent book title.
* - menu: The top-level book links.
*
* @see template_preprocess_book_all_books_block()
@@ -16,8 +17,8 @@
* @ingroup themeable
*/
#}
-{% for book_id, menu in book_menus %}
- <nav id="book-block-menu-{{ book_id }}" class="book-block-menu">
- {{ menu }}
+{% for book in book_menus %}
+ <nav id="book-block-menu-{{ book.id }}" class="book-block-menu" role="navigation" aria-label="{% trans %}Book outline for {{ book.title }}{% endtrans %}">
+ {{ book.menu }}
</nav>
{% endfor %}
diff --git a/core/modules/book/templates/book-navigation.html.twig b/core/modules/book/templates/book-navigation.html.twig
index af6cf51..abb0d31 100644
--- a/core/modules/book/templates/book-navigation.html.twig
+++ b/core/modules/book/templates/book-navigation.html.twig
@@ -24,7 +24,6 @@
* - book_url: The book/node URL of the current outline being viewed. Provided
* as an option. Not used by default.
* - book_title: The book/node title of the current outline being viewed.
- * Provided as an option. Not used by default.
*
* @see template_preprocess_book_navigation()
*
@@ -32,10 +31,10 @@
*/
#}
{% if tree or has_links %}
- <nav id="book-navigation-{{ book_id }}" class="book-navigation">
+ <nav id="book-navigation-{{ book_id }}" class="book-navigation" role="navigation" aria-labelledby="book-label-{{ book_id }}">
{{ tree }}
{% if has_links %}
- <h2 class="visually-hidden">{{ 'Book Navigation'|t }}</h2>
+ <h2 class="visually-hidden" id="book-label-{{ book_id }}">{{ 'Book traversal links for'|t }} {{ book_title }}</h2>
<ul class="book-pager">
{% if prev_url %}
<li class="previous">
diff --git a/core/modules/system/templates/breadcrumb.html.twig b/core/modules/system/templates/breadcrumb.html.twig
index 5f322f9..8a4f438 100644
--- a/core/modules/system/templates/breadcrumb.html.twig
+++ b/core/modules/system/templates/breadcrumb.html.twig
@@ -10,8 +10,8 @@
*/
#}
{% if breadcrumb %}
- <nav class="breadcrumb" role="navigation">
- <h2 class="visually-hidden">{{ 'You are here'|t }}</h2>
+ <nav class="breadcrumb" role="navigation" aria-labelledby="system-breadcrumb">
+ <h2 id="system-breadcrumb" class="visually-hidden">{{ 'Breadcrumb'|t }}</h2>
<ol>
{% for item in breadcrumb %}
<li>{{ item }}</li>
diff --git a/core/modules/system/templates/page.html.twig b/core/modules/system/templates/page.html.twig
index 1f6f916..d3739e5 100644
--- a/core/modules/system/templates/page.html.twig
+++ b/core/modules/system/templates/page.html.twig
@@ -96,7 +96,7 @@
</header>
{% if main_menu or secondary_menu %}
- <nav role="navigation">
+ <nav role="navigation" aria-labelledby="links__system_main_menu">
{{ main_menu }}
{{ secondary_menu }}
</nav>
diff --git a/core/modules/toolbar/toolbar.module b/core/modules/toolbar/toolbar.module
index 3d6c1fe..131a1a5 100644
--- a/core/modules/toolbar/toolbar.module
+++ b/core/modules/toolbar/toolbar.module
@@ -80,6 +80,7 @@ function toolbar_element_info() {
'id' => 'toolbar-administration',
'class' => array('toolbar'),
'role' => 'navigation',
+ 'aria-label' => t('Site administration'),
),
// Metadata for the administration bar.
'#bar' => array(
diff --git a/core/themes/bartik/templates/page.html.twig b/core/themes/bartik/templates/page.html.twig
index a906e97..8c739bb 100644
--- a/core/themes/bartik/templates/page.html.twig
+++ b/core/themes/bartik/templates/page.html.twig
@@ -79,9 +79,9 @@
#}
<div id="page-wrapper"><div id="page">
- <header id="header" class="{{ secondary_menu ? 'with-secondary-menu' : 'without-secondary-menu' }}" role="banner"><div class="section clearfix">
+ <header id="header" class="{{ secondary_menu ? 'with-secondary-menu' : 'without-secondary-menu' }}" role="banner" aria-label="{{ 'Site header'|t}}"><div class="section clearfix">
{% if secondary_menu %}
- <nav id="secondary-menu" class="navigation" role="navigation">
+ <nav id="secondary-menu" class="navigation" role="navigation" aria-labelledby="links__system_secondary_menu">
{{ secondary_menu }}
</nav> <!-- /#secondary-menu -->
{% endif %}
@@ -120,7 +120,7 @@
{{ page.header }}
{% if main_menu %}
- <nav id ="main-menu" class="navigation" role="navigation">
+ <nav id ="main-menu" class="navigation" role="navigation" aria-labelledby="links__system_main_menu">
<div id="nav"></div>
<div id="no-nav"></div>
<a class="main-menu-reveal" href="#nav">{{ 'Menu'|t }}</a>
@@ -156,7 +156,7 @@
{% endif %}
{{ title_suffix }}
{% if tabs %}
- <nav class="tabs" role="navigation">
+ <nav class="tabs" role="navigation" aria-label="{{ 'Tabs'|t }}">
{{ tabs }}
</nav>
{% endif %}