Mobile web forms

Filling out online forms, especially on mobile devices, can be difficult. To improve the user experience you'll be asked to show that you can use basic HTML5, JavaScript, and the HTML5 Constraint Validation API, to design efficient and secure HTML web forms with:

  • Appropriate label tags associated with inputs
  • Inputs with appropriate type, name and autocomplete attributes
  • Inputs with large touch targets for mobile forms
  • Suggestions for user input using the datalist element
  • Front-end validation of inputs (e.g., pattern, maxlength, required) and DOM elements, including:
    • Checking validation errors in real-time with pseudo-classes on inputs
    • Form validation prior to submission (Constraint Validation API)

Resources: