Merge pull request #340 from mewtaylor/issue/gh-337-accessibility

Fix issue GH-337: accessibility

src/components/intro/intro.jsx

@@ -64,10 +64,12 @@ var Intro = React.createClass({
                         <a className="sprite sprite-1" href="/projects/editor/?tip_bar=getStarted">
                             <img
                                 className="costume costume-1"
-                                src="//cdn.scratch.mit.edu/scratchr2/static/images/cat-a.png" />
+                                src="//cdn.scratch.mit.edu/scratchr2/static/images/cat-a.png"
+                                alt="Scratch Cat" />
                             <img
                                 className="costume costume-2"
-                                src="//cdn.scratch.mit.edu/scratchr2/static/images/cat-b.png" />
+                                src="//cdn.scratch.mit.edu/scratchr2/static/images/cat-b.png"
+                                alt="Scratch Cat" />
                             <div className="circle"></div>
                             <div className="text">
                                 {this.props.messages['intro.tryItOut']}
@@ -76,10 +78,12 @@ var Intro = React.createClass({
                         <a className="sprite sprite-2" href="/starter_projects/">
                             <img
                                 className="costume costume-1"
-                                src="//cdn.scratch.mit.edu/scratchr2/static/images/tera-a.png" />
+                                src="//cdn.scratch.mit.edu/scratchr2/static/images/tera-a.png"
+                                alt="Tera" />
                             <img
                                 className="costume costume-2"
-                                src="//cdn.scratch.mit.edu/scratchr2/static/images/tera-b.png" />
+                                src="//cdn.scratch.mit.edu/scratchr2/static/images/tera-b.png"
+                                alt="Tera" />
                             <div className="circle"></div>
                             <div className="text">
                                 {this.props.messages['intro.seeExamples']}
@@ -88,10 +92,12 @@ var Intro = React.createClass({
                         <a className="sprite sprite-3" href="#" onClick={this.handleJoinClick}>
                             <img
                                 className="costume costume-1"
-                                src="//cdn.scratch.mit.edu/scratchr2/static/images/gobo-a.png" />
+                                src="//cdn.scratch.mit.edu/scratchr2/static/images/gobo-a.png"
+                                alt="Gobo" />
                             <img
                                 className="costume costume-2"
-                                src="//cdn.scratch.mit.edu/scratchr2/static/images/gobo-b.png" />
+                                src="//cdn.scratch.mit.edu/scratchr2/static/images/gobo-b.png"
+                                alt="Gobo" />
                             <div className="circle"></div>
                             <div className="text">
                                 {this.props.messages['intro.joinScratch']}
@@ -122,7 +128,8 @@ var Intro = React.createClass({
                 </div>
                 <div className="video">
                     <div className="play-button" onClick={this.showVideo}></div>
-                    <img src="//cdn.scratch.mit.edu/scratchr2/static/images/hp-video-screenshot.png" />
+                    <img src="//cdn.scratch.mit.edu/scratchr2/static/images/hp-video-screenshot.png"
+                         alt="Intro Video" />
                 </div>
                 <Modal
                         className="video-modal"

src/views/about/about.jsx

@@ -39,7 +39,7 @@ var About = React.createClass({
                     <ul>
                         <li>
                             <h2><FormattedMessage id='about.whoUsesScratch' /></h2>
-                            <img src="/images/about/who-uses-scratch.jpg" />
+                            <img src="/images/about/who-uses-scratch.jpg" alt="" />
                             <p><FormattedHTMLMessage id='about.whoUsesScratchDescription' /></p>
                         </li>
 
@@ -56,25 +56,25 @@ var About = React.createClass({
 
                         <li>
                             <h2><FormattedMessage id='about.aroundTheWorld' /></h2>
-                            <img src="/images/about/around-the-world.png" />
+                            <img src="/images/about/around-the-world.png" alt="" />
                             <p><FormattedHTMLMessage id='about.aroundTheWorldDescription' /></p>
                         </li>
 
                         <li>
                             <h2><FormattedMessage id='about.schools' /></h2>
-                            <img src="/images/about/scratch-in-schools.jpg" />
+                            <img src="/images/about/scratch-in-schools.jpg" alt="" />
                             <p><FormattedHTMLMessage id='about.schoolsDescription' /></p>
                         </li>
 
                         <li>
                             <h2><FormattedMessage id='about.quotes' /></h2>
-                            <img src="/images/about/quotes.gif" />
+                            <img src="/images/about/quotes.gif" alt="Quotes about Scratch" />
                             <p><FormattedHTMLMessage id='about.quotesDescription' /></p>
                         </li>
 
                         <li>
                             <h2><FormattedMessage id='about.research' /></h2>
-                            <img src="/images/about/research-remix.png" />
+                            <img src="/images/about/research-remix.png" alt="" />
                             <p><FormattedHTMLMessage id='about.researchDescription' /></p>
                         </li>