Favicon, icona, icona scorciatoia, icona apple-touch: ce ne sono altre?


24

Conosco 2 tipi base di icone Web predefinite per i siti Web:

  • Favicon : posiziona un.icofile formattato nella radice del tuo sito denominatofavicon.icoe la maggior parte dei browser desktop lo troverà e lo visualizzerà in vari contesti (segnalibri, schede). Può anche essere aggiunto nel codice, che consente di specificare altri nomi e altri tipi di grafica nel file, sebbene ci siano limitazioni di tipo e dimensione per i browser :

    <link rel="shortcut icon" href="/webmasters//favicon.ico" />
    <link rel="icon" href="/webmasters//favicon.ico" />
    
  • Icona Clip Web : posiziona unpngfile formattato chiamatoapple-touch-icon.pngoapple-touch-icon-precomposed.pngalla radice del tuo sito e le versioni di Safari OS / iOS di iPhone li raccoglierà e li memorizzerà quando il sito viene aggiunto alla schermata principale. Può anche essere aggiunto con un codice come:

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

Esistono altre icone grafiche predefinite per un sito Web che un webmaster può includere?

Risposte:


8

Essa appare basa su questo e questo che Android utilizzerà il reltipo di apple-touch-icon-precomposedo apple-touch-icon, MA che per farlo funzionare è necessario utilizzare un URL completo, ad esempio:

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

o:

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

L'avvertenza è che questo sembra essere per Android 2.1 aggiornamento 1 e Webkit 3.1 . La documentazione per sviluppatori Android menziona un metodo android.webkitche è un evento quando apple-touch-iconviene recuperato.


1

Questo dipende dalla piattaforma scelta come target. Ma penso che la maggior parte - compatibile standard - i browser mobili capisca i tag favicon predefiniti. Forse puoi cercare casi d'uso speciali (ad es. Creare un collegamento sul desktop con un'icona speciale) su piattaforme come Android, iOS, WebOS, ...

Ho appena sviluppato alcuni siti Web destinati agli utenti iPhone e su questi siti ho usato Wordpress con una versione specializzata del tema WPTouch.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.