P
Makc240305• 30
@Makc240305
Submitted
Marco Di Matteo
@Marcod01
All comments
- Marco Di Matteo• 50
@Marcod01
Posted
The solution correctly uses semantic html with tags like <header>, <main>, and <section>, which help structure the content properly and improve accessibility. The image's alt attribute could be more descriptive to help users understand what should go there just in case the image doesn't display. The code is well-organized and easy to read, making it reusable for other projects. Overall, the solution closely matches the design.
Marked as helpful
1 What are you most proud of, and what would you do differently next time?
Happy to have completed it. Next time I will not try to overthink my approach
What challenges did you encounter, and how did you overcome them?
Getting the fonts to resize properly with media queries when the screen shrinks
What specific areas of your project would you like help with?
Any help on the best way to approach responsiveness would be appreciated
Marco Di Matteo• 50@Marcod01
Posted
This code doesn’t use semantic HTML. It could use more descriptive tags like <article> or <section>. Adding alt attributes to images is important as well. The design might not look good on all screen sizes, so testing and using CSS Grid or Flexbox could help. The code is easy to read and well-organized, but separating CSS into its own file and making sure it matches the design would make it easier to maintain and look more polished.
0- ardaacikgoz• 20
@ardaacikgoz
Submitted
What are you most proud of, and what would you do differently next time?
I have forgotten after not studying for a while, but after some time I understand what to do and which part to manipulate. Then I have revised the code but sometimes I had to ask to ChatGPT which is I am not proud of. I will try to check less ChatGPT and check the Internet more by manually in the next time.
What challenges did you encounter, and how did you overcome them?
I didnt understand this display:flex display: float etc. when learning for the first time and still dont understand fully, that is why I used ChatGPT at some point.
What specific areas of your project would you like help with?
Did I use divs correctly? Did I use CSS codes next to the body directly correctly? Should I have used these CSS codes by opening style?
Marco Di Matteo• 50@Marcod01
Posted
Your use of the <div> element is pretty good for wrapping the QR code and text together. The class name attribution works, but you could try naming it something like qr-container to make it clearer what the <div> is for, especially if the project gets bigger.
As for the CSS you've put directly in the <body>, it does the job, but it’s better to move those styles to a separate CSS file or at least into the . This makes your code cleaner and easier to update later if you need to make changes. Overall, your combination of inline and embedded CSS works, but separating your styles from the HTML will help in the long run. You've done a good job centering everything with Flexbox, and the QR code with the text looks well-balanced.
In summary, your code is functional, but moving styles out of the body tag and organizing them better would be a nice improvement.
0
