@R3ygoski
Posted
Hello Eliana, congratulations on completing the project, it turned out quite interesting.
I had a question: did you intentionally place the image outside the card? If so, it adds an intriguing touch.
Since I'm not sure if it was intentional or not, I'll focus on giving HTML-related tips. I noticed your HTML is well-structured, but it lacks semantic markup, which is crucial for making your project more accessible and for SEO purposes. I'll suggest replacing some <div>
elements with semantic tags for you to consider:
<div class="container">
could be replaced with a<main>
tag, as it contains the main content of the page.<div class="recipe-img">
could be replaced with a<figure>
tag, as its content is just an image, and that image is the main focus.<div class="recipe-step">
could be replaced with a<section>
tag, as all the content within it is thematically related and dependent on the main content.
Regarding the instructions section, you've created a somewhat verbose structure that could be simplified using an <ol>
and <li>
, which would reduce the need for so many <div>
elements. You could then style the numbers using the ::marker
pseudo-element.
Here's a link about ::marker: W3School - Marker.
Once again, congratulations on the project and your creativity. I genuinely appreciate the deviation from the standard approach. Keep practicing and improving. If you have any questions, please ask below, and I'll do my best to help.
@ElianaRestrepo99
Posted
@R3ygoski Thank you very much for your advice, and for wanting to continue guiding me in my learning process. I did feel that I should improve some things and with this guide I already know which points I should practice more, in response to the question I did not put the image outside the card intentionally, but seeing that it gave a unique touch to the project. I decided to leave it there. . since I love giving a unique touch to each project I do.