El .ico continua sent el format esperat a l'arrel d'un lloc web i la majoria de conversors en línia et demanen que pugis la imatge al seu servidor. Aquí expliquem com obtenir un favicon.ico correcte amb diverses mides a partir d'un PNG, sense pujar res.
Un .ico no és simplement una imatge amb un altre nom
Canviar el nom de logo.png a favicon.ico no és suficient. ICO és un format contenidor amb capçalera pròpia: descriu quantes imatges inclou, amb quines dimensions i on comença cadascuna dins del fitxer. Un PNG amb el nom canviat no té aquesta capçalera i els navegadors més estrictes es neguen a mostrar-lo.
Un ICO correcte incorpora diverses resolucions de la mateixa icona. El navegador llegeix la capçalera, tria la variant més propera a la mida que necessita i no amplia cap imatge.
Converteix un PNG a ICO en tres passos
Primer pas: prepara l'origen. Un PNG quadrat d'almenys 512×512 píxels dona el millor resultat, perquè totes les mides s'obtenen reduint-lo. Si la imatge té un fons transparent, decideix ara si el vols conservar: és perfecte per a una pestanya, però iOS i Android el substituiran per negre.
Segon pas: genera les resolucions. El fitxer ha de contenir com a mínim 16×16, 32×32 i 48×48. El canvi de mida ha de fer servir un filtre de remostreig de qualitat; altrament, les mides petites es tornen il·legibles.
Tercer pas: empaqueta-les. Les tres imatges es munten en un únic contenidor ICO amb una capçalera que descriu cada entrada. El resultat es col·loca a l'arrel del lloc amb el nom favicon.ico, on els navegadors el troben fins i tot sense etiqueta HTML.
Per què és important convertir en local
La majoria de conversors de PNG a ICO pugen el fitxer a un servidor, que el processa i retorna el resultat. El teu logotip, sovint abans que s'hagi fet públic, acaba en una màquina que no controles, sota una política de conservació que no has llegit.
Tanmateix, un navegador modern ho pot fer tot sol: descodificar un PNG, canviar-ne la mida en un canvas, tornar a codificar cada mida i muntar el contenidor ICO. És el que fa LFFavicon. Cap petició transporta la teva imatge i, en tancar la pestanya, tot s'esborra.
L'avantatge no és només teòric: la conversió és instantània, funciona sense connexió un cop carregada la pàgina i no hi ha cues ni límits diaris.
El .ico ja no és suficient per si sol
Convertir el PNG a ICO cobreix les pestanyes i els clients antics, però deixa tres contextos sense cobrir: els navegadors moderns, que prefereixen un SVG nítid a qualsevol mida; la pantalla d'inici d'iOS, que necessita un PNG opac de 180×180, i Android, que llegeix el manifest web.
Com que ja estàs processant la imatge, genera tot el conjunt d'una sola vegada. Això és el que fa el generador: un únic origen alimenta el .ico, l'SVG, la icona Apple Touch i les icones del manifest, amb una previsualització de cada context abans de baixar el paquet.
Fonts primàries
Preguntes freqüents
Quina mida de PNG cal per crear un ICO?
Un quadrat d'almenys 512×512 píxels. Per sota de 128×128, les mides més grans del paquet s'han d'ampliar i el resultat es veu borrós. Un SVG encara és millor, perquè no té límit de resolució.
Es conserva la transparència al .ico?
Sí, el format ICO admet un canal alfa complet i un PNG transparent continua sent transparent a la pestanya. Però vigila amb la icona d'iOS: el sistema omple les zones transparents de negre, de manera que cal donar-li un fons.
On s'ha de posar el fitxer favicon.ico?
A l'arrel del domini, accessible a https://yoursite.com/favicon.ico. Els navegadors i rastrejadors demanen aquesta adreça exacta per convenció, encara que cap etiqueta link la declari.