HTML5: i campi di tipo input

In Html5 sono state introdotte numerosissime novità utili a snellire, migliorare e controllare l'oggetto modulo (form).

Purtroppo allo stato dell'arte i browser supportano le nuove caratteristiche in maniera molto incompleta. Per vederne le effettive potenzialità si consiglia l'utilizzo di Opera o Safari, in alternativa Chrome e man mano con molte non interpretazioni gli altri browser.

Ecco una prima panoramica sui campi di tipo input:

Campo input inserimento email sintatticamente corretta <input type="email" name="email">

Campo input inserimento url completo (es. https://www.disign.it) <input type="url" name="sito">

Campo input selettore colore <input type="color" name="colore">

Campo input selettore data <input type="date" name="data">

Campi input valore numerico in intervallo definito <input type="number" name="quantita" min="1" max="5">

Campo input selettore numerico da valore a valore con visualizzazione cursore <input type="range" name="punteggio" min="1" max="10">

Campo input per ricerca (stile Google) <input type="search" name="google">

Campo input per inserimento ora <input type="time" name="ora_utente">

Campo input data e orario (con time zone) <input type="datetime" name="data_ora">

Campo input data e orario (senza time zone) <input type="datetime-local" name="data_ora">

Campo input anno mese <input type="month" name="anno_mese">

Campo input anno srttimana <input type="week" name="anno_settimana">