form - conviene farle bene. nicola bonora alla web marketing expo 2016
TRANSCRIPT
![Page 1: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/1.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
We are Mentine The re-design minded company
UX design Content designInformation Architecture Visual designInteraction design Front-end design + dev
(+ WordPress)
![Page 2: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/2.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
In coro!
DARIO
NICOLACARLO
![Page 3: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/3.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
In coro!
DARIO
NICOLACARLO
UN GATTO
![Page 4: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/4.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Form
Cose tipo:Nome:
Cognome:
Telefono:
Email:
Indirizzo principale:
Indirizzo secondario:
Comune:
Cap: Nazione:
Commenti:
![Page 5: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/5.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’anno
![Page 6: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/6.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Perché non dobbiamo dimenticare
![Page 7: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/7.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Perché non dobbiamo dimenticare
![Page 8: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/8.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’annoCHIARO, JEFF?
CHIARO, NIC.
![Page 9: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/9.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’anno
![Page 10: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/10.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Agenda
Come organizzare i dati
Come allineare i campi
Input dei dati
Azioni
Feedback ed errori
Brand
![Page 11: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/11.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Come organizzare i dati
![Page 12: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/12.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Ai campi della vostra form applicate la regola TTSS:
Taglia Tieni Sposta Spiega
Come organizzare i datiFonte: https://twitter.com/cjforms/status/129160080150106112
![Page 13: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/13.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Form
Cose tipo:Nome:
Cognome:
Telefono:
Email:
Indirizzo principale:
Indirizzo secondario:
Comune:
Cap: Nazione:
Commenti:
![Page 14: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/14.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
HAI DAVVERO BISOGNO
DEL DATO?
Taglia
È UN DATO
SENSIBILE?
Tieni
NE HO BISOGNO
ORA?
Sposta
NO
Come organizzare i dati
NO NO Spiega
SI SI SI
![Page 15: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/15.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Come organizzare i dati
Esempi:Nome:
Cognome:
Telefono:
Email:
Indirizzo principale:
Indirizzo secondario:
Comune:
Cap: Nazione:
FORM 11 CAMPI
Commenti:
Fonte: https://youtu.be/ulJwW6zfR_o?t=1m20s
![Page 16: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/16.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Esempi:
Nome:
Telefono:
Email:
Commenti:
+160% DI SUBMISSION
+120% DI CONVERSION
FORM 4 CAMPI
Come organizzare i datiFonte: https://youtu.be/ulJwW6zfR_o?t=1m20s
![Page 17: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/17.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Indicare chiaramente ed esplicitamente i campi richiesti
migliora i tuoi tassi di conversione
*campo obbligatorio
Nome*:
Email*:
Telefono (opzionale):
Come organizzare i dati
2x AUMENTO
DELLE CONVERSIONI
Fonte: https://www.youtube.com/watch?v=ulJwW6zfR_o
![Page 18: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/18.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Come allineare i campi
![Page 19: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/19.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Ogni soluzione ha pro e contro, maper schermi piccoli non ci sono dubbi
Nome*:
Azienda (opzionale):
ETICHETTA
CAMPO VUOTO
COME ALLINEARE I CAMPI
Top alignFonte: https://www.sitepoint.com/definitive-guide-form-label-positioning/
![Page 20: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/20.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Suggerire, con le dimensioni del campo, il tipo di dato che
si vuole ottenere aiuta a migliorare i temi di compilazione
della form.
Nome*:
Indirizzo (opzionale):
Comune*: CAP:DIM. 5 CARATTERI
COME ALLINEARE I CAMPI
Le dimensioni contano
![Page 21: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/21.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Per schermi larghi può essere consigliabile allineare a sinistra le etichette, se questa soluzione migliora la visione
d’insieme della form.
Nome*:
Indirizzo: (opzionale)
Comune*: CAP:
COME ALLINEARE I CAMPI
Eccezioni
![Page 22: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/22.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
COME ALLINEARE I CAMPI
Errori
TAGLIA
vv
![Page 23: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/23.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
vv
COME ALLINEARE I CAMPI
Errori
CAMPI DISALLINEATI
![Page 24: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/24.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
vv
COME ALLINEARE I CAMPI
Errori
REQUISITI NON CHIARI
*
![Page 25: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/25.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
vv
COME ALLINEARE I CAMPI
Errori
ETICHETTA INTERNA
![Page 26: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/26.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
vv
COME ALLINEARE I CAMPI
Errori
INFORMAZIONE INCOMPLETA E
ILLEGGIBILE
![Page 27: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/27.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
vv
COME ALLINEARE I CAMPI
Errori
FUNZIONALITÀ ‘DESKTOP’ NON
NASCOSTA (E NON FUNZIONANTE)
SU MOBILE
![Page 28: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/28.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
COME ALLINEARE I CAMPI
Errori
vv
![Page 29: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/29.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
COME ALLINEARE I CAMPI
Errori
![Page 30: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/30.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
COME ALLINEARE I CAMPI
Errori
![Page 31: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/31.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’annoVA’ CHE ROBA,
BILL.
UN BELLO SCHERMO BLU E PASSA LA PAURA.
![Page 32: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/32.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Input dei dati
![Page 33: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/33.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
INPUT DEI DATI
Le limitazioni del mobile
• Input da tastiera lento e favorevole all’errore
• Poco spazio su schermo, manca la visione d’insieme
• Tap poco accurati
• Mancanza dell’effetto “hover”
![Page 34: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/34.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Nome:
Secondo nome (opzionale):
Cognome:
Tieni gli utenti sullo stessa tipologia di inserimento dati il più a lungo possibile
Nome e cognome:
vv
vv
INPUT DEI DATI
Le linee guida per il mobile
![Page 35: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/35.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Usa la giusta tastiera per l’input e mantieni la semantica
Cap*:
INPUT DEI DATI
Le linee guida per il mobile
vv
vv
Cap*:
![Page 36: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/36.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Usa la giusta tastiera per l’input e mantieni la semantica
INPUT DEI DATI
Le linee guida per il mobile
vv
vv
Email: Email:
N| nicola.bonora@ment|
![Page 37: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/37.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Dropdown menu
INPUT DEI DATI
Le linee guida per il mobile
vv
![Page 38: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/38.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Dropdown: 35 motivi per non usarle FUCKDROPDOWNS.COM
INPUT DEI DATI
Le linee guida per il mobile
![Page 39: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/39.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Ottimale sarebbe
7 x 7 millimetri
7 X 7 MILLIMETRI
INPUT DEI DATI
Dimensioni delle aree cliccabili
![Page 40: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/40.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Azioni
![Page 41: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/41.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
AZIONI
Call to actionDecidi uno stile per la call to action primaria e per la call to
action secondaria
Bottone
Fonte: https://medium.com/eightshapes-llc/buttons-in-design-systems-eac3acf7e23#.8zmpfftxr
![Page 42: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/42.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Decidi uno stile per la call to action primaria e per la call to
action secondaria
Get Started
Select
Select
Select
Select
Select
Get Started
Log In
Register
Read More
Title Details
Title Details
Title Details
Title Details
Title Details
vv
vv
AZIONI
Definisci quando usare una o più CTA
![Page 43: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/43.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Decidi uno stile per la call to action primaria e per la call to
action secondaria
AZIONI
Definisci quando usare una o più CTA
vv
vv
vv
vv
vv
vv
![Page 44: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/44.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’anno…TUTTI ROSSI,
CAPISCI?!?
![Page 45: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/45.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Save Save Save
Save
SaveSaveSave
SaveSave
vv
vv
vv
vv
vv
AZIONI
Attenzione ai fantasmi!
![Page 46: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/46.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
AZIONI
A button is a button is a button (cit .)
![Page 47: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/47.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Feedback ed errori
![Page 48: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/48.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Offrire suggerimenti e inserire vincoli può evitare errori di
inserimento dati
FEEDBACK ED ERRORI
Prevenire è meglio che curare
![Page 49: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/49.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Offrire suggerimenti e inserire vincoli può evitare errori di
inserimento dati
FEEDBACK ED ERRORI
Prevenire è meglio che curare
![Page 50: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/50.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
‘Inline validation’ Vs. ‘Reward early, punish late’
Se l’utente sta inserendo il dato in un campo che era in uno stato valido, controlla dopo che il dato è stato inserito.
Se l’utente sta inserendo il dato in un campo che era in uno
stato non valido, controlla mentre il dato viene inserito.
FEEDBACK ED ERRORI
Quando fornire feedback?
![Page 51: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/51.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Esempio di ‘Inline validation’
FEEDBACK ED ERRORI
Quando fornire feedback?
![Page 52: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/52.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Esempio di ‘Reward early, punish late’
FEEDBACK ED ERRORI
Quando fornire feedback?
![Page 53: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/53.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 54: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/54.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 55: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/55.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 56: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/56.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 57: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/57.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 58: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/58.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 59: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/59.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 60: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/60.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FEEDBACK ED ERRORI
Utilizzare messaggi chiari e amichevoli
![Page 61: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/61.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
CHE DICI?E CHE VUOI CHE
TI DICA?
![Page 62: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/62.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Brand
![Page 63: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/63.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Se la form è comunicazione, parliamo con il nostro tono di
voce.
BRAND
Esprimi il tuo carattereFonte: https://medium.com/eightshapes-llc/buttons-in-design-systems-eac3acf7e23#.8zmpfftxr
![Page 64: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/64.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Se la form è comunicazione, parliamo con il nostro tono di
voce.
BRAND
Esprimi il tuo carattereFonte: http://littlebigdetails.com/post/112316294419/asos-after-providing-your-birthday-calculated
![Page 65: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/65.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Se la form è comunicazione, parliamo con il nostro tono di
voce.
BRAND
Esprimi il tuo carattereFonte: http://littlebigdetails.com/post/110868794512/gmail-if-you-use-too-many-dots-there-is-a
![Page 66: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/66.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Se la form è comunicazione, parliamo con il nostro tono di
voce.
BRAND
Esprimi il tuo carattereFonte: http://littlebigdetails.com/post/101243507017/readme-the-owl-covers-her-eyes-while-you-type
![Page 67: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/67.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Se la form è comunicazione, parliamo con il nostro tono di
voce.
BRAND
Esprimi il tuo carattereFonte: http://littlebigdetails.com/post/104161036411/beanstalk-the-password-strength-indicator-shows
![Page 68: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/68.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Se la form è comunicazione, parliamo con il nostro tono di
voce.
BRAND
Esprimi il tuo carattere
![Page 69: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/69.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
E ora? “Se avessi chiesto ai miei clienti cosa volevano, mi avrebbero risposto…”
![Page 70: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/70.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’anno FORM PIÙ LEGGIBILI.
![Page 71: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/71.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
E ORA?
Chatbot
![Page 72: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/72.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
E ORA?
Input vocale
![Page 73: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/73.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
E ORA?
Accelerated Mobile Pages (performance)
![Page 74: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/74.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
E ORA?
Acquista da Facebook
![Page 75: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/75.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
E ORA?
Input tramite fotocamera
![Page 76: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/76.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
FORM: CONVIENE FARLO BENE
Correva l’annoRESTATE IN FORM!
CHI È IL TIPO BIONDO VICINO A @NICBONORA?
![Page 77: FORM - conviene farle bene. Nicola Bonora alla Web Marketing Expo 2016](https://reader031.vdocuments.site/reader031/viewer/2022030316/587785301a28abc85f8b63f7/html5/thumbnails/77.jpg)
WM Expo – L’eccellenza italiana del Web Marketing - #wmexpoW M E X P O - L’ E C C E L L E N Z A I TA L I A N A D E L W E B M A R K E T I N G - # W M E X P O
Grazie.