Olá, estou com a seguinte dúvida, tenho meu site, totalmente responsivo, e para alguns de nossos clientes, nós colocamos um atalho do site no celular, pelo Google Chrome. O atalho funciona mas fica um ícone totalmente aleatório em relação ao meu site.
Quero que funcione como o Tecmundo, Globo.com, todos estes sites, quando vamos adicionar um atalho deles no celular já trás o ícone do site.
Fiz isso mas não deu certo.
<link rel="shortcut icon" type="image/ico" href="images/favicon.ico"/>
Funciona no computador normalmente aparecendo o ícone lá em cima ao lado do título.
SOLUÇÂO
<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />
<!-- Opera Speed Dial Favicon -->
<link rel="icon" type="image/png" href="images/icon/favicon.png" />
<!-- Standard Favicon -->
<link rel="icon" type="image/x-icon" href="images/icon/favicon.ico" />
<!-- For iPhone 4 Retina display: -->
<link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/icon/apple-touch-icon-114x114-precomposed.png">
<!-- For iPad: -->
<link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/icon/apple-touch-icon-72x72-precomposed.png">
<!-- For iPhone: -->
<link rel="apple-touch-icon-precomposed" href="images/icon/apple-touch-icon-57x57-precomposed.png">