3 Columns Preview cars whit Flexbox

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted about 3 years ago

  👋Hi Johnnatan! I have some feedback on this solution:

  • One interesting thing, that I found was that your h1, I noticed that it had the same color as the background color. If you want to prevent the accessibility issue by putting a hidden heading, I recommend to search for "sr-only css class" to hide the h1.
  • 👍 Good job on leaving the alt="" empty for all decorative images. You may want to add aria-hidden="true" to prevent the VoiceOver screen reader pronounces those images.
  • You should never uppercased the text directly on the HTML, unless you want the screen reader the spell it letter by letter. I recommend to use CSS to do that.
  • For the .card-box__text, I recommend to use paragraph tag instead of a div. It's important to wrap the text with meaningful tag. Use span and div for styling only.
  • Use rem or sometimes em unit instead of px. Using px will not allow the user to control the size of your page.
  • Lastly, you should delete all the comment on the bottom of your CSS. Remember, development code is not live code.

  That's it! Hopefully this is helpful!

  Marked as helpful

  2

  ---

  

  Johnnatan•305

  @JohnnatanVPosted about 3 years ago

  @vanzasetia Thank you for the feedback i will take into account everything and make some changes also to improve my next proyect.

  I have one question. is really fine to leave the alt="" of a img empty? I read that a good practice is give a name to the image in that parameter.

  Again thank you very much.

  0

  

  Vanza Setia•27,775

  @vanzasetiaPosted about 3 years ago

  @JohnnatanV Yes, it is a good practice if the images are informative images.

  But, in this case, all the icons are just decorative images, which mean if the user doesn't see those icons, the user still can understand the content of the website. To learn more, you can read the W3C website about decorative images.

  Marked as helpful

  0