[Como] Criar um Favicon e Apple Ícone para o seu site

Apple iPad / iPhone

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. 

 

Conteúdo[Mostrar]

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

O 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.

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 ícones de toque, 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. Então carregue novas versões, com nomes ligeiramente diferentes (como adicionar pre-composed no nome) e então adicione a seguinte marcação. A parte mais importante é o rel=apple-touch-icon-precomposed. Coloque os arquivos na raiz do seu site e adicione este código entre o e tags do seu html

Mais detalhes sobre os Favicons podem ser encontrados na Wikepedia: https://en.wikipedia.org/wiki/Favicon

Sobre o autor
David Attard
David trabalha na indústria online e digital ou em torno dela há 21 anos. Ele tem vasta experiência nas indústrias de software e web design usando WordPress, Joomla e nichos que os cercam. Ele trabalhou com agências de desenvolvimento de software, empresas internacionais de software, agências de marketing locais e agora é Chefe de Operações de Marketing na Aphex Media – uma agência de SEO. Como consultor digital, seu foco é ajudar as empresas a obter uma vantagem competitiva usando uma combinação de seus sites e plataformas digitais disponíveis atualmente. Sua combinação de experiência em tecnologia combinada com uma forte visão de negócios traz uma vantagem competitiva aos seus escritos.

Mais uma coisa... Você sabia que as pessoas que compartilham coisas úteis como esta postagem também parecem FANTÁSTICAS? ;-)
. 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.

 

quem somos nós?

CollectiveRay é administrado por David Attard - trabalhando dentro e ao redor do nicho de web design por mais de 12 anos, oferecemos dicas práticas para pessoas que trabalham com e em sites. Também administramos DronesBuy.net - um site para entusiastas de drones.

David Attard

 

 

Autor (es) em destaque em:  Logotipo da revista Inc   Logotipo do Sitepoint   Logotipo do CSS Tricks    logotipo do webdesignerdepot   Logotipo WPMU DEV   e muitos mais ...