NFT preview card component

Community feedback

• 

  Adriano•38,080

  @AdrianoEscarabotePosted about 2 years ago

  Hi Dilhan Boca, how are you?

  I really liked the result of your project, but I have some tips that I think you will enjoy:

  • images must have alt text unless it is a decorative image, for any decorative image each IMG tag must have empty alt="" and add aria-hidden="true" attributes to make all the assistive technologies of the Web, as screen reader. Learn the differences between decorative/meaningless images vs important content.
  • Consider using rem for font size .If your web content font sizes are set in absolute units, such as pixels, the user will not be able to re-size the text or control the font size based on their needs. Relative units “stretch” according to the screen size and/or user’s preferred font size, and work on a large range of devices.

  The rest is great!

  I hope it helps... 👍

  0
• 

  バレンタイン 😈•64,190

  @VCaramesPosted about 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  • The NFT Alt Tag description needs to be improved upon. You want to describe what the image is; they need to be readable. Assume you’re describing the image/icon to someone.

  • Along with the blank alt tag, you also want to include the aria-hidden=“true” to your icons to fully remove it from assistive technology.

  • The profile image Alt Tag needs to be improved. It should state the following; “Headshot of -person’s full name-“

  • You added the :hover effects as "active". It needs to be the other way around. So when the user's mouse hovers over, the different color shows.

  • Wrap the "NFT image" and "Equilibrium #3429" in an Anchor Tags <a>. The anchor tag will allow users to click on content and have them directed to another part of your site.

  • Your content is not fully responsive. Here is a link to Google Developer’s site that will teach you how make it 100% responsive:

  https://web.dev/learn/design/

  If you have any questions or need further clarification, let me know.

  Happy Coding! 👻🎃

  0