To recap—or in case you haven’t read Sandeep’s article—with the dawn of HTML5, a raft of new input types and attributes were added to tags that allow the browsers themselves to perform the client-side validation for us: no Java Script required.
To start using the new input types and attributes, you don't really need to do anything other than start using the new input types and attributes.
To make sure our user enters the right data in the email, website, and number of tickets fields, we can use some of the new input types added in HTML5: By specifying the appropriate type, our browser will validate the data for us and make sure we've got an email address in the email field, a URL in the website field, and a number in the number of tickets field.
Note too that the If the user enters anything less than 1 or greater than 4, they'll be prompted to enter a number in the permitted range.
He lives and works in Newcastle-upon-Tyne, England, and often attends local user groups and meetups. When he's not in front of a computer Ian can be found playing guitar, and taking photos.
Date Validation Email Validation Phone Number Validation U.
I’m also using the WAI ARIA attribute now, so if we leave ‘required’ in the label tag screen reader users will have ‘required’ read to them twice, which they could find rather annoying.
A word of warning though: not all browsers implement the attribute accessibly, so it might not be picked up correctly in certain browser / screen reader combinations.
Take this simple booking form: attribute for the label tag matches up with the id attribute of the associated input tag.