@alberto-rj
Posted
Hi, @grifano! Congratulations on investing your time and leveling up with the challenge, QR code component.
I have some code suggestions about Accessibility that can help you improve your solution to this challenge.
You have Low-contrast text on the footer and card
Low-contrast text is difficult or impossible for many users to read. This tool can help you solve this problem.
Do not use the aria-label attribute for non-interactive elements
The aria-label attribute defines a string value that labels an interactive element.
Learn more here
For the footer of the page, you could use the footer tag because it express this semantic meaning. Learn more here
👎 Don't
<div aria-label="attribution" class="attribution">
Challenge by
<a href="https://www.frontendmentor.io?ref=challenge" target="_blank">
Frontend Mentor </a>.
Coded by <a href="https://www.grifano.com">Serhii Orlenko</a>.
</div>
👍 Do
<footer class="attribution">
<p>
Challenge by
<a href="https://www.frontendmentor.io?ref=challenge" target="_blank">
Frontend Mentor </a>.
Coded by <a href="https://www.grifano.com">Serhii Orlenko</a>.
</p>
</footer>
So, @grifano, these are my code suggestions about Accessibility for your solution. I sincerely hope they can help you in some way.
Keep learning, coding and sharing! 🌟
Happy coding! 🚀
Marked as helpful
@grifano
Posted
@alberto-rj Hi Alberto, this is wonderful feedback! I've adjusted my code, and it looks great now. Thank you 😊
