Design comparison
Solution retrospective
How to organize CSS attributes?
Community feedback
- @tobezhanabiPosted over 1 year ago
Hello there π. Congratulations on successfully completing the challenge! π
I have other recommendations regarding your code that I believe will be of great interest to you.
HTML π·οΈ:
This solution generates accessibility error reports due to non-semantic markup, which lack landmark for a webpage
So fix it by replacing the element <div class="box"> the with semantic element <main> along with <div class="attribution"> the with semantic element <footer> in your index.html file to improve accessibility and organization of your page.
What is landmark? They 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
Imageβ οΈ:
It is necessary that you master putting alt attribute into your img tags. This helps with Google crawler and screen reader, therefore increasing your site accessibility
I hope you find it helpful ! π Above all, the solution you submitted is great
Happy coding!
1 - @visualdennissPosted over 1 year ago
Hey there,
congrats on completing the challenge successfully! Your submission looks nice overall. It looks like you have a very bright value for the <p> text, which makes it hard to read then the background is also very bright. I would suggest using a darker font color so it has enough contrast with the background and improve readability.
Hope you find this feedback helpful!
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