Well-deployed technologies
The <input type="email">, <input type="tel"> and <input type="url"> can be used to optimize the ways user enter these often-difficult to type data, e.g. through dedicated virtual keyboards, or by accessing on-device records for these data (from the address book, bookmarks, etc.).
Date and time entries can take advantage of a number of dedicated form controls (e.g. <input type="date">) to trigger the use of a native calendar control, avoiding the need to create custom JS-based controls that cannot be easily tailored to cope for the variety of mobile devices available on the market. Beware though: specific browsers may only support a subset of these controls, falling back to regular text entries when the input type value is not supported.
The pattern attribute allows both to guide user input as well as to avoid server-side validation (which requires a network round-trip) or JavaScript-based validation (which takes up more resources), both useful optimization on constrained mobile devices.
The placeholder attribute allows to guide user input by inserting hints that describe the type of content expected in a text-entry control.
The <datalist> element allows creating free-text input controls coming with pre-defined values the user can select from; the autocomplete attribute is a mechanism to automatically fill input fields based on well-known data for the user, solving the problem of working with long and multi-page forms that are common on mobile devices, e.g. in mobile purchase scenarios.
Discontinued features
- Input modality
- The
inputmodeattribute defined the type of textual input expected in a text entry. Mobile browsers could use that hint to render the right type of on-screen keyboard, for instance to display a keypad when the user was expected to enter a credit card number. This attribute is no longer supported in recent browsers and has been removed from HTML. Developers are encouraged to use more specific input types (such astel,emailandurl).