Base Apparel coming soon page - Flexbox / JS DOM

Community feedback

• 

  Rebecca Padgett•1,840

  @bccpadgePosted 11 months ago

  Hello @aazs-edu. Congratulations on completing this challenge!!!🎉

  I have a few tips you might be interested in to improve your solution.

  HTML 📃:

  • To improve accessibility, wrap your code below in <form>

  <div class="email-input">
        <input type="email" placeholder="Email Address" />
        <img class="invalid-icon hide" src="images/icon-error.svg" alt="icon-error">
       <button id="submitBtn"><img src="images/icon-arrow.svg" alt="" /></button>
   </div>
     <div class="invalid-feedback hide">
        <p class="invalid-feedback-msg">Please provide a valid email</p>
     </div>
  

  The arrow and error icon are decorative which means you can leave alt attribute blank and add aria-hidden:true; so it can be ignored by screen readers.

  More info📚:

  • aria-hidden

  <div class="img-box">
        <img class="hero-desktop" src="images/hero-desktop.jpg" alt="hero" />
   </div>
  

  Mobile and hero images must have more descriptive alt text.

  Example:

  <img class="hero-desktop" src="images/hero-desktop.jpg" alt="a woman in orange shirt standing in front of a green tree and red wall" />
  

  Here is my solution to this challenge Base Apparel Coming Page

  Hope you find this useful and don't hesitate to reach out if you have any questions

  Marked as helpful

  3