Design comparison
Solution retrospective
This was an amazing challenge to do, and try to improve my skills. I would to get some feedback from you and advice on what to improve.
Community feedback
- @MelvinAguilarPosted almost 2 years ago
Hello there ๐. Good job on completing the challenge !
I have some suggestions about your code that might interest you.
- The element
<div class="navigation-menu">
should be a landmark:<header>
, and should be outside of the <main> tag.
- A logo is not considered a decoration in HTML because it is often a crucial part of a website's branding and identity, use company name as the alt attribute value for logos.
- Use the
aria-label
attribute to describe the purpose of links without text. This attribute provides a description of the link for screen reader users, ensuring that they understand the purpose of the link. e.g.:<a href="index.html" aria-label="Facebook"><svg .../></a>
- On a 320px wide device, the last link with the text "Get Started For Free" overflows completely.
- The best way to code a navigation (
.more-details
) is to use an unordered list (<ul>
) inside a navigation (<nav>
), this provides additional semantics for the group of links, indicating that it is a navigation section.
I hope you find it useful! ๐
Happy coding!
Marked as helpful1@Disney-BanjePosted over 1 year ago@MelvinAguilar thanks a lot for the help and advice on improving my code.
I was hoping you could review the changes I made.
I had some issues with making the header background the same as the one for the hero page, I went on using the position property but it seems it does interfere with other elements could give me some tips on what to improve with the current solution on the test-branch
0 - The element
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