Design comparison
Solution retrospective
This was the first time I used Tailwind to complete a project. The main block was learning the Syntax but with the docs there I eventually got it.
Community feedback
- @caarlosdamianPosted over 1 year ago
Congratulations on completing the challenge! 🎉 I have some recommendations for your code that I think you will find useful.
First, let's talk about HTML 🏷. Your solution currently generates accessibility error reports, and one of the issues is that "All page content should be contained by landmarks" due to non-semantic markup. To improve the accessibility and organization of your page, I suggest wrapping the entire content (which includes multiple section elements) with the semantic element
<main>
in yourindex.html
file.You may be wondering, what is meant by a landmark? Landmarks are used to define major sections of your page instead of relying on generic elements like
<div>
or<span>
. They convey the structure of your page. For example, the<main>
element should include all content directly related to the page's main idea, so there should only be one per page.You can check more info about landmarks in the next link landmarks
I hope you find this helpful 😊 Your solution is great, and I wish you all the best in your coding journey!
Happy coding! 🚀
1@J-Manuel-NZPosted over 1 year agoThank-you for the insight! Ill change the code now and make sure to remember it in the future! @caarlosdamian
0 - @dawkey95Posted over 1 year ago
Nice solution man. The tailwind looks like it is worth giving a go in my own projects.
1
Please log in to post a comment
Log in with GitHubJoin 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