@shivaprakash-sudo
Posted
Hello Andrea,
Congrats on finishing the challenge!
I like what you did with the h1 element's font size for smaller screens.
Few suggestions:
- This one is for everyone actually, which is about the Advice API caching the data. This makes the app not work on Firefox and also making advice delays in other browsers. All you need to do to overcome this is to put
{ cache: "no-cache" }as the second argument infetchstatement. - For the initial advice, you can use
window.onloadfunction to call the advice API when the user comes to the website. - For the
advice-textandid-advice, you don't need to usespanelements, you can directly use those for the parent elements themselves. - Try to put
alt=""for images, for accessibility reasons. - Here we don't need to use
pictureas we only have one source, you can use it when there are multiple sources. - Finally, try to wrap the content inside the body in
mainfor accessibility reasons.
Happy coding and good luck on next projects.
@AndreaFifo
Posted
@shivaprakash-sudo Thanks mate, i will follow your suggestions. I used picture because actually there are 2 images of the svg above the bottom, the desktop one and the mobile one, so this is why i used it.
@shivaprakash-sudo
Posted
@AndreaFifo
I understand what you were trying to do, but picture is used when there are multiple sources (e.g. jpg, png, jpeg, etc.) for the same image, but here we have two different images.
@AndreaFifo
Posted
@shivaprakash-sudo So instead of picture, what can i use to do something similar?
@shivaprakash-sudo
Posted
@AndreaFifo
You can just put two image tags in a container and hide the bigger image for smaller screens and vice versa.
@AndreaFifo
Posted
@shivaprakash-sudo Ok thanks. Another thing, how can i contact you? Because i want to show you a project that i've done recently and i'd like to receive your opinion about.
@shivaprakash-sudo
Posted
@AndreaFifo
You can contact me on LinkedIn, the link is in my profile. If you want to show me your live site or code personally, then you can setup an online meeting in Zoom or Teams.
