The Current State of HTML5 Forms

The email Type

<input type="email">
<input type="email" multiple>

Live Demo




Firefox
4+
Safari
5+
Safari Mobile
iOS 3.1+
Chrome
10+
Opera
10.6+
IE
10+
Android
4.0+
Supported Kinda supported Kinda supported Supported Supported Supported Kinda supported

Supported Browser Screenshots

Firefox 31
Chrome 34
iOS Keyboard

The Low Down

The email input type is for (you guessed it) email addresses. Just by virtue of having this type applied, the value will be validated, requiring the presence of an @.

  • Email validation is a particularly difficult (screenshot) to do perfectly (via JS or Server Side validation).
  • Mobile devices with dynamic keyboards, including iOS and Android, brings up an email keyboard featuring the "@" and "." keys
  • Safari and Android validate email addresses, supporting :valid and :invalid, but do not provide constraint on form submission.
  • Falls back to a regular text input.
  • Include the multiple attribute to accept more than one comma separated email address. If you also include the pattern attribute, remember the pattern must match the entire value, including the comma and optional spaces.
  • Use case: simple contact forms
  • Careful with double-byte internationalized domain names, Firefox, Safari and Chrome, but not Opera, invalidate them.