Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

NFT preview card component

Finney 3,030

@Finney06

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Feedbacks and corrections will be highly welcome.

Community feedback

Vanza Setia 27,855

@vanzasetia

Posted

Hi, Finney! 👋

Some recommendations from me.

  • Alternative text should not be hyphenated (like code).
  • I suggest leaving the alt="" empty for decorative images. In this case, all images except the avatar image are decorative images.
  • Remove the word picture any words that have the same meaning. It's one of the common mistakes that should be avoided when writing alternative text.
  • There should not be text in span and div alone whenever possible. Instead, wrap the text with a meaningful element like a paragraph element.
  • Wrap all elements that have interactivity with interactive elements like anchor tag.
  • Code your font size in rem, not pixels. This means the text size will be responsive if people want to adjust the size.

Hope you find this useful!

Marked as helpful

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord