Fylo landing page with two column using BEM, SASS and Parcel

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted over 2 years ago

  Hello there, @Otavio-Cipriano! 👋

  I recommend wrapping the nav element with header (landmark) element and making the navbar__links element as a list element because if the site has no styling (like a document), it will make sense to make it as a list.

  • Features
  • Team
  • Sign In

  In addition to that, it's best to write the HTML first without any styling so that you can decide the HTML markup easier. You can think of it like when writing a document file (e.g. think of a heading as a title, etc).

  All illustrations are decorative images so I recommend leaving the alt empty. This way, the screen reader users won't have to listen to the unnecessary page content.

  The logo of the site is a way for a screen reader user or a search engine to know what your site/project is called. Currently, the site name is "Logo". So, I would suggest using the company name as the alternative text of the logo and removing the aria-label that wraps the logo. Don't worry the alternative text of the image would be the text content for the link.

  Also, since it's also a text content for the link, I recommend adding the navigation hint as well. So, the alternative text would be "Fylo - Home". It's great because it's telling the users that they are on the Fylo site and it's also a link that will navigate them to the home page.

  Always specify the type of the button. It's going to prevent the button from behaving unexpectedly.

  For the curve SVG, I recommend making them as background images instead.

  Good job on labeling the social media links! 👍

  That's it! Happy coding! 😁

  1
• 

  Kamasah-Dickson•5,590

  @Kamasah-DicksonPosted over 2 years ago

  Your solution looks so great and very close to your design and responsive on smaller devices and well. Good job there👍 Happy coding👍💻

  1