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 challenge solution

6xg0d 190

@6xg0d

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'm proud that i did it without too much help. I struggle a little bit at the beginning trying to write a good semantic HTML. Maybe not the best, but sure have a clear expression of the content meaning. If i should have to do the project again, i think i'll start by sketching the structure on paper instead of trying to do it mentally. It's way easier to figure it out and gain more understanding of the problem when you write it down.

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

The main problem to me was the semantic. After a while thinking if the semantic was good, i realize that the most important thing about semantics it's to make clear the meaning of content, and that there's more than just one "good way" to write semantic code.

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

I'd like to know how can i optimize my code. what can i do to improve my solution in terms of accesibility and good coding practices

Community feedback

@Bishalsnghd07

Posted

Hi, @6xg0d👋

Congrats for completing this challenge🎉 and you did a good job👏

In regarding to improve accessibility and best practices. There is a great tool in the browser that is called lighthouse testing tool. What you have to do is, you just have to right click on your web page, click on inspect option and then, you will see a lot of option and one of the option you will see that is lighthouse and just by clicking on it, you can test your performance of web page, best practices, accessibility, SEO and many more.

This tool will enhance developer proficiency in development and decrease workload and increase efficiency.

One, more thing I would like to recommend you to use this tool in every project to test your performance of web page. Make it a habit, it will help you in lot of things.

Hope, this small tip will help you in your further projects too!

Once again welcome to Frontend Mentor, wishing you a joyful journey ahead and Happy Coding❤️

Marked as helpful

1

@katbetancourt

Posted

Great start! Your code looks great to me. I was reading the way you used HTML tags and I even learned some new ways on how to organize my code. Once again, your code looks great to me, and even the screenshot it's perfect with the design.

A great resource that can help you improve your code practices is the following: https://developer.mozilla.org/es/

On this web you'll find documentation that'll help you a lot.

Marked as helpful

1

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