Le schede personalizzate sono una funzionalità dei browser Android che consente agli sviluppatori di app di aggiungere un'esperienza di navigazione personalizzata direttamente all'interno della loro app.
Il caricamento di contenuti web fa parte delle app mobile sin dai primi tempi degli smartphone, ma le opzioni meno recenti possono presentare sfide per gli sviluppatori. L'avvio del browser vero e proprio è un cambio di contesto pesante per gli utenti e non è personalizzabile, mentre le WebView non supportano tutte le funzionalità della piattaforma web, non condividono lo stato con il browser e aggiungono un overhead di manutenzione.
Le schede personalizzate consentono agli utenti di rimanere all'interno dell'app durante la navigazione, aumentando il coinvolgimento e riducendo il rischio che gli utenti abbandonino l'app. Le schede personalizzate sono alimentate direttamente dal browser preferito dell'utente e condividono automaticamente lo stato e le funzionalità offerte. Non è necessario scrivere codice personalizzato per gestire richieste, concessioni di autorizzazioni o archivi di cookie.
Che cosa possono fare le schede personalizzate?
Se utilizzi una scheda personalizzata, i tuoi contenuti web vengono caricati nel motore di rendering che alimenta il browser preferito dell'utente. Qualsiasi funzionalità dell'API o della piattaforma web è disponibile lì e nella scheda personalizzata. La sessione di navigazione, le password salvate, i metodi di pagamento e gli indirizzi vengono visualizzati come di consueto.
Cosa posso personalizzare in una scheda personalizzata?
Molto! Le schede personalizzate ti offrono un controllo granulare su gran parte del browser Chrome e dell'esperienza utente. All'interno dell'app, avvii una scheda personalizzata utilizzando un intent. Quando viene chiamato questo intent, puoi aggiungere una serie di attributi all'CustomTabIntent per ottenere l'esperienza esatta che desideri. Alcune personalizzazioni che puoi aggiungere sono elencate qui:
- Animazioni di entrata e uscita personalizzate per adattarsi al resto dell'app
- Modificare il colore della barra degli strumenti in modo che corrisponda al branding della tua app
- Coerenza dei colori che può rimanere nella tua app, anche se si passa dal tema chiaro a quello scuro e viceversa
- Azioni ed elementi personalizzati per la barra degli strumenti e i menu del browser
- Controlla l'altezza di avvio della scheda personalizzata, consentendo ad esempio lo streaming dei tuoi video mentre interagisci con il tuo negozio online
Inoltre, gli utenti possono ridurre a icona una scheda personalizzata per interagire con l'app sottostante e ripristinarla in qualsiasi momento senza perdere i progressi per riprendere il percorso. In questo modo gli utenti hanno un'alternativa alla chiusura della scheda personalizzata e possono passare facilmente dal web all'app nativa. La funzionalità è attivata per impostazione predefinita per le schede personalizzate.
È lontano da tutto. Le schede personalizzate sono molto potenti e in fase di sviluppo attivo. Ogni browser deve aggiungere il supporto per queste funzionalità man mano che diventano disponibili. Sebbene quasi tutti i browser supportino in qualche modo le tecnologie assistive, è importante sapere cosa potrebbe essere disponibile o meno nei browser degli utenti. Consulta la tabella di confronto delle funzionalità per verificare rapidamente la disponibilità delle diverse funzionalità nei browser Android più diffusi.
Puoi testarlo subito con il nostro esempio su GitHub.
Quando dovrei utilizzare le schede personalizzate?
Non esiste un solo modo "corretto" per caricare i contenuti web. In determinate situazioni, WebView è la tecnologia giusta da utilizzare. Ad esempio, se ospiti esclusivamente i tuoi contenuti all'interno dell'app o se devi inserire javascript direttamente dalla tua app. Se la tua app indirizza gli utenti a URL esterni ai domini, lo stato condiviso integrato nelle schede personalizzate le rende probabilmente una scelta migliore. Altri punti di forza delle schede personalizzate includono:
- Sicurezza: le schede personalizzate utilizzano Google Navigazione sicura per proteggere l'utente e il dispositivo da siti pericolosi.
- Ottimizzazione del rendimento:
- Pre-riscaldamento del browser in background, evitando di sottrarre risorse all'applicazione.
- Ridurre il tempo di caricamento della pagina caricando in modo speculativo gli URL in anticipo.
- Gestione del ciclo di vita: le app che avviano una scheda personalizzata non verranno chiuse dal sistema durante l'utilizzo della scheda. L'importanza della scheda personalizzata viene aumentata al livello in primo piano.
- Modello di autorizzazioni e cookie jar condivisi, in modo che gli utenti non debbano accedere ai siti a cui sono già connessi o concedere nuovamente le autorizzazioni che hanno già concesso.
- Le funzionalità del browser, come la compilazione automatica per completare meglio i moduli, sono disponibili immediatamente.
- Gli utenti possono tornare all'app con un pulsante Indietro integrato.
Schede personalizzate e attività web attendibili
Le Trusted Web Activity estendono il protocollo Custom Tabs e condividono la maggior parte dei suoi vantaggi. Tuttavia, anziché fornire un'interfaccia utente personalizzata, consente agli sviluppatori di aprire una scheda del browser senza alcuna interfaccia utente. È consigliato agli sviluppatori che vogliono aprire la propria app web progressiva, a schermo intero, all'interno della propria app per Android.
Dove sono disponibili le schede personalizzate?
Schede personalizzate è una funzionalità supportata dai browser sulla piattaforma Android. È stato introdotto originariamente da Chrome nella versione 45. Il protocollo è supportato dalla maggior parte dei browser Android.
Siamo alla ricerca di feedback, domande e suggerimenti su questo progetto, pertanto ti invitiamo a segnalare problemi su crbug.com e a porre domande su Twitter @ChromiumDev.
Scopri di più
Per domande, consulta il tag chrome-custom-tabs su Stack Overflow.