update image alts

storybookjs · Jul 5, 2023 · f237b33 · f237b33
1 parent e7addea
commit f237b33
Showing 1 changed file with 10 additions and 10 deletions.
diff --git a/src/stories/Configure.mdx b/src/stories/Configure.mdx
@@ -75,7 +75,7 @@ import Theming from "./assets/theming.png";
 <div className="sb-section">
   <div className="sb-features-grid">
     <div className="sb-grid-item">
-      <img src={Docs} alt="Document" />
+      <img src={Docs} alt="A screenshot showing the autodocs tag being set, pointing a docs page being generated" />
       <h3 className="sb-section-item-heading">Autodocs</h3>
       <p className="sb-section-item-paragraph">Auto-generate living,
         interactive reference documentation from your components and stories.</p>
@@ -85,7 +85,7 @@ import Theming from "./assets/theming.png";
       >Learn more<span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Share} alt="Share" />
+      <img src={Share} alt="A browser window showing a Storybook being published to a chromatic.com URL" />
       <h3 className="sb-section-item-heading">Publish to Chromatic</h3>
       <p className="sb-section-item-paragraph">Publish your Storybook to review and collaborate with your entire team.</p>
       <a
@@ -94,7 +94,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={FigmaPlugin} alt="Figma Plugin" />
+      <img src={FigmaPlugin} alt="Windows showing the Storybook plugin in Figma" />
       <h3 className="sb-section-item-heading">Figma Plugin</h3>
       <p className="sb-section-item-paragraph">Embed your stories into Figma to cross-reference the design and live
         implementation in one place.</p>
@@ -104,7 +104,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Testing} alt="Testing" />
+      <img src={Testing} alt="Screenshot of tests passing and failing" />
       <h3 className="sb-section-item-heading">Testing</h3>
       <p className="sb-section-item-paragraph">Use stories to test a component in all its variations, no matter how
         complex.</p>
@@ -114,7 +114,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Accessibility} alt="Accessibility" />
+      <img src={Accessibility} alt="Screenshot of accessibility tests passing and failing" />
       <h3 className="sb-section-item-heading">Accessibility</h3>
       <p className="sb-section-item-paragraph">Automatically test your components for a11y issues as you develop.</p>
       <a
@@ -123,7 +123,7 @@ import Theming from "./assets/theming.png";
       >Learn more <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-grid-item">
-      <img src={Theming} alt="Theming" />
+      <img src={Theming} alt="Screenshot of Storybook in light and dark mode" />
       <h3 className="sb-section-item-heading">Theming</h3>
       <p className="sb-section-item-paragraph">Theme Storybook's UI to personalize it to your project.</p>
       <a
@@ -136,7 +136,7 @@ import Theming from "./assets/theming.png";
 
 <div className="sb-section sb-explore-grid">
     <div className="sb-section-item">
-      <img src={Github} alt="Github" className="sb-explore-image"/>
+      <img src={Github} alt="Github logo" className="sb-explore-image"/>
 
       Join our contributors building the future of UI development.
 
@@ -146,7 +146,7 @@ import Theming from "./assets/theming.png";
       >Star on GitHub <span className="sb-chevron">&#8250;</span></a>
     </div>
     <div className="sb-section-item">
-      <img src={Discord} alt="Discord" className="sb-explore-image"/>
+      <img src={Discord} alt="Discord logo" className="sb-explore-image"/>
       <div>
         Get support and chat with frontend developers.
 
@@ -157,7 +157,7 @@ import Theming from "./assets/theming.png";
       </div>
     </div>
     <div className="sb-section-item">
-      <img src={Youtube} alt="Youtube" className="sb-explore-image"/>
+      <img src={Youtube} alt="Youtube logo" className="sb-explore-image"/>
       <div>
         Watch tutorials, feature previews and interviews.
 
@@ -168,7 +168,7 @@ import Theming from "./assets/theming.png";
       </div>
     </div>
     <div className="sb-section-item">
-      <img src={Tutorials} alt="Tutorials" className="sb-explore-image"/>
+      <img src={Tutorials} alt="A book" className="sb-explore-image"/>
       <div>
         Follow guided walkthroughs on for key workflows.