Well-deployed technologies
Customized text entries
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.
Input validation
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.
Input hint
The placeholder
attribute allows to guide user input by inserting hints that describe the type of content expected in a text-entry control.
Form autocomplete
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.
Technologies in progress
Clipboard
Copy and paste operations are a core mechanism to pass text input from one application to another, especially on devices where text input remains a challenge. The Clipboard API and events specification describe APIs for overriding the default clipboard actions (e.g. to add metadata or to reformat the content), and for directly accessing the clipboard contents (e.g. to keep clipboard data in sync between a local app that communicates with a remote device).
Feature | Specification / Group | Maturity | Current implementationsSelect browsers… |
---|---|---|---|
Clipboard | Clipboard API and events Web Editing Working Group |
Discontinued features
- Input modality
- The
inputmode
attribute 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
,email
andurl
).