O Ícone de toque da Apple , também conhecido como arquivo apple-touch-icon.webp, é usado como ícone de página da web no Apple iPhone, iPod Touch e iPad, assim como o Favicon. Este símbolo é utilizado sempre que um usuário adiciona um site aos favoritos ou adiciona-o à tela inicial. Esses produtos da Apple recorrem a um instantâneo do site, que geralmente é pouco mais que um quadrado branco se o arquivo não puder ser localizado.
A menos que o local seja fornecido no HTML, esse arquivo deve ser um.webp com dimensões 57 por 57 e estar localizado no diretório inicial. Uma ilustração da aparência dessa tag em seu HTML é mostrada abaixo.
|_+_|Como criar um ícone Apple Touch de um site responsivo?
Um ícone Apple Touch é utilizado quando um consumidor salva seu local na rede Internet para a tela inicial do dispositivo iOS com tela de toque ou marcá-lo como favorito. A Apple usará uma captura de tela do seu site como um ícone se você não especificar um, o que frequentemente resulta em um quadrado irreconhecível. Mostraremos como desenvolver um ícone Apple Touch exclusivo para o seu site fácil de usar, para que você não force seus clientes a ver um ícone da Apple abaixo da média.
Faça um ícone do Apple Touch
Seu Apple Touch Icon deve ser feito no Photoshop ou outro editor de imagens na fase inicial. O arquivo deve ser salvo como 'apple-touch-icon.webp' e deve ter 180 por 180 pixels de tamanho.
Adicione o arquivo de ícone do Apple Touch do seu site.
A próxima etapa é fazer upload do documento Apple Touch Icon para o seu site. Você pode colocá-lo onde quiser, mas recomendamos armazená-lo em sua pasta principal de imagens. Como iremos utilizá-lo na próxima fase, acompanhe onde você armazenou seu arquivo.
Ao utilizar um elemento Link, defina seu ícone Apple Touch.
A última etapa é identificar e nomear seu ícone Apple Touch mais recente em um elemento de link que você adiciona ao elemento HEAD de sua página.