@Ahmed-Abdul-ghaffar
Posted
Hello there, great job on completing the challenge!
I have a few small suggestions that I believe could enhance the professionalism of your code:
- Semantic HTML: It's a good practice to use elements like <article> to wrap your content. This not only helps with semantics but also makes your code more meaningful and accessible. For example:
<body>
<div class="container">
<article class="qr-component">
<img
class="qr-component-img"
src="images/image-qr-code.png"
alt="qr code image"
/>
<h2 class="qr-component-title">
Improve your front-end<br />
skills by building projects
</h2>
<p class="qr-component-title-description">
Scan the QR code to visit Frontend<br />
Mentor and take your coding skills to<br />
the next level
</p>
</article>
</div>
</body>
- CSS Class Naming: In larger projects, it’s helpful to use clear and descriptive class names in your CSS. This makes your code easier to read and understand without constantly referencing the HTML. Here's an approach that can improve clarity:
.qr-component-img {
}
.qr-component-title {
}
.qr-component-title-description {
}
.qr-component {
}
That's all I have for now. I hope you find these suggestions helpful.
Keep up the great work and happy coding!
Marked as helpful
1
