Há alguns anos, os favicons que haviam perdido muito de sua relevância foram ressuscitados, pois cada vez mais navegadores os suportam e, de fato, os tornam uma parte muito visual da experiência do usuário. Os navegadores de tablets e smartphones também fazem uso desses ícones. Isso levou a uma maior importância da tendo um bom favicon. No entanto, as formas de apresentação desses ícones variam de acordo com o cliente que navega no site. Áreas de trabalho requerem um determinado ícone, Apple dispositivos exigem algo diferente, tamanhos diferentes também complicam as coisas.
Uma solução simples - Free Online Icon Generator para Apple e ícones Favicon
Iconifier.net é uma solução simples que, dado um quadrado JPG, GIF ou PNG, irá gerar um conjunto de ícones de vários tamanhos para que você possa usar e escolher aqueles que deseja apoiar em seu site. Você só precisa fazer o download dos ícones gerados e incorporá-los ao código do seu site. Você pode integrar essas etapas em seu processo de design da web.
Incorpore o (s) ícone (s) de favicons ao seu site
Depois de criar o ícone favicon.ico usando Iconifier.net acima, e colocá-lo na raiz do seu site, adicione o seguinte código entre o e do seu site
A Apple Ícones
Depois de criar os vários ícones usando o site acima, você também terá que incluir um código ligeiramente diferente para Apple Dispositivos iPhone / iPad (e possivelmente Android). Novamente carregue os arquivos de ícone gerados na raiz do seu site e coloque o seguinte código entre as tags HEAD.
<link rel=”apple-touch-icon ”tamanhos =” 114 × 114 ″ href = ”/ touch-icon-114 × 114.png” />
<link rel=”apple-touch-icon ”tamanhos =” 72 × 72 ″ href = ”/ touch-icon-72 × 72.png” />
<link rel=”apple-touch-icon ”href =” / touch-icon-iphone.png ”/>
Dispositivos iOS irão lidar com isso automaticamente em seus navegadores e redimensionar e adicionar alguns efeitos de acordo para que correspondam ao estilo do dispositivo em que estão sendo vistos.
A propósito, ótimos desenvolvedores de iOS e Android não são fáceis de contratar - se você está procurando um bom desenvolvedor de aplicativos e sabe como encontrar um bom candidato nós temos você coberto CollectiveRay. - mostraremos todos os ótimos lugares para encontrar bons candidatos.
Vermelho Mais: Como repor Apple ID e senha se você esqueceu
Ícones para dispositivos Android
Android foi construído com base no Apple toque nos ícones, mas espere que os ícones já estejam em sua versão final. Esta versão final é "PRECOMPOSED" e os dispositivos Android esperam que esta tag esteja no lugar. Portanto, carregue novas versões, com nomes ligeiramente diferentes (como adicionar pré-compostos no nome) e, em seguida, adicione a seguinte marcação. A parte mais importante é o rel =apple-touch-icon-pré-composto. Coloque os arquivos na raiz do seu site e adicione este código entre os e tags do seu html
<link rel=”apple-tocar-ícone-pré-composto ”tamanhos =” 114 × 114 ″ href = ”/apple-touch-icon-114 × 114-precomposed.png ”>
<link rel=”apple-tocar-ícone-pré-composto ”tamanhos =” 72 × 72 ″ href = ”/apple-touch-icon-72 × 72-precomposed.png ”>
<link rel=”apple-touch-icon-precomposed ”href =” / touch-icon-iphone-precomposed.png ”>
Mais detalhes sobre os Favicons podem ser encontrados na Wikepedia: https://en.wikipedia.org/wiki/Favicon
. deixe um útil comente com suas ideias, depois compartilhe com seu (s) grupo (s) do Facebook, que considerariam isso útil e vamos colher os benefícios juntos. Obrigado por compartilhar e ser legal!
Divulgação: Esta página pode conter links para sites externos de produtos que amamos e recomendamos de todo o coração. Se você comprar produtos que sugerimos, podemos receber uma taxa de referência. Essas taxas não influenciam nossas recomendações e não aceitamos pagamentos por análises positivas.
e muitos mais ...