NFT preview card using css Grid | Flexbox

Community feedback

• 

  PhoenixDev22•16,950

  @PhoenixDev22Posted almost 3 years ago

  Hello @AmiraBenguega,

  I have some suggestions regarding your solution:

  • it's invalid html to wrap a heading element in an anchor tag. Swap those around so the anchor is inside the heading <h1><a href="#">Equilibrium #3429</a></h1>.

  • For any decorative images, each img tag should have empty alt="" and aria-hidden="true" attributes to make all web assistive technologies such as screen reader ignore those images( alt="icon-ethereum" , alt="icon-clock", alt="icon-view).

  • the icon-view doesn't really need to be in the html, you could do it with css. If you want it to stay in html it needs to be aria-hidden or role presentation with empty alt.

  • You can read more about alt text

  • the link should be wrapping the original image and either have Sr-only text, an aria-label or alt text that says where that link takes you.

  • never use span for meaningful content.

  • You can use an unordered list<ul> class="flex `and in each <li>, there would be <img> and<p>.

  Hopefully this feedback helps.

  Marked as helpful

  1