3 column preview card component - HTML/Grid/Sass/Parcel

Community feedback

• 

  Vanza Setia•27,715

  @vanzasetia

  Posted over 3 years ago

  Greetings, Darrick! 👋

  Congratulations on finishing this challenge! 🎉

  Your solution looks great on my mobile view (both landscape and portrait) and desktop view. Well done! 👍

  I have some feedback on this solution:

  • Accessibility
    • Good job on using main and footer landmarks correctly! 👍
    • Every page should only contain one h1. In this case, you can have a visually hidden h1. However, change all the existing h1 to h2.
    • I think the Learn More button will navigate the user to another webpage. What do you think the button will do if the user clicks it?
    • For any decorative images, each img tag should have empty alt="" and aria-hidden="true" attributes to make all web assistive technologies such as screen reader ignore those images. In this case, all images are decorative only.
  • Styling
    • I would recommend adding some padding to the body element to prevent the card from touching the edge of the screen.
  • Best Practice (Recommended)
    • Remove the commented code. If another developer (it can be you in the future) wants to improve this solution, he/she might get confused about whether or not the commented code should be used or deleted.

  That's it! Hopefully, this is helpful! 😁

  14

  Marked as helpful