Favicon, icône, icône de raccourci, icône tactile d'apple: Y en a-t-il d'autres?


24

Je connais 2 types de base d'icônes Web par défaut pour les sites Web:

  • Favicon : placez un.icofichier formaté à la racine de votre site nomméfavicon.icoet la plupart des navigateurs de bureau le trouveront et l'afficheront dans différents contextes (signets, onglets). Peut également être ajouté dans le code, ce qui vous permet de spécifier d'autres noms et d'autres types de graphiques dans le fichier, bien qu'il existe des limitations de type et de taille pour les navigateurs :

    <link rel="shortcut icon" href="/webmasters//favicon.ico" />
    <link rel="icon" href="/webmasters//favicon.ico" />
    
  • Icône de clip Web : placez unpngfichier formaté appeléapple-touch-icon.pngouapple-touch-icon-precomposed.pngà la racine de votre site et les versions iPhone OS / iOS de Safari les récupèrent et les stockent lorsque le site est ajouté à l'écran d'accueil. Peut également être ajouté avec du code comme:

    <link rel="apple-touch-icon" href="/webmasters//custom_icon.png" />
    

Existe-t-il d'autres graphiques d'icônes par défaut pour un site Web qu'un webmaster peut inclure?

Réponses:


8

Il semble basé sur ceci et cela qu'Android utilisera le reltype de apple-touch-icon-precomposedou apple-touch-icon, MAIS que pour que cela fonctionne, vous devez utiliser une URL complète, par exemple:

<link rel="apple-touch-icon-precomposed"
      href="http://www.example.com/custom_icon.png" />

ou:

<link rel="apple-touch-icon"
      href="http://www.example.com/custom_icon.png" />

La mise en garde est que cela semble être pour la mise à jour 1 d'Android 2.1 et Webkit 3.1 . La documentation du développeur Android mentionne une méthode dans android.webkitcet événement lorsque le apple-touch-iconest récupéré.


1

Cela dépend de la plateforme que vous ciblez. Mais je pense que la plupart des navigateurs mobiles - compatibles standard - comprennent les balises favicon par défaut. Vous pouvez peut-être rechercher des cas d'utilisation spéciaux (par exemple, créer un raccourci sur le bureau avec une icône spéciale) sur des plateformes comme Android, iOS, WebOS, ...

Je viens de développer quelques sites Web ciblant les utilisateurs d'iPhone et sur ces sites, j'ai utilisé Wordpress avec une version spécialisée du thème WPTouch.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.