Nei moduli precedenti, hai imparato a creare un modulo, ad aiutare gli utenti a evitare di reinserire i dati e a convalidare i dati di un modulo. Come puoi assicurarti che il modulo sia utilizzabile? Puoi testare e analizzare il modulo per rispondere a questa domanda.
Il modulo funziona su altri dispositivi?
Per prima cosa, conferma che il modulo funziona sul tuo dispositivo. Tuttavia, esistono molti tipi di dispositivi che gli utenti potrebbero utilizzare. Come puoi verificare se il modulo funziona con altri dispositivi?
Innanzitutto, verifica il modulo su un computer. Dopodiché prova a usare soltanto la tastiera. Dopodiché, provalo su un telefono. Hai testato il modulo con diversi metodi di immissione (tastiera, tocco e mouse), schermi di dimensioni diverse, browser e sistemi operativi differenti.
Hai altri dispositivi su cui eseguire il test? Prova il modulo su tutti. Maggiore è il numero di dispositivi, browser, versioni di browser e sistemi operativi che puoi eseguire, meglio è.
Puoi anche utilizzare un servizio di test per testare il modulo su tantissimi browser, versioni di browser differenti, dispositivi diversi e sistemi operativi differenti. BrowserStack offre account di test senza costi per progetti open source al fine di consentire test su diversi browser, dispositivi e sistemi operativi.
Come puoi verificare se il tuo modulo funziona per altre persone?
Il tuo primo modulo è pronto. Dedichi molto tempo a verificare che funzioni bene. Come puoi verificare che il modulo sia utilizzabile da tutti? Per prima cosa, puoi chiedere ad amici e colleghi di compilare il tuo modulo.
Siediti uno accanto all'altro o condividi lo schermo. In questo modo, puoi vedere come interagiscono con il modulo. Guardate come compilare il modulo. Chiedigli di dire ad alta voce cosa sta facendo e se sta riscontrando problemi. Dopo che hanno completato l'attività, fai loro delle domande. È chiaro cosa compilare? Ha riscontrato problemi durante la compilazione del modulo? C'è qualcosa di poco chiaro? Queste domande ti aiutano a creare moduli ancora migliori.
Come puoi misurare il rendimento del modulo?
Hai confermato che il modulo è utilizzabile da altri utenti. Come passaggio successivo, dovresti misurare le prestazioni del modulo. Per farlo, sono disponibili strumenti senza costi. Diamo un'occhiata ad alcuni di questi.
PageSpeed Insights (PSI)
PSI misura le prestazioni del tuo sito e ti offre suggerimenti per migliorarlo.
Prova: PageSpeed fornisce un report sul rendimento utilizzando dati di prova controllati e reali. Un sito veloce è il primo segnale che il modulo è utilizzabile. Il tuo sito non è ancora veloce? PSI mostra dei consigli su come migliorare il rendimento.
Esamina nuovamente il report del sito che hai testato in precedenza con PSI. Leggi le informazioni sui Segnali web essenziali? Questo è un riepilogo se il tuo sito soddisfa i criteri di Core Web Vitals. I Segnali web essenziali ti aiutano a comprendere l'esperienza degli utenti su una pagina web.
Faro
Lighthouse ti aiuta a identificare prestazioni, ottimizzazione per i motori di ricerca (SEO), best practice e problemi di accessibilità.
Esistono diversi modi per utilizzare Lighthouse. Un'opzione è eseguirlo direttamente in DevTools. Apri l'URL con il tuo modulo in Chrome, apri DevTools, passa alla scheda Lighthouse ed esegui il controllo.
Vengono visualizzate le metriche sulle prestazioni di PSI. Inoltre, Lighthouse controlla il tuo sito per verificare che non ci siano problemi di SEO, best practice e accessibilità. Hai dimenticato di collegare un'etichetta a un controllo modulo? Lighthouse ti avvisa e ti fornisce una guida per correggere il problema.
Strumenti per identificare i problemi comuni
Esistono molti strumenti per identificare i problemi comuni.
Uno di questi è utilizzare
l'estensione per la risoluzione dei problemi di Modulo.
Ti avvisa in caso di attributi autocomplete mancanti, attributi non standard, etichette mancanti o vuote e altro ancora.
Puoi anche utilizzare uno strumento di valutazione dell'accessibilità come WAVE o Axe. Questi strumenti ti informano di etichette mancanti, connessioni mancanti tra etichette e controlli del modulo, contrasto di colore insufficienti e molti altri problemi di accessibilità.
In che modo puoi monitorare l'esperienza con i moduli?
Il monitoraggio dell'esperienza utente reale dei tuoi moduli ti aiuta a identificare rapidamente nuovi problemi. Vediamo come puoi monitorare il modulo.
PSI
Un modo per monitorare l'esperienza è utilizzare di nuovo PSI. Puoi utilizzare l'API PSI per creare il tuo strumento di monitoraggio: l'API PageSpeed Insights spiega come fare.
PSI include i dati del set di dati Report sull'esperienza utente di Chrome (CrUX), se disponibili per l'URL specificato. In questo modo, puoi anche visualizzare i dati dei campi direttamente nel report.
Faro
Lighthouse può essere utilizzato come strumento a riga di comando, come modulo nodo o con gli strumenti CI Lighthouse. Il monitoraggio delle prestazioni con Lighthouse CI spiega l'aggiunta di Lighthouse a un sistema di integrazione continua, come GitHub Actions.
Sono disponibili molti altri tools per misurare e monitorare il tuo sito. Alcune sono disponibili come strumenti web, altre consentono di eseguire il controllo dalla riga di comando, altre offrono un'API per integrarle nei tuoi strumenti.
Come analizzare il modulo
Hai testato il modulo con utenti reali e hai imparato a misurarlo e monitorarlo. Come puoi raccogliere statistiche sugli utenti e su come interagiscono con il modulo? Puoi usare uno strumento di analisi dei dati. Diamo un'occhiata a uno di questi elementi e come funziona.
Analisi
Uno strumento che puoi usare è Google Analytics (GA). Dopo la configurazione, riceverai uno snippet JavaScript da includere in ogni pagina del tuo sito. Da questo momento in poi, puoi scoprire in che modo gli utenti utilizzano il tuo sito.
Quante persone visitano la pagina contenente il tuo modulo? Quante persone compilano il modulo e passano alla pagina successiva? Puoi ottenere risposte a queste domande utilizzando gli strumenti di analisi.
Puoi anche configurare report di analisi più avanzati. Vuoi monitorare quanti utenti fanno clic sul pulsante Invia? Puoi definire e integrare gli eventi per analizzarli.
È disponibile un'ampia gamma di strumenti di analisi. Alcune sono minimaliste, altre offrono molte opzioni di personalizzazione. Prova una vasta gamma di strumenti per trovare quello più adatto alle tue esigenze.
Verifica le tue conoscenze
Verifica le tue conoscenze dei moduli di test
Cosa sono i dati dei campi?
RUM raccoglie le metriche da: