Product Preview

Hi!

Congratulations on finishing this challenge✨

I have a suggestion about your code that might interest you 💡

📍You can use the <picture> tag when you have different versions of an image for different device scenarios

<picture>
  <source srcset="image-large.jpg" media="(min-width: 1200px)">
  <source srcset="image-medium.jpg" media="(min-width: 600px)">
  <img src="image-small.jpg" alt="Description">
</picture>

📍A recommended practice and it is important for SEO is to include the meta tag with the description

The <meta name="description"> element provides a summary of a page's content that search engines include in search results.

<meta name="description" content="Put your description here.">

• You can use Lighthouse, it is an automated tool to improve the performance, quality and correctness of your web applications.

📍Use appropriate semantic HTML tags to define the different sections of your page.

For the card it would be more appropriate to use the <article> tag, this is because:

• <div> is a generic tag for grouping elements. It has no specific semantic meaning.
• <article> represents independent and autonomous content, such as a news article, a blog post, a product or, precisely, a card.

Happy coding!