<input type=email|url|tel>: browser validation, free

Choose the right type, get validation for free

<input type="email" />   <!-- requires @ and a domain -->
<input type="url" />     <!-- requires scheme + host -->
<input type="tel" />     <!-- mobile keyboard switches to number pad; NO format validation -->
<input type="search" />  <!-- styles with a clear "x" button + ESC clears -->
<input type="password" />

Browser validates on submit. If the user types "anna" into type="email", the browser shows a native tooltip "Please include an @" and blocks the submit. No JS needed.

type=tel is special

It changes the on-screen keyboard on mobile (numbers + symbols) but does NOT validate format. Phone formats vary too much (US: 555-1234, UK: 020 7946 0958, etc.). Pair with pattern or backend validation.

type=email accepts ONE address by default

For multiple recipients: <input type="email" multiple />. The browser then validates a comma-separated list.

Mobile keyboard switching

Beyond keyboard for tel, also:

• type="number" — number pad
• type="email" — keyboard with @ and . prominent
• type="url" — keyboard with / and .com prominent
• type="search" — keyboard with a "Search" button instead of "Return"

Pick the right type. Mobile users notice.