Here’s a thing you’re sure to do in your web developer career: add form validation to a form. You can’t leave that name field blank! That doesn’t look like an email address! That quantity is too high! Forms are a part of the beating heart of the web, and especially important to business. You can’t charge a credit card with an invalid card number, and you can’t let someone order 5 rice cookers if you only have 4 in stock.
These days, the approach to form validation should be:
- Start with semantic, valid, accessible HTML. You can do some level of validation on forms right in HTML.
- Layer on CSS, adjusting the styles for form elements in different states of validity.
- Layer on JavaScript, filling in gaps that HTML can’t do and making things more accessible.
It’s a lot! But it’s worth doing right. Fortunately, Gerardo Rodriguez’s 4-part series and demo/repo is a very good reference. You might want to test those forms, too.