Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Responsive Recipe Page Built Using React

P

@Achigyus

Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

P

@jamesbarnett

Posted

  • Does the code include semantic HTML? I would say so. Maybe an opportunity to change some divs to article/section tags. Minor.

  • Is it accessible, etc? Yes, good to see h tags and p tags and not everything a div. Nice work! On your alt text, you have "A picture of..". The W3 guidelines suggest avoiding words such as "picture/icon/image". See the "Superfluous information in the text alternative:" section in the link below:

https://www.w3.org/WAI/tutorials/images/tips/

  • Does the layout look good ... screens, etc.? Mismatch on top and bottom margin. That nitpick aside, looks fabulous, is nicely responsive down to very small screens.

  • Code well structured, etc? Yes, very clean, on both CSS side and React side. Well done!

  • Differ from design? Your accuracy recreating the design is really very good. Great work on the challenge!

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord