Les onglets personnalisés sont une fonctionnalité des navigateurs Android qui permet aux développeurs d'applications d'ajouter une expérience de navigation personnalisée directement dans leur application.
Le chargement de contenu Web fait partie des applications mobiles depuis les débuts des smartphones, mais les anciennes options peuvent poser des problèmes aux développeurs. Le lancement du navigateur proprement dit est un changement de contexte important pour les utilisateurs, qui n'est pas personnalisable. De plus, les WebViews ne sont pas compatibles avec toutes les fonctionnalités de la plate-forme Web, ne partagent pas l'état avec le navigateur et ajoutent des frais généraux de maintenance.
Les onglets personnalisés permettent aux utilisateurs de rester dans l'application pendant la navigation, ce qui augmente l'engagement et réduit le risque d'abandon de l'application. Les onglets personnalisés sont directement alimentés par le navigateur préféré de l'utilisateur et partagent automatiquement l'état et les fonctionnalités qu'il propose. Vous n'avez pas besoin d'écrire de code personnalisé pour gérer les requêtes, les autorisations ou les magasins de cookies.
Que peuvent faire les onglets personnalisés ?
En utilisant un onglet personnalisé, votre contenu Web se charge dans le moteur de rendu qui alimente le navigateur préféré de votre utilisateur. Toutes les fonctionnalités de l'API ou de la plate-forme Web y sont disponibles, ainsi que dans votre onglet personnalisé. Leur session de navigation, leurs mots de passe enregistrés, leurs modes de paiement et leurs adresses s'affichent comme d'habitude.
Que puis-je personnaliser dans un onglet personnalisé ?
Beaucoup ! Les onglets personnalisés vous permettent de contrôler précisément une grande partie de l'interface utilisateur et du chrome du navigateur. Dans votre application, vous lancez un onglet personnalisé à l'aide d'un Intent. Lorsque cet Intent est appelé, vous pouvez ajouter un certain nombre d'attributs à CustomTabIntent pour obtenir l'expérience exacte que vous souhaitez. Voici quelques personnalisations que vous pouvez ajouter :
- Animations d'entrée et de sortie personnalisées pour correspondre au reste de votre application
- Modifier la couleur de la barre d'outils pour qu'elle corresponde à l'image de marque de votre application
- Cohérence des couleurs qui peut rester dans votre application, même si l'utilisateur bascule entre les thèmes clair et sombre
- Actions et entrées personnalisées dans la barre d'outils et les menus du navigateur
- Contrôlez la hauteur de lancement de l'onglet personnalisé, ce qui vous permet, par exemple, de diffuser vos vidéos en streaming tout en interagissant avec votre boutique en ligne.
De plus, les utilisateurs peuvent réduire un onglet personnalisé pour interagir avec l'application sous-jacente et le restaurer à tout moment sans perdre leur progression pour reprendre leur parcours. Cela permet aux utilisateurs de ne pas avoir à fermer l'onglet personnalisé et de passer facilement du Web à l'application native. Cette fonctionnalité est activée par défaut pour les onglets personnalisés.
C'est loin de tout. Les onglets personnalisés sont très puissants et en cours de développement. Chaque navigateur doit ajouter la prise en charge de ces fonctionnalités à mesure qu'elles deviennent disponibles. Bien que presque tous les navigateurs soient compatibles à un certain niveau, il est important de savoir ce qui peut être disponible ou non dans les navigateurs de vos utilisateurs. Consultez le tableau comparatif des fonctionnalités pour vérifier rapidement la disponibilité des différentes fonctionnalités dans les navigateurs Android populaires.
Vous pouvez le tester dès maintenant avec notre exemple sur GitHub.
Quand dois-je utiliser les onglets personnalisés ?
Il n'existe pas de méthode "correcte" unique pour charger du contenu Web. Dans certains cas, WebView sera la technologie appropriée. Par exemple, si vous hébergez exclusivement votre propre contenu dans votre application ou si vous devez injecter du code JavaScript directement depuis votre application. Si votre application redirige les utilisateurs vers des URL en dehors des domaines, l'état partagé intégré dans les onglets personnalisés est probablement un meilleur choix. Voici d'autres avantages des onglets personnalisés :
- Sécurité : les onglets personnalisés utilisent la navigation sécurisée de Google pour protéger l'utilisateur et l'appareil contre les sites dangereux.
- Optimisation des performances :
- Préchauffage du navigateur en arrière-plan, tout en évitant de voler des ressources à l'application.
- Accélérez le temps de chargement des pages en chargeant les URL de manière spéculative à l'avance.
- Gestion du cycle de vie : les applications qui lancent un onglet personnalisé ne sont pas expulsées par le système pendant l'utilisation de l'onglet. L'importance de l'onglet personnalisé est définie au niveau foreground.
- Un modèle d'autorisations et de cookie jar partagé pour que les utilisateurs n'aient pas à se connecter aux sites auxquels ils sont déjà connectés ni à réaccorder les autorisations qu'ils ont déjà accordées.
- Les fonctionnalités du navigateur, comme la saisie automatique pour remplir plus facilement les formulaires, sont disponibles prêtes à l'emploi.
- Les utilisateurs peuvent revenir à l'application à l'aide d'un bouton Retour intégré.
Onglets personnalisés ou activité Web fiable
Les activités Web fiables étendent le protocole des onglets personnalisés et partagent la plupart de ses avantages. Toutefois, au lieu de fournir une UI personnalisée, il permet aux développeurs d'ouvrir un onglet de navigateur sans aucune UI. Il est recommandé aux développeurs qui souhaitent ouvrir leur propre progressive web app en plein écran dans leur propre application Android.
Où les onglets personnalisés sont-ils disponibles ?
Les onglets personnalisés sont une fonctionnalité compatible avec les navigateurs sur la plate-forme Android. Elle a été introduite à l'origine par Chrome, dans la version 45. Le protocole est compatible avec la plupart des navigateurs Android.
Nous recherchons des commentaires, des questions et des suggestions sur ce projet. Nous vous encourageons donc à signaler les problèmes sur crbug.com et à poser vos questions sur Twitter @ChromiumDev.
En savoir plus
Pour toute question, consultez le tag chrome-custom-tabs sur Stack Overflow.