Configuration d’applications Web Android

Les applications Web iPhone disposent de quatre fonctionnalités de configuration (n’incluant pas le cache d’application HTML5) pour configurer le comportement des pages Web lorsque vous enregistrez la page Web sur l’écran d’accueil en tant que signet.

  1. Vous pouvez spécifier l’icône de la page d’accueil.
  2. Vous pouvez spécifier une image de démarrage qui s’affiche pendant le chargement de la page Web.
  3. Vous pouvez masquer l’interface utilisateur du navigateur.
  4. Vous pouvez modifier la couleur de la barre d’état.

Les quatre fonctionnalités fonctionnent en ajoutant des balises à comme ceci:

    

Naturellement, aucune de ces balises spécifiques “Apple” ne fait rien dans Android. Mais y a-t-il un moyen de faire quelque chose d’équivalent? [Au minimum, je veux que les utilisateurs puissent append ma page Web à leur écran d’accueil Android (par exemple, sous Android 2.0) et avoir une jolie icône en haute résolution.]

    Ceci est une question datée, en tant que telle, la réponse a changé. Chrome sur les nouveaux androïdes a ses propres balises META pour cela. Assurez-vous d’append à l’écran d’accueil et de lancer l’écran d’accueil. Un signet normal n’est pas suffisant. Chrome utilise actuellement quelques-unes des directives Apple, mais les trois en bas sont la magie Android.

             

    Lorsque vous créez un raccourci sur l’écran d’accueil vers un signet, Android utilisera une apple-touch-icon haute résolution:

      

    En ce qui concerne le rest des fonctionnalités, je ne pense pas qu’il soit possible de le faire actuellement sans publier une application Android qui sert de wrapper à votre site Web.

    Cela peut intéresser les lecteurs:

    http://code.google.com/p/android/issues/detail?id=7657

    Dans 2.1-update1, sur le Droid, et je présume que les autres téléphones 2. * OS, lors de l’ajout d’un signet à l’écran d’accueil, l’écran d’accueil affiche uniquement une icône personnalisée si le lien rel = “apple-touch-icon” ou apple-touch -icon-precomposed possède un chemin d’URL FULL.

    J’ai essayé ce qui précède de mon Samsung Galaxy S1

    Cela n’a pas fonctionné pour moi … mais ce qui a fonctionné, c’est d’abord de créer un signet, puis d’append ce signet comme raccourci vers ma maison. Cela a provoqué l’utilisation de l’icône correcte.

    Il existe différents éléments méta que nous pouvons utiliser pour obtenir les meilleurs résultats possibles:

    1a) Tout d’abord, nous devons définir la fenêtre d’affichage de notre application comme suit:

    1b) Il y a un petit hack ici, pour les appareils avec des écrans plus grands (iPhone 5 par exemple):

    Il suffit de le mettre sous l’autre méta et cela fera tout le tour de la magie.

    2) Maintenant que nous avons les bases, nous dirons aux navigateurs mobiles de “lire” notre site Web comme s’il s’agissait d’une application. Il existe deux principaux éléments de méta:


    Cela permettra d’ouvrir notre site Web en mode plein écran et de définir la barre d’état par défaut.

    3) Nous en avons fini avec les méta-éléments “se comporter”, commençons maintenant par nos icons. La quantité d’icons et de lignes de code dépendra totalement de vous. Pour l’image de démarrage, j’ai préféré créer une icône pour chaque résolution, afin que mon “chargeur” ​​agisse de la même manière sur tous les appareils (principalement les appareils Apple). Voici comment je l’ai fait:

     ** 
    ``
    **
    ``
    **
    ``
    **

    **
    ``

    NOTE: Le format doit être PNG et toutes les tailles doivent être respectées, sinon cela ne fonctionnera pas.

    4) Pour finir, nous aurons également besoin de quelques icons pour notre application. Cette icône sera affichée dans le menu des appareils. Voici comment je l’ai fait:

     ** 
    ``
    **
    ``
    **
    ``
    **
    ``

    REMARQUE: Vous pouvez également utiliser “précomposé” pour que votre icône ne soit pas affichée avec le reflet d’iOS. Ajoutez simplement ce mot où vous définissez rel comme tel:

    Comme indiqué, cela fonctionne mieux sur les appareils Apple. Mais l’icône de l’application a été prouvée sur les appareils Android et cela fonctionne.