Skip to content
Submitted over 2 years ago

QR Code Component made with HTML, CSS

Sarah Kwon•60
@sarahkwon
A solution to the QR code component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Does my code follow best practices? What could I improve on?

Code

Please log in to post a comment

Log in

Community feedback

  • Phenics13•60
    @Phenics13

    Hi! I viewed your code and I have a couple of suggestions for best practices.

    • You should wrap all your content in main tag after body tag. It is for SEO purposes.
    <body>
	<main>...</main>
</body>
    • Wrap image with container with fixed dimensions or set image to fixed dimensions (width, height). It prevents page's content from "jumping" when you load site with poor internet speed. To test it, if you use Chrome, open dev tools, go to Network, and pick network type: slow 3G.
    • header tag is used to contain navigation panel of a site. It is not appropriate to use it in content of the site. Read more abour semantic tags and how to use them.

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