Form validation with HTML5
To ensure that a form can still be submitted if JavaScript is not loading or is disabled in the user's browser, we can rely on HTML5 form validation. What does this accomplish? The form should function as expected without the need for any JavaScript. Cool, right? I think this approach is a great foundation for development.
However, in most cases, we’ll still need to implement additional validation with JavaScript—especially if we want to create custom error messages for each field for better UX or that the fields react dynamically as the user types.
See the Pen Interactive code block with hoverable attributes in a canvas by Marta Godoy (@martagodoy) on CodePen.