From e7f763227864158b5d3529fab7dcb6333a13a046 Mon Sep 17 00:00:00 2001
From: Jaime Iniesta <jaimeiniesta@gmail.com>
Date: Wed, 18 Mar 2020 17:19:04 +0100
Subject: [PATCH] Added aria-label to all nav items to improve accessibility.
 (#1516)

This ensures navigation landmarks are unique.

Related:

https://dequeuniversity.com/rules/axe/3.5/landmark-unique?application=rocketvalidator
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Roles/Navigation_Role
https://www.w3.org/TR/WCAG20-TECHS/ARIA14.html
---
 src/partials/footer.html      | 2 +-
 src/partials/header.html      | 2 +-
 src/partials/language/en.html | 7 ++++++-
 src/partials/language/es.html | 7 ++++++-
 src/partials/nav-item.html    | 2 +-
 src/partials/nav.html         | 2 +-
 src/partials/search.html      | 3 +--
 src/partials/tabs.html        | 2 +-
 src/partials/toc-item.html    | 2 +-
 src/partials/toc.html         | 2 +-
 10 files changed, 20 insertions(+), 11 deletions(-)

diff --git a/src/partials/footer.html b/src/partials/footer.html
index 22ca621a6..cc4e75a4b 100644
--- a/src/partials/footer.html
+++ b/src/partials/footer.html
@@ -28,7 +28,7 @@
   <!-- Link to previous and/or next page -->
   {% if page.previous_page or page.next_page %}
     <div class="md-footer-nav">
-      <nav class="md-footer-nav__inner md-grid">
+      <nav class="md-footer-nav__inner md-grid" aria-label="{{ lang.t('footer.title') }}">
 
         <!-- Link to previous page -->
         {% if page.previous_page %}
diff --git a/src/partials/header.html b/src/partials/header.html
index 9792e60a6..9ca6f90d1 100644
--- a/src/partials/header.html
+++ b/src/partials/header.html
@@ -24,7 +24,7 @@
 <header class="md-header" data-md-component="header">
 
   <!-- Top-level navigation -->
-  <nav class="md-header-nav md-grid">
+  <nav class="md-header-nav md-grid" aria-label="{{ lang.t('header.title') }}">
 
     <!-- Link to home -->
     <a
diff --git a/src/partials/language/en.html b/src/partials/language/en.html
index 0ab5ecea5..679c14a6c 100644
--- a/src/partials/language/en.html
+++ b/src/partials/language/en.html
@@ -27,8 +27,10 @@
   "clipboard.copy": "Copy to clipboard",
   "clipboard.copied": "Copied to clipboard",
   "edit.link.title": "Edit this page",
+  "footer.title": "Pie",
   "footer.previous": "Previous",
   "footer.next": "Next",
+  "header.title": "Header",
   "meta.comments": "Comments",
   "meta.source": "Source",
   "search.config.lang": "en",
@@ -39,8 +41,11 @@
   "search.result.none": "No matching documents",
   "search.result.one": "1 matching document",
   "search.result.other": "# matching documents",
+  "search.reset": "Reset",
   "skip.link.title": "Skip to content",
   "source.link.title": "Go to repository",
   "source.revision.date": "Last update",
-  "toc.title": "Table of contents"
+  "tabs.title": "Tabs",
+  "toc.title": "Table of contents",
+  "nav.title": "Navigation"
 }[key] }}{% endmacro %}
diff --git a/src/partials/language/es.html b/src/partials/language/es.html
index 23584f044..f1c431c47 100644
--- a/src/partials/language/es.html
+++ b/src/partials/language/es.html
@@ -26,8 +26,10 @@
   "clipboard.copy": "Copiar al portapapeles",
   "clipboard.copied": "Copiado al portapapeles",
   "edit.link.title": "Editar esta página",
+  "footer.title": "Pie",
   "footer.previous": "Anterior",
   "footer.next": "Siguiente",
+  "header.title": "Cabecera",
   "meta.comments": "Comentarios",
   "meta.source": "Fuente",
   "search.config.lang": "es",
@@ -36,8 +38,11 @@
   "search.result.none": "No se encontraron documentos",
   "search.result.one": "1 documento encontrado",
   "search.result.other": "# documentos encontrados",
+  "search.reset": "Restablecer",
   "skip.link.title": "Saltar a contenido",
   "source.link.title": "Ir al repositorio",
   "source.revision.date": "Última actualización",
-  "toc.title": "Tabla de contenidos"
+  "tabs.title": "Pestañas",
+  "toc.title": "Tabla de contenidos",
+  "nav.title": "Navegación"
 }[key] }}{% endmacro %}
diff --git a/src/partials/nav-item.html b/src/partials/nav-item.html
index a57cd9759..f4e8158aa 100644
--- a/src/partials/nav-item.html
+++ b/src/partials/nav-item.html
@@ -55,7 +55,7 @@
         {% include ".icons/material/chevron-right.svg" %}
       </span>
     </label>
-    <nav class="md-nav" data-md-level="{{ level }}">
+    <nav class="md-nav" data-md-level="{{ level }}" aria-label="{{ nav_item.title }}">
       <label class="md-nav__title" for="{{ path }}">
         <span class="md-nav__icon md-icon">
           {% include ".icons/material/arrow-left.svg" %}
diff --git a/src/partials/nav.html b/src/partials/nav.html
index 808d9d571..85d630c94 100644
--- a/src/partials/nav.html
+++ b/src/partials/nav.html
@@ -21,7 +21,7 @@
 -->
 
 <!-- Main navigation -->
-<nav class="md-nav md-nav--primary" data-md-level="0">
+<nav class="md-nav md-nav--primary" data-md-level="0" aria-label="{{ lang.t('nav.title') }}">
 
   <!-- Site title -->
   <label class="md-nav__title" for="__drawer">
diff --git a/src/partials/search.html b/src/partials/search.html
index 5b26214ee..d139a3033 100644
--- a/src/partials/search.html
+++ b/src/partials/search.html
@@ -31,7 +31,6 @@
         type="text"
         class="md-search__input"
         name="query"
-        aria-label="search"
         placeholder="{{ lang.t('search.placeholder') }}"
         autocapitalize="off"
         autocorrect="off"
@@ -48,7 +47,7 @@
       <button
         type="reset"
         class="md-search__icon md-icon"
-        aria-label="reset"
+        aria-label="{{ lang.t('search.reset') }}"
         data-md-component="search-reset"
         tabindex="-1"
       >
diff --git a/src/partials/tabs.html b/src/partials/tabs.html
index e1c11e197..3c4fec145 100644
--- a/src/partials/tabs.html
+++ b/src/partials/tabs.html
@@ -27,7 +27,7 @@
 {% endif %}
 
 <!-- Tabs with outline -->
-<nav class="{{ class }}" data-md-component="tabs">
+<nav class="{{ class }}" data-md-component="tabs" aria-label="{{ lang.t('tabs.title') }}">
   <div class="md-tabs__inner md-grid">
     <ul class="md-tabs__list">
       {% for nav_item in nav %}
diff --git a/src/partials/toc-item.html b/src/partials/toc-item.html
index cd99c6190..d74f5d35b 100644
--- a/src/partials/toc-item.html
+++ b/src/partials/toc-item.html
@@ -28,7 +28,7 @@
 
   <!-- Render nested item list -->
   {% if toc_item.children %}
-    <nav class="md-nav">
+    <nav class="md-nav" aria-label="{{ toc_item.title }}">
       <ul class="md-nav__list">
         {% for toc_item in toc_item.children %}
           {% include "partials/toc-item.html" %}
diff --git a/src/partials/toc.html b/src/partials/toc.html
index d55ee666a..6a5b14bde 100644
--- a/src/partials/toc.html
+++ b/src/partials/toc.html
@@ -23,7 +23,7 @@
 {% import "partials/language.html" as lang with context %}
 
 <!-- Table of contents -->
-<nav class="md-nav md-nav--secondary">
+<nav class="md-nav md-nav--secondary" aria-label="{{ lang.t('toc.title') }}">
   {% set toc = page.toc %}
 
   <!--