QR code component using HTML CSS

Please log in to post a comment
Log in with GitHubCommunity feedback
- @Oluwalolope
Hello 👋, Great attempt at the challenge. I know you didn't ask for feedback but nevertheless I have some suggestions for you😄.
-
It is not advisable to leave the "alt" empty: The "alt" helps to give the search engine a description about what the image is all about. It should describe what the image is about. In your code I noticed you wrote this
<img src="/images/image-qr-code.png" alt="">
but I suggest you write something like this instead<img src="/images/image-qr-code.png" alt="QR Code that takes you to frontend mentor.io when scanned">
-
Use Header tags instead of assigning a class to a paragraph tag: I noticed that in your code you used
<p class="p"> Improve your front-end skills by building projects</p>
. Instead use a h1 tag like this:<h1> Improve your front-end skills by building projects</h1>
. This is considered best practice because the header tags are specifically used for headings. We mainly assign a class to a p-tag when we have multiple paragraphs in a website and we want to specifically style a paragraph. -
Using rems for font-sizing: A major drawback of using pixels for fonts is that it is too static. If a visually impaired person is trying to read your website they need to increase the font size in the browser's setting but that is where the problem is. That is where
rems
come in.rems
give the user power to control the font sizing and gives better user experience. By default 1px = 0.0625rem so you can do the calculations and input the rem value.
Once again Congratulations 🎊 on the challenge. I hope you found this helpful 😊🤝
Happy Coding👨💻😄
-
Join our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord