Validate HTML.

web/index.html

@@ -3,8 +3,6 @@
 <title> Badge Service </title>
 <meta name='viewport' content='width=device-width,initial-scale=1'>
 <link href='http://fonts.googleapis.com/css?family=Vollkorn' rel='stylesheet'>
-<h1> Badge Service For You! </h1>
-
 <style>
 :root { text-align: center; font-family: Linux Libertine O, Vollkorn, serif; }
 code, input { padding: 0 4px; border: 1px solid grey; background: #eef; border-radius: 4px; }
@@ -20,6 +18,8 @@ <h1> Badge Service For You! </h1>
 h2 { font-variant: small-caps; }
 </style>
 
+<h1> Badge Service For You! </h1>
+
 <hr/>
 <form action='javascript:makeImage()' id='imageMaker'>
   <input name='subject' placeholder='subject'/>
@@ -31,8 +31,8 @@ <h1> Badge Service For You! </h1>
 
 <h2> GitHub Badges </h2>
 
-<img src='/:badge-on!-brightgreen.svg'>
-<img src='/:license-CC0-red.svg'>
+<img src='/:badge-on!-brightgreen.svg' alt='Badge on!'/>
+<img src='/:license-CC0-red.svg' alt='License: CC0'/>
 
 <p>
 Ever wanted to have your own GitHub badges? <br/>
@@ -43,15 +43,15 @@ <h2> GitHub Badges </h2>
 Maybe you fancy a format that uses less than half the bandwidth.
 </p>
 
-<img src='/:happy-hacking%20%E2%98%BA-yellow.svg'>
+<img src='/:happy-hacking%20%E2%98%BA-yellow.svg' alt='Happy hacking!'/>
 
 <p>
 As for me, I wanted a format that people can reuse and hack on. <br/>
 I wanted a service for everyone. <br/>
 I made the GitHub Badge Service.
 </p>
 
-<img src='/:download-.5K-blue.svg'>
+<img src='/:download-.5K-blue.svg' alt='Download: .5K'/>
 
 <p>
 Here's how it works. <br/>
@@ -62,29 +62,29 @@ <h2> GitHub Badges </h2>
 </p>
 
 <p> Colors: </p>
-<img src='/:color-brightgreen-brightgreen.svg'>
-<img src='/:color-green-green.svg'>
-<img src='/:color-yellowgreen-yellowgreen.svg'>
-<img src='/:color-yellow-yellow.svg'>
-<img src='/:color-orange-orange.svg'>
-<img src='/:color-red-red.svg'>
-<img src='/:color-lightgrey-lightgrey.svg'>
-<img src='/:color-blue-blue.svg'>
-<img src='/:color-ff69b4-ff69b4.svg'>
+<img src='/:color-brightgreen-brightgreen.svg' alt='brightgreen'/>
+<img src='/:color-green-green.svg' alt='green'/>
+<img src='/:color-yellowgreen-yellowgreen.svg' alt='yellowgreen'/>
+<img src='/:color-yellow-yellow.svg' alt='yellow'/>
+<img src='/:color-orange-orange.svg' alt='orange'/>
+<img src='/:color-red-red.svg' alt='red'/>
+<img src='/:color-lightgrey-lightgrey.svg' alt='lightgrey'/>
+<img src='/:color-blue-blue.svg' alt='blue'/>
+<img src='/:color-ff69b4-ff69b4.svg' alt='ff69b4'/>
 
 <h2> Supported Services </h2>
 
 <table><tbody>
   <tr><th> Travis: </th>
-  <td><img src='/travis/joyent/node.svg'></td>
+  <td><img src='/travis/joyent/node.svg' alt='Travis-CI'/></td>
   <td><code>http://gh-badges.herokuapp.com/travis/joyent/node.svg</code></td>
   </tr>
   <tr><th> Coveralls: </th>
-  <td><img src='/coveralls/jekyll/jekyll.svg'></td>
+  <td><img src='/coveralls/jekyll/jekyll.svg' alt='Coveralls'/></td>
   <td><code>http://gh-badges.herokuapp.com/coveralls/jekyll/jekyll.svg</code></td>
   </tr>
   <tr><th> Gittip: </th>
-  <td><img src='/gittip/JSFiddle.svg'></td>
+  <td><img src='/gittip/JSFiddle.svg' alt='Gittip'/></td>
   <td><code>http://gh-badges.herokuapp.com/gittip/JSFiddle.svg</code></td>
   </tr>
 </tbody></table>