Pergunta

Como faço para definir o ícone que aparece corretamente no iPhone para os sites que criei?

Foi útil?

Solução 3

Veja o Especificando um ícone de página da Web para Web Clip seção do Configurando aplicativos da Web página do Guia de conteúdo da web do Safari no Biblioteca de referência do Safari...

Especificando um ícone de página da Web para Web Clip

Nota do sistema operacional do iPhone: O recurso de clipe da web está disponível no iPhone OS 1.1.3 e posterior.O apple-touch-icon-precomposed.pngO nome do arquivo está disponível no iPhone OS 2.0 e posteriormente.

Você pode querer que os usuários possam adicionar seu aplicativo da web ou link da página da web à tela inicial.Esses links, representados por um ícone, são chamados de clipes da web.Siga estas etapas simples para especificar um ícone para representar seu aplicativo ou página da web no sistema operacional do iPhone.

  • Para especificar um ícone para todo o site (todas as páginas do site), coloque um arquivo de ícone no formato PNG na pasta ROOT Document chamada apple-touch-icon.png ou apple-touch-icon-precomposed.png.Se você usar apple-touch-icon-precomposed.png Como o nome do arquivo, o Safari no iPhone OS não adicionará efeitos ao ícone.

  • Para especificar um ícone para uma única página da web ou substituir o ícone do site por um ícone específico da página da web, adicione um elemento de link à página da web, como em:
    <link rel="apple-touch-icon" href="/custom_icon.png"/>
    No exemplo acima, substitua custom_icon.png com seu nome de arquivo de ícone.Se você não deseja o Safari no iPhone OS para adicionar efeitos ao ícone, substitua apple-touch-icon com apple-touch-icon-precomposed.

Ver "Crie um ícone para seu aplicativo ou página da Web" em Diretrizes de interface humana do iPhone para aplicativos da Web para métricas de ícones de páginas da web.

Outras dicas

E para completar, um link para a postagem de Scott Hanselman, que também contém algumas dicas adicionais:

Adicione ícones da tela inicial do iPhone e ajuste o ViewPort

Na página Apple Developer Connection Safari Web Content Guide para iPhone Especificando um ícone de página da Web para Web Clip...

O usuário pode adicionar um link de aplicativo ou página da web à tela inicial.Esses links, representados por um ícone, são chamados de clipes da web.Siga estas etapas simples para especificar um ícone para representar seu aplicativo ou página da web no iPhone.

Para especificar um ícone para todo o site (todas as páginas do site), coloque um arquivo de ícone no formato PNG na pasta ROOT Document chamada Apple-Touch-icon.png.

Para especificar um ícone para uma única página da web ou substituir o ícone do site por um ícone específico da página da web, adicione um elemento de link à página da web como em:

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

No exemplo acima, substitua Custom_ICon.png pelo seu nome de arquivo de ícone.

Consulte "Crie um ícone para o seu aplicativo ou página da web" nas diretrizes de interface humana do iPhone nas diretrizes de interface humana do iPhone para métricas de ícones da página da web.

Observação:O recurso de clipe da web está disponível no iPhone 1.1.3 e posterior.

Adicione isto na sua seção principal:<link rel="icon" href="/your-icon-url"/>

Sugeri que o Stack Overflow implementasse um ícone de toque de maçã:

Adicione um ícone de toque de maçã para Safari no iPhone

Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow
scroll top