Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

fylo-landing-page-with-two-column-master

@sohailmahmoud17

Desktop design screenshot for the Fylo landing page with two column layout coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


If you have a better idea to improve the solution, please be free to mention it in the comments below

Community feedback

@VCarames

Posted

Hey there! 👋 Here are some suggestions to help improve your code:

  • The navigation list in the header should be wrapped inside a nav element.
  • The headings in your component are being used incorrectly❌ . Since the h1 heading can only be used once, it is always given to the heading with the highest level of importance. Which in this case would be "All your files in one secure location, accessible anywhere". The rest of the headings would be h2, since it is reusable and it will give each heading the same level of importance.
  • Your email input and button needs to be wrapped inside a form and have a visibly hidden label attached to it for improved accessibility. And the "buttons" should be button not anchor.

More Info:📚

MDN Email Input

  • For the testimonial, it is best to to wrap the testimonial component in a figure element, the individual’s information should be wrapped in a figcaption element and lastly, the testimonial itself should be wrapped in a blockquote element.

Code:

<figure>
	<blockquote></blockquote>
 	<figcaption></figcaption>
</figure>

More Info:📚

MDN Figure Element

  • The company info inside the footer needs to be wrapped inside an address element. While each individual information needs to wrapped in an anchor element.

More Info:📚

MDN Address Element

  • The company directory needs to wrapped in a nav element and be a single list, not two. You will use the CSS property column to style it. Each individual link needs to wrapped in an anchor element.

More Info:📚

MDN <ul>: The Unordered List element

If you have any questions or need further clarification, feel free to reach out to me.

Happy Coding!🎄🎁

0

Please log in to post a comment

Log in with GitHub
Discord logo

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