venerdì 29 aprile 2016

Che cos'è un placeholder e come si usa

Tags

Hai notato che ormai molti siti web hanno il campo di ricerca con dentro la scritta Cerca? Molto bello vero?
Se vuoi sapere come fare anche tu per fare apparire una scritta all'interno di un campo di un form di ricerca senza usare javascript o css, continua a leggere (cit.)

Che cos'è un placeholder
Un placeholder (segnaposto) è un attributo html5 che serve per visualizzare un breve suggerimento all'interno delle caselle dei form html, nei campi di tipo testo (input text o textarea).

Come funziona un placeholder
Mettendo dunque l'attributo placeholder con rispettivo testo, all'interno del codice html di un campo input, la scritta inserita nel placeholder verrà mostrata a video all'interno del box che serve all'utente per scrivere del testo.
Grazie ai placeholder quindi, si risparmia spazio nella pagina web, in quanto la descrizione di un campo di un form può venir inserita all'interno del campo stesso.
Inoltre, quando la casella viene selezionata dall'utente (ricevendo il focus), il testo del placeholder sparisce, lasciando spazio ai caratteri digitati dall’utente.

Esempio pratico di codice html con placeholder
Per vedere come funziona un placeholder, copia ed incolla questa breve stringa nella tua pagina html:

<input type="Text" title="Cerca" placeholder="Cerca">

Il risultato a video sarà una cosa del genere:

Che cos'è un placeholder e come si usa

Bene, ora anche tu sei un maestro di placeholder :)

Piaciuto l'articolo? Lascia un commento!

EmoticonEmoticon