Design comparison
Solution retrospective
This was another fun little project and didn't have any issues while completing it. I also completed it two months ago, so the html and CSS might not be the best. I wanted to change a few things, but this is a good reminder of how far I've come.
In terms of the code, I think I could have added a couple more media queries, so it looked better in tablets or other devices. What do you all think?
Community feedback
- @Illyaas4ShowPosted over 2 years ago
This looks very nice! well done A few accessibility issues though
-
Document should have one main landmark- Your page should have one and only one<main>tag to help screens reader to navigate through the page. You can wrap the card element in a<main>tag. -
All page content should be contained by landmarks- Your page should have one and only one<footer>tag for the same reason. You can wrap the attribute element at the button in a<footer>tag. -
Page should contain a level-one heading- Your page should have one and only one<h1>tag for the same reason. I am not sure about that in this project as it has three main headings but what i did was make a h1 tag with a topic on it but made it indisplay: noneso that screen readers can use it to get the general idea of the page but it wouldn't affect the design. I am not sure if that is a good idea but I did it to avoid accessibility issues
I hope this was useful. If it was, pls mark it as helpful :)
happy coding!
0@placetenoPosted over 2 years ago@Illyaas4Show Thank you! Now the accessibility issues make a little more sense.
0 -
Please log in to post a comment
Log in with GitHub
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