3-Column Preview Card Solution using basic HTML and CSS

Community feedback

• 

  Muhammad Shajjar•1,100

  @muhammadshajjarPosted about 3 years ago

  Hi!

  Good job on completing your first challenge! Some feedback from me.

  • Your images should have alt attribute but for decorative images, you should leave alt as blank and use role=" presentation" or aria-hidden=" true" to make sure all screen readers ignore those images. In your case, I think all icons are decorative.
  • Don't need to specify fixed height or width to your boxes, let them shrink, grow as they needed, use padding instead, and max-width.
  • Only use one h1 for every page.
  • Your page should contain one main, always use HTML semantic markers to designate sections of the page as the header, main, footer etc.

  That's all hope it would help you.

  Marked as helpful

  0

  ---

  

  Israel Del Angel•160

  @mexwebdev21Posted about 3 years ago

  @muhammadshajjar thank you so much for your feedback, Muhammad. I honestly didn't know about the images part: role=" presentation" aria-hidden=" true"

  I've written it on a piece of paper and am keeping it on the corner of my laptop screen. Thank you.

  Cheers!

  0

  

  Muhammad Shajjar•1,100

  @muhammadshajjarPosted about 3 years ago

  @mexwebdev21 check out this it would help you, I also suggest reading @grace-snow comments, As the accessibility expert, she is regularly talking about accessibility which is actually very very important.

  0