Newsletter Signup Form

Community feedback

• 

  Abdul Khaliq 🚀•72,560

  @0xabdulkhaliqPosted 11 months ago

  Hello there 👋. Congratulations on successfully completing the challenge! 🎉

  • I have other recommendations regarding your code that I believe will be of great interest to you.

  ---

  LABELS 🔖:

  • Every input elements wants a label associated with it, without label you can't announce what fields the user need to fill for screen readers like accessibility devices.

  ---

  • A <label> is used to create a caption for a form control. The <label> can be associated with a form control either implicitly by placing the control element inside the label element, or explicitly by using the for attribute

  ---

  • Effective form labels are required to make forms accessible. The purpose of form elements such as checkboxes, radio buttons, input fields, etc, is often apparent to sighted users

  ---

  • Even if the form element is not programmatically labeled. Screen readers users require useful form labels to identify form fields.

  ---

  • Instead of using label you have used p, So please do change it into a label element to improve accessibility of your solution.

  ---

  • Example:

  <label class="large-label" for="your-name">
    Your name
    <input id="your-name" name="your-name" type="text" />
  </label>
  

  • How we can implement this your code,

  <div class="....">
      <div class="....">
         <label for="mail" class="....">Email address</label>
      </div>
      <input ..... id="mail" name="mail">
  </div>
  

  ---

  .

  I hope you find this helpful 😄 Above all, the solution you submitted is great !

  Happy coding!

  Marked as helpful

  0