Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

QR Code Component using HTML and CSS

Fareed 100

@hsfarid

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

I am proud that I was able to complete this project successfully. I learned a lot of things, including how to host web pages using github pages, how to use fireshot to take screenshots of pages, how to better write a markdown, and many others.

What challenges did you encounter, and how did you overcome them?

At first it was difficult getting the design right and I was missing some details because I was eager to complete it. But I had to relax and study the design very well, and eventually got it right.

What specific areas of your project would you like help with?

At the moment, I don't have any challenges.

Community feedback

Francesco 270

@FraCav99

Posted

Hi Fareed, congrats on completing this challenge!

Your solution is great, just one thing is to put a value inside the alt attribute.

Sometimes it's not necessary, if the image you're using is just decorative, like a logo or an icon, but in this case it's good to put one, just a brief one, like alt="qr code link" or something like that.

Also, don't use px units for font-size, but use rem. This because if the user will change the default font size from browser settings, the size of the font will always be the same, and it's not good for accessibility!

I'll share a useful blog post from Josh Comeau which explains the differences and how to build an inuition on which unit to use in any scenario.

It's useful for people with visual impairments which happen to use screen readers. Overall, good job and keep up the good work! :D

Marked as helpful

0

Fareed 100

@hsfarid

Posted

Hello Francesco, thank you very much for your feedback. I find your feedback very informative and useful, and I really appreciate it. I will make sure to put that to use in my future projects.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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