@bccpadge
Posted
Hello @Ibukun450. Congratulations on completing this challenge!!!🎉
I have few tips you might be interested in to improve your solution.
When people view your website they want to know what the purposes of it and title is very important.
<title>Frontend Mentor | QR code component</title>
- Be sure to add
favicon.iowhich is located in the images folder of starter files you download to start this challenge. - The reason why the
imageis not showing is due image src path.
Updated the image src path is below and be sure to have alt for accessibility.
In future projects, decorative images need aria-hidden:true and the images will be ignored by screen readers.
<img src="image-qr-code.png" alt="qr code to FrontendMentor.io">
HTML 📃:
- HTML structure needs to be updated
<body>
<main>
/*All content goes here*/
</main>
</body>
- Every website should have a
h1 - You can change the
h3toh1
More info📚:
Don't wrap every element in a div> because it doesn't have any semantic meaning at all.
More info📚:
CSS 🎨:
The media query is unnecessary for this project and max-width: 25rem; makes it responsive. I recommend you use rem or em units because they scale better. Pixels are absolute unit and especially for font-size not a good practice.
More info📚:
You set the wrong color on the paragraph and can change it to this color: hsl(220, 15%, 55%);
- Be sure to add a fallback of
sans-serifif thefont-family:Outfitdoesn't load.
Hope you find this useful and don't hesitate to reach out to me if you have any questions
