NFT preview card component using Flexbox - SECOND ATTEMPT

Community feedback

• 

  Douo•940

  @DouooPosted about 2 years ago

  Congrats on finishing the project Mario, a couple of things I suggest you do are:

  1. Use div instead of section for the card. Its always better to use div to contain or group your components. I see that you used <section> to wrap-up your card content which is not recommended. Use section when you want a generic standalone section of a document, which doesn't have a more specific semantic element to represent it. you can find more info about the use of <section> here

  Recommended version would look something like this

  <div class="card">
   <img class="card-img"...>
    <div class="card -content">
     ...
   </div>
  </div
  

  2. Its always best practice to give a descriptive alternate text for your html img elements as its the fallback when the image doesn't render properly
  3. Instead of using <span> for the profile name, I suggest you use <a> tag as its a link. That's it from me! Aside from these issues, I saw that the hover state on the profile name are not active. You've done good visually but you could do much much better to improve your code. Keep up the good work 👍

  Marked as helpful

  0

  ---

  

  Mario Cesena•70

  @mariocc22Posted about 2 years ago

  @Douoo Thank you so much for the great feedback!! I'll work on that and yeah I just realized that I uploaded an older version. I'll re-submit it.

  0

  

  Mario Cesena•70

  @mariocc22Posted about 2 years ago

  @Douoo Hi Douo! I followed your suggestions, do you mind take a look to this final version? I would like to know what I need to improve. Thanks!

  0

  

  Douo•940

  @DouooPosted about 2 years ago

  @mariocc22 Its much better than the first one, really good. Though I suggest you use a div instead of <ul> to list the price tag and remaining day. But I see improved code. Nice work

  Marked as helpful

  0