Abbiamo appena lanciato il supporto per i form HTML su AMP. Grazie all’estensione “amp-form” l’elemento <form> e gli altri elementi correlati, come <input>, possono essere usati per creare i form nell’ambito dei documenti AMP. Ciò consente di offrire esperienze che vanno dal selettore di colore per prodotti in una pagina dettagli di e-commerce a un campo email che tiene traccia delle iscrizioni di una newsletter, fino al sondaggio interattivo in un articolo designato a coinvolgere i lettori.
Sia la navigazione normale sia l’invio dei form XHR (XMLHttpRequest, ossia Ajax) sono supportati, ma ti consigliamo di consultare la documentazione per ulteriori dettagli sui requisiti di implementazione. Amp-form inoltre offre le seguenti funzionalità che rendono più agevole la compilazione dei form.
- L’utilizzo dell’attributo “on” per modificare la pagina quando il form viene inviato o per modificarla a seconda che il form sia stato inviato correttamente o presenti invece degli errori.
- L’annotazione dei campi all’invio che si avvale del rendering di risposta basato sui modelli. L’uso di questa funzione consente di fornire feedback contestuali sui possibili errori di immissione nei campi.
- I campi di stile basati sullo stato di convalida usando le pseudo-classi CSS per fornire agli utenti un feedback in tempo reale sulla validità o meno della loro immissione.
|
Un esempio di rendering di risposta basato sui modelli. Quando il form viene inviato (in questo caso, con un errore), restituisce una risposta con un messaggio utile. |
Per iniziare, consulta la documentazione e gli esempi di AMP By Example.
Vogliamo sapere da te quali potrebbero essere le altre funzionalità che ritieni utili, perché a breve espanderemo le funzionalità dei form. Ad esempio, ora la convalida personalizzata è disponibile in forma di funzionalità sperimentale (“amp-form-custom-validations”). L’ulteriore supporto per la convalida e i comportamenti condizionali sono solo due degli esempi di miglioramento che stiamo monitorando sulla Roadmap AMP.
Grazie a questo primo insieme di supporto per form, non vediamo l’ora di scoprire tutti i grandi prodotti abilitati per i form che gli sviluppatori riusciranno a creare.
Pubblicato da Rudy Galfi, Product Manager, AMP Project