Ahmed Bouhrira• 80
@Ahmed-Bouhrira
Submitted
P
codigoTin
@codigotin
All comments
Does the solution include semantic HTML?
Yes, you are using semantic code in HTML
Is it accessible, and what improvements could be made?
you could use more descriptive classes to apply the css.
Does the layout look good on a range of screen sizes?
No, it does not have responsive design, in the mobile version it is not shown with the original design.
Is the code well-structured, readable, and reusable?
Yes, the code could be reused
Does the solution differ considerably from the design?
It has some resemblance, there are still many details that could be improved.
0- jubileelin• 100
@jubileelin
Submitted
What are you most proud of, and what would you do differently next time?
I have seen a lot of improvement in my work pace. The last responsive design challenge took my a few days since I kept starting over. This one only took me a few hours to fully plan out and execute. I want to keep practicing responsive design, and also learn javascript soon.
Does the solution include semantic HTML? Yes, the HTML is well structured
Is it accessible, and what improvements could be made? There is a slight problem with the footer, but that is not part of the base design.
Does the layout look good on a range of screen sizes? The design is adaptable to different devices.
Is the code well-structured, readable, and reusable? The code is reusable
Does the solution differ considerably from the design? Very close to the original design, very good job on the design.
0 - Alexandru Stroe• 100
@alstrow
Submitted
Does the solution include semantic HTML?
Yes, it has good HTML.
Is it accessible and what improvements could be made?
Yes, all measurements are made with REM.
Does the design look good on different screen sizes?
In the mobile version there is a problem with the footer.
Is the code well structured, readable and reusable?
Yes, the code is great.
Does the solution differ considerably from the design?
It is very similar to the original design.
1 - faekhatami• 540
@faekhatami
Submitted
The size of the body is missing so that you can place the recipe container in the center. And the internal padding of the recipe should be slightly bigger. But overall the design is very good.
1 - Danae Lescano• 270
@Lescano713
Submitted
In general lines I see it well, but in terms of HTML semantics, the buttons should be used when they are internal links of the web, when it is an external link it is better to use to.
And as for design, you can improve, but otherwise I see it very well.
Marked as helpful
0 - Pjuliusalberto• 220
@juliusalberto
Submitted
What are you most proud of, and what would you do differently next time?
I am most proud of the hover function. I haven't touched any html and css before, and yet it look so good!
What challenges did you encounter, and how did you overcome them?
Eh, nothing I guess. Thanks to Mr. Chad Gippity I am able to solve most of the problems. I think the hardest part of this is to determine the font size for desktop and phone screen.
How am I supposed to dynamically figure that out?? Turns out you can use clamp() or em, rem, or something like that.
What specific areas of your project would you like help with?
I'm not sure..
I would recommend you to visualize the design in Figma, there you can see the specific sizes, font and other elements. In general it is ok, but you can still improve a lot of things in the design.
0 What are you most proud of, and what would you do differently next time?
I replicated the view pretty accurately for the desktop view.
What challenges did you encounter, and how did you overcome them?
I found it hard to decide on when to use padding and when to use margin. I also found it difficult to decide whether to add an additional box for style purposes or not. For example, there are times that I could only figure out how to store my image in the center horizontally by adding a item around it.
What specific areas of your project would you like help with?
positioning items horizontally, best practice regarding positioning
Does the solution include semantic HTML?
No, it doesn't include semantic HTML. I would recommend reviewing this to improve your code.
Is it accessible, and what improvements could be made?
Yes, it is accessible. In terms of improvements, using REM instead of pixels could be beneficial.
Does the layout look good on a range of screen sizes?
Yes, it looks good on various screens.
Is the code well-structured, readable, and reusable?
It could be improved by using style sheets and variables.
Does the solution differ considerably from the design?
The design is very similar to the original, very well done.
0
