@pascall-de-creator
Posted
Hi @Cybertechzen,
Good job with your QR code component. it is awesome :).
I have some Tips to help solve your CARD SIZE and ACCESSIBILITY ISSUES
-
The center element is not compatible with all browsers try using flex and setting the align-items and justify-content to center.
-
Do not use /images/image-qr-code.png as image link use ./images/image-qr-code.png and set image alt
-
use h1 tag in webpage once
-
use the main tag or set card landmark role="main" and set<div id="box"> role="footer" or replace with footer tag
-
Consider redesigning the component in figma or XD to get the sizes more accurate.
-
Use rem units for margins instead and set the root font-size to a rounded number like 10px to make conversion easier.
-
Add Main tag after body as your card element or use the role attribute and set it to main
-
Use h1 tag as the first text element in your card but use only once
you can view my project: https://www.frontendmentor.io/solutions/frontend-profile-qr-code-component-website-k6U3ZnZjn
Keep up the good work!
Marked as helpful
