Product preview card component - Mobile first

Community feedback

• 

  Salah Al-Din Kaki•140

  @FilostkanaPosted about 1 month ago

  Hi Damir you've done a very nice Job over there. There is some notes to make it even better::

  • *Semantic HTML: considering to use much more semantic HTML elements like <main>, <article>.. ect instead of just using row divs, it's which they good for accessibility and SEO.

  • using picture tag: I like the way that you handled the pictures switch, but you can do the same by using <picture>

  <picture class="product__img">
            <source
              srcset="/assets/images/image-product-desktop.jpg"
              media="(min-width:600px)"
            />
            <img
              src="/assets/images/image-product-mobile.jpg"
              alt="Gabrielle Essence perfume bottle flat on a table with green leaves above an below"
            />
  

  0

  ---

  

  Damir Ademi•250

  @DamirBytePosted about 1 month ago

  @Filostkana Thank you for advice , I'll give it a try

  0