Inserire dati e numeri con la tastiera di un iPhone o di uno smartphone Android non è sempre la cosa più facile: i tasti sono oggettivamente piccoli e la tastiera limitata.

Per mitigare questo problema e rendere più veloce ed efficace l'utilizzo di campi di input nei nostri siti web mobili HTML5 – come al solito – ci viene in soccorso: grazie ai nuovi e diversi "input type", in particolare URL e EMAIL, possiamo dire al telefonino che tipo di input stiamo richiedendo, e il telefonino obbediente mostrerà la tastiera più adeguata

Vediamoli adesso uno per uno.

Testo classico

Partiamo dalla base: la tastiera che appare nel momento in cui utilizziamo nella nostra pagina un input type "classico", ovvero

<input type="text">

Email

Una delle richieste più frequenti che avviene su un sito web e l'immissione di un indirizzo email. Usando

<input type="email">

avremo una tastiera che aiuta nella compilazione del campo, proponendo già, ad esempio, il tasto con la "@" e il punto:

URL

Se chiediamo ai nostri utenti di inserire una URL, il tipo di input

<input type="url">

ci viene in aiuto visto che in questo caso la tastiera mostrata dal nostro iPhone sarà la seguente (notate la presenza del tasto ".com" e della slash "/"):

Numeri

Nel momento in cui richiediamo l'input di numeri possiamo usare

<input type="number">

e la tastiera che apparirà sarà la seguente (in sostanza è come se avessimo già premuto il tasto per i numeri):

Numeri di telefono

Per finire, se usiamo il formato

<input type="tel">

la tastiera diventerà quella che usiamo di solito per comporre i numeri, e cioè

Conclusioni

In conclusione, già la vita dei navigatori via smartphone (che sono sempre di più) non è facilissima… Il nostro suggerimento allora è di rendere tutto il più semplice possibile, usando in maniera adeguata i nuovi tipi di input HTML5 – che per comodità vi riportiamo qui:

<input type="text"><br />    <input type="email"><br />    <input type="url"><br />    <input type="number"><br />    <input type="tel">

 

The following two tabs change content below.
Silvio Porcellana
Silvio Porcellana è il fondatore di mob.is.it, il tool che centinaia di agenzie e professionisti di tutto il mondo utilizzano per creare con semplicità siti mobili e applicazioni native per i loro clienti. Tiene anche un podcast dove racconta ogni venerdì le sue avventure imprenditoriali, senza veli o segreti: Opus Digitalis