<nav> for the footer and navigation does not include aria-label

<nav> element needs to include aria-label or aria-labelledby which
causes issues for the screen readers.

TNL-1510

lms/templates/footer.html

@@ -6,8 +6,8 @@
 
 <div class="wrapper wrapper-footer">
   <footer>
-    <div class="colophon">
-      <nav class="nav-colophon">
+    <nav class="colophon">
+      <div class="nav-colophon" aria-label="${_('Colophon')}">
       <ol>
           <li class="nav-colophon-01">
           <a id="about" href="${marketing_link('ABOUT')}">
@@ -39,7 +39,7 @@
           </a>
           </li>
       </ol>
-      </nav>
+      </div>
 
       <div class="wrapper-logo">
         <p>
@@ -61,7 +61,7 @@
 	    link_end=u"</a>"
 	)}
       </p>
-        <nav class="nav-legal">
+        <nav class="nav-legal" aria-label="${_('Legal Documents')}">
           <ul>
 	    %if marketing_link('HONOR') and marketing_link('HONOR') != '#':
             <li class="nav-legal-01">
@@ -89,7 +89,7 @@
             </li>
           </ul>
         </nav>
-    </div>
+    </nav>
 
     ## please leave this link and use one of the logos provided
     <div class="powered-by">

lms/templates/navigation.html

@@ -36,8 +36,8 @@ site_status_msg = get_site_status_msg(course_id)
 % endif
 </%block>
 
-  <header class="global ${"slim" if course else ""}" aria-label="${_('Global Navigation')}">
-    <nav>
+  <header id="global-navigation" class="global ${"slim" if course else ""}" aria-label="${_('Global Navigation')}">
+    <nav aria-labelledby="global-navigation">
     <h1 class="logo">
       <a href="${marketing_link('ROOT')}">
         <%block name="navigation_logo">