Ping single column coming soon page

Community feedback

• 

  P

  Andreas Remdt•950

  @andreasremdtPosted over 1 year ago

  Hey Giorgian,

  Congrats on finishing this challenge, your solution looks good! I found a few issues that you might want to fix:

  • The interactive elements (input, buttons) don't have clear focus or hover states, which should definitely be added for a better user experience and accessibility.
  • The input and button are not within a form, which makes you lose some important functionality like pressing Enter to submit and send it. This also hurts accessibility.
  • The error appears once I try to submit with an invalid email, which is great. However, once I type in a correct email address and submit, the error stays there, which is confusing to users. A good practice would be to hide the error when the email is correct and the user leaves the input (blur), presses the button, or even while typing (input event). So, make sure that you add an else condition in your JavaScript for when the email is valid.
  • Using regular expressions for validation is a common practice, but I don't recommend using these for emails, as there are tons of variants out there, and hardly any of them get it right. Some are too strict, others are too lax, and most don't cover all edge cases. Browsers these days already offer APIs to validate input. I recommend you look into constraint validation, which makes it so much easier validating HTML forms.
  • The social icons at the bottom are wrapped inside a button. I think that's okay for this challenge, as there's no action behind these; I would still advice using an a element, as social links tend to redirect you to a different website, whereas buttons are more suitable for triggering interactive JavaScript.

  I hope my feedback helped you out, let me know if you have any questions. Keep up the great work!

  0