Responsive Huddle landing page with alternating feature blocks
Design comparison
Solution retrospective
Junior Frontend Mentor Challenge(huddle-landing-page-with-alternating-feature) take some time to complete. But I am happy to achieve this mile stone. Thanks you.
Any feedback will be appreciated. Specially @AdrianoEscarabote and @catherineisonline
Community feedback
- @VCaramesPosted almost 2 years ago
👾 Hey there! 👋 Here are some suggestions to help improve your code: 👾
- There is still some work needed for the styling to better match the FEM design;
padding
,font-size
, etc…
- The
header
element should be outside themain
element.
- The
alt tag
description in the logo needs to be improved upon. The description should state the company’s name
- The illustrations/icons serve no other purpose than to be decorative. Their
alt tag
should left blank and have anaria-hidden=“true”
to hide them from assistive technology.
More Info:📚
https://www.w3.org/WAI/tutorials/images/
- The
article
element is being used incorrectly and not needed since nothing in this site can be independently distributed.
- The company info inside the
footer
needs to be wrapped inside anaddress
element. While each individual information needs to wrapped in ananchor
element.
More Info:📚
- The company directory needs to wrapped in a
nav
element and be a single list, not two. You will use the CSS propertycolumn
to style it. Each individual link needs to wrapped in ananchor
element.
- Your CSS Reset is extremely bare and being underutilized. To fully maximize your CSS reset, you want to add more to it.
Here are few CSS Resets that you can look at and use to create your own or just copy and paste one that is already prebuilt.
If you have any questions or need further clarification, feel free to reach out to me.
Happy Coding!🎄🎁
Marked as helpful0@zahirpkPosted almost 2 years ago@vcarames Thank you, I am very Happy and waiting since a week, that someone give me tips and marks my mistakes, to improve future challenges. I shall be very thankful to you for giving me valuable suggestions. I shall notes these points and used it in future FEM challenges.
1 - There is still some work needed for the styling to better match the FEM design;
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