Fylo landing page [create using grid & flexbox, mobile first]

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted almost 2 years ago

  Hi, Benley! 👋

  Don't worry too much about class names. I have been learning front-end development for two years and I am still struggling to come up with a good class name for every element. 😅

  Good job labeling the social media links! 👍

  Also, you are using the em unit for media queries. Great! 👏

  Here are some suggestions for improvements.

  • Add alternative text to the logo. Logo is an important content of the page. It is not decorative, and not the one with blank alternative text (alt=""). Without that information, a screen reader user or a search engine will not know what the site/project is called.
  • Import both font families with one <link rel="stylesheet">.
  • <button> element must always have type attribute to prevent unexpected behavior. Source: Checklist - The A11Y Project #use-the-button-element-for-buttons
  • <input> must have an accessible name. In this case, you can use aria-label to label the <input> since there is no visible label.
  • Learn about "accessible name" — What is an accessible name? - TPGi
  • I recommend removing all commented code. If other developers or yourself in the future work with the same code base, they can get confused about whether the commented code should be used or deleted.
  • --fs-300: 0.875; does not have any unit even though it is used for font-size property.

  I hope this helps. Happy coding! 😄

  Marked as helpful

  0

  ---

  

  Benley•80

  @Iam-benleyPosted almost 2 years ago

  @vanzasetia Thanks for the suggestion I'll read about the links you give me and try to improve in the next project.

  1