docs(): Basic accessibility improvements

angular · Oct 16, 2014 · a355942 · a355942
1 parent 5aa39eb
commit a355942
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 16 deletions.
diff --git a/docs/app/partials/home.tmpl.html b/docs/app/partials/home.tmpl.html
@@ -12,7 +12,7 @@
   </md-content>
 
   <md-content layout="horizontal" layout-align="center center" style="padding-top: 50px;">
-        <iframe width="560" height="315" src="//www.youtube.com/embed/Q8TXgCzxEnw" frameborder="0" allowfullscreen></iframe>
+    <iframe width="560" height="315" title="Material Design" src="//www.youtube.com/embed/Q8TXgCzxEnw" frameborder="0" allowfullscreen></iframe>
   </md-content>
 
 <!--   <md-content style="position: absolute; bottom: 10px;"> -->

diff --git a/docs/config/template/index.template.html b/docs/config/template/index.template.html
@@ -1,5 +1,5 @@
 <!doctype html>
-<html ng-app="docsApp" ng-controller="DocsCtrl">
+<html ng-app="docsApp" ng-controller="DocsCtrl" lang="en">
 <head>
 <title ng-bind="(menu.currentSection.name || 'Material Design') + (menu.currentPage ? (' > ' + (menu.currentPage | humanizeDoc)) : '')">Material Design</title>
 <meta name="viewport" content="initial-scale=1, maximum-scale=1" />
@@ -54,15 +54,15 @@ <h1 class="md-toolbar-tools" style="padding-top:25px;">
           <md-icon icon="img/icons/ic_menu_24px.svg">
           </md-icon>
         </button>
-        <h3 hide show-sm ng-if="menu.currentSection.name">
+        <p hide show-sm ng-if="menu.currentSection.name">
           {{menu.currentSection.name}}
-        </h3>
+        </p>
         <span layout="vertical" layout-align="center center" class="menu-separator-icon"
           ng-if="menu.currentPage">
           <img style="height: 16px;" src="img/docArrow.png" alt="" aria-hidden="true" hide block-sm>
         </span>
-        <h3 ng-bind="(menu.currentPage | humanizeDoc) || 'Angular Material'" flex>
-        </h3>
+        <h2 ng-bind="(menu.currentPage | humanizeDoc) || 'Angular Material'" flex>
+        </h2>
       </div>
 
       <div class="md-toolbar-tools api-options-bar"

diff --git a/src/components/card/demoBasicUsage/index.html b/src/components/card/demoBasicUsage/index.html
@@ -4,7 +4,7 @@
   <md-content>
 
     <md-card>
-      <img src="/img/washedout.png" class="md-card-image">
+      <img src="/img/washedout.png" class="md-card-image" alt="Washed Out">
       <h2>Paracosm</h2>
       <p>
         The titles of Washed Out's breakthrough song and the first single from Paracosm share the
@@ -13,7 +13,7 @@ <h2>Paracosm</h2>
     </md-card>
 
     <md-card>
-      <img src="/img/washedout.png" class="md-card-image">
+      <img src="/img/washedout.png" class="md-card-image" alt="Washed Out">
       <h2>Paracosm</h2>
       <p>
         The titles of Washed Out's breakthrough song and the first single from Paracosm share the
@@ -22,7 +22,7 @@ <h2>Paracosm</h2>
     </md-card>
 
     <md-card>
-      <img src="/img/washedout.png" class="md-card-image">
+      <img src="/img/washedout.png" class="md-card-image" alt="Washed Out">
       <h2>Paracosm</h2>
       <p>
         The titles of Washed Out's breakthrough song and the first single from Paracosm share the

diff --git a/src/components/tabs/demoDynamicTabs/index.html b/src/components/tabs/demoDynamicTabs/index.html
@@ -25,16 +25,16 @@
       </md-list>
 
       <md-divider flex></md-divider>
-      <div class="title" flex>Add Another Tab</div>
+      <h4 class="title" flex id="add-tab">Add Another Tab</h4>
 
-      <form ng-submit="addTab(tTitle,tContent)" flex>
+      <form ng-submit="addTab(tTitle,tContent)" aria-describedby="add-tab" flex>
         <div layout="horizontal">
           <span flex="15">Title:</span>
-          <input type="text" required ng-model="tTitle" placeholder="<tab label>">
+          <input type="text" required ng-model="tTitle" placeholder="<tab label>" aria-label="Title">
         </div>
         <div layout="horizontal">
           <span flex="15">Content:</span>
-          <input type="text" required ng-model="tContent" placeholder="<tab content>">
+          <input type="text" required ng-model="tContent" placeholder="<tab content>" aria-label="Content">
         </div>
         <md-button type="submit" class="md-button-colored">
            Add New Tab

diff --git a/src/components/tabs/demoPagination/index.html b/src/components/tabs/demoPagination/index.html
@@ -89,8 +89,8 @@
 
     <div layout="vertical" layout-padding style="margin-top: 10px;">
         <md-input-group>
-            <label>SelectedIndex</label>
-            <input type="number" ng-model="data.selectedIndex">
+            <label for="selected-index">SelectedIndex</label>
+            <input type="number" id="selected-index" ng-model="data.selectedIndex">
         </md-input-group>
 
         <md-checkbox ng-model="data.locked" aria-label="Disabled">

diff --git a/src/components/toolbar/demoScrollShrink/index.html b/src/components/toolbar/demoScrollShrink/index.html
@@ -15,7 +15,7 @@ <h3>
       <md-item ng-repeat="item in todos">
         <md-item-content>
           <div class="md-tile-left">
-            <img ng-src="{{item.face}}" class="face">
+            <img ng-src="{{item.face}}" alt="{{item.who}}" class="face">
           </div>
           <div class="md-tile-content">
             <h3>{{item.what}}</h3>