Advice Generator in HTML, CSS and JS

Community feedback

• 

  Danilo Blas•6,300

  @Sdann26Posted over 2 years ago

  Hi Dear!

  The project is fine, it just has some minor details to improve.

  In your error report for example you should change this <button onclick="getQuote()"> to <button onclick="getQuote() aria-label='Change to advice' ">, here you are adding the aria-label attribute because you are adding an image (icon) to the button and not text which generates this error.

  In addition you must always add the alt="" attribute in the images, in case it is a significant image you put text in the alt attribute and in case it is a decorative image you add alt="" together with the attribute aria-hidden="true" which means that the screen reader will not give importance to this element.

  As you have seen I have used us elements with ARIA attributes, I recommend you to look for information about them because they add accessibility to the web and it is very important for front-end developers to add them to our projects.

  Something else your project is missing a title h1 you could change <div class="title">ADVICE #193</div> to <h1 class="title">ADVICE #193</h1>.

  As soon as you make these changes, update your report so that no errors occur.

  Good Coding!

  Marked as helpful

  0

  ---

  

  P

  W.D. Snoeijer•130

  @dsnoeijerPosted over 2 years ago

  @Sdann26 Thank you for your comment. I've made the changes you suggested.

  I indeed forgot about the alt tags, probably because it was a challenge and not a real site. I'll look more into the aria-labels, thanks for the advice!

  0