pure css and html

Community feedback

• 

  Adriano•38,330

  @AdrianoEscarabotePosted about 1 month ago

  Hi Hadar Shoshan, how are you doing? I really loved the outcome of your project, but I have a few suggestions that I think might be helpful:

  Using only <div> to structure your code, as in the example below, can be problematic for both accessibility and HTML semantics. While div elements are generic containers, they don’t provide meaning to the content. This can make it harder for screen readers and accessibility tools to understand and present the content correctly.

  Example with semantic tags:

  <div class="container">
    <main>
      <figure class="image-container">
        <img class="nft-img" src="images/image-equilibrium.jpg" alt="NFT artwork" />
        <figcaption class="eye-image-container">
          <img class="eye-img" src="images/icon-view.svg" alt="Enlarge the image" />
        </figcaption>
      </figure>
      
      <h1 class="nft-name">
        Equilibrium #3429
      </h1>
  
      <p class="nft-text">
        Our Equilibrium collection promotes balance and calm.
      </p>
  
      <section class="sale-data-container">
        <div class="price icon-and-text">
          <img src="images/icon-ethereum.svg" alt="Ethereum">
          0.041 ETH
        </div>
        <time class="time icon-and-text" datetime="P3D">
          <img src="images/icon-clock.svg" alt="Clock">
          3 days left
        </time>
      </section>
    </main>
    
    <footer>
      <hr class="divider" />
      <div class="icon-and-text">
        <img class="avatar" src="images/image-avatar.png" alt="Avatar of Jules Wyvern">
        <p class="created-by">Creation of</p>
        <address class="creator">Jules Wyvern</address>
      </div>
    </footer>
  </div>
  

  The rest is excellent.

  I hope you find it useful. 👍

  0