3-column preview card component

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted over 1 year ago

  Hi, Zachary Campanelli!

  A couple of suggestions:

  • Use CSS to uppercase the text. Screen readers might spell the uppercased word in the HTML (spelled letter by letter).
  • For the "Learn more" buttons, I would use link elements instead of button elements. If that is a real website, I think the users will get navigated to another page once they click one of those buttons.
  • The car icons are decorative images. Meaning, they don't contain useful information and if they don't exist the page still makes sense. So, I recommend leaving the alternative text so that screen reader users can skip those images.
  • Use native HTML elements. Use <main> instead of <div class="container" role="main">. You should follow the first rule of using ARIA, "If you can use a native HTML element [HTML51] or attribute with the semantics and behavior you require already built in, instead of re-purposing an element and adding an ARIA role, state or property to make it accessible, then do so." Reference: Using ARIA #rule1

  I hope this helps.

  0