Design comparison
SolutionDesign
Solution retrospective
Feedback is appreciated....
Community feedback
- @fernandolapazPosted over 1 year ago
Hi π, some of this may interest you:
HTML | ACCESSIBILITY:
- The icons are decorative images and the way to set an SVG image as decorative is by using the
aria-hidden='true'
attribute.
- Remember that
<button>
should be used for any interaction that performs an action on the current page and<a>
should be used for any interaction that navigates to another view. It seems that links are more appropriate in this case.
CSS:
- The trick of setting the
font size: 62.5%;
is no longer commonly recommended because it can cause issues with accessibility and readability.
- To center the page content you should change
max-height: 100vh
tomin-height: 100vh;
for the body.
- It might be good to get used to designing with the Mobile first approach, which means designing for mobile first and then for desktop or any other device, as it is widely considered best practice.
Let me know if you want more info on any of these topics.
I hope itβs useful : )
Regards,
1 - The icons are decorative images and the way to set an SVG image as decorative is by using the
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