Skip to content
OverviewSolutions
11
Comments
2
Gelcimar Moraes
@GelcimarMoraes

All comments

  • Gelcimar Moraes•150
    @GelcimarMoraesPosted about 2 years ago

    Hi, @amulyalovescoding Congratulations on finishing this project.

    I really liked the result of your project, but I have some tips that I think you will like:

    Accessibility

    1- Every page should have one main landmark <main>. So replace the div that wraps the whole content with <main> to improve the accessibility. click here

    2- All page content should be contained by landmarks, you can understand better by clicking here: click here

    Marked as helpful
    1
  • Gelcimar Moraes•150
    @GelcimarMoraesPosted about 2 years ago

    Hi, @hydrx Congratulations on finishing this project. 🎉🎊You have a great solution there!

    Here are my suggestions for you:

    1. Something you can do to improve the image that needs to switch between mobile desktop and use <picture> instead of <img> inside a div. For reasons of SEO difficulty and search engines like Google and b localization, it is not a good practice to import this product image with CSS as this will cause an image of the image in google. You can manage both as inside the <picture> tag and use the html to set when images should, configure the max-width device moved from the device (mobile/desktop) Here is a guide on how to use picture: w3schools

    1. The element embed must not appear as a descendant of the button element.

    I would build the button like this:

    <button class="btn"><img src="images/icon-cart.svg" width="25" height="15" alt="shopping cart icon">Add to Cart</button> w3schools

    ✌️ I hope this helps you and happy coding!

    Marked as helpful
    1