Design comparison
Solution retrospective
Same as always, i am proud and happy of not stopping halfway, i got it completed within few hours.
What challenges did you encounter, and how did you overcome them?The only challenge i encountered was when i had to decide to either use a button tag and then nesting an anchor tag inside the button for the links or using an anchor tag directly and styling it to look like the button.
What specific areas of your project would you like help with?The part where they said we should ensure users can navigate the links using a keyboard, i need some clarity on that and how to go about it, although when i am chanced proper google search and a conversation with claude or chatgpt will give some insight which i will intime.
Community feedback
- @marliedevPosted 26 days ago
Nice Job Allison. Code structure (HTML and CSS) is readable and looks clear and good. Maybe i wouldn't use a h2 for the location info.
Regarding your question to the keyboard optimisation: You used anchor tags which is the best options. They don't need a aria-role or tabindex attribute. Navigation and highlighting (:focus, :focus-visible) works fine with these. You should have added a target:"_blank" attribute to the anchor-links. This is just a usability optimization.
What you could have added is a screenreader optimisation in form of a "screenreader-only"-info that tells blind people a bit more about what will happen when they use the links.
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