.ico är fortfarande det förväntade formatet i webbplatsens rot, och de flesta nätbaserade konverterare ber dig ladda upp bilden till deras server. Så här skapar du en korrekt favicon.ico i flera storlekar från en PNG, utan att ladda upp något.
En .ico-fil är mer än en bild med nytt namn
Det räcker inte att döpa om logo.png till favicon.ico. ICO är ett containerformat med ett eget filhuvud som anger hur många bilder filen innehåller, deras dimensioner och var varje bild börjar. En omdöpt PNG saknar detta filhuvud och striktare webbläsare vägrar visa den.
En korrekt ICO bäddar in flera upplösningar av samma ikon. Webbläsaren läser filhuvudet, väljer den variant som ligger närmast den önskade storleken och behöver inte förstora något.
Konvertera PNG till ICO i tre steg
Steg ett: förbered källbilden. En kvadratisk PNG på minst 512×512 pixlar ger bäst resultat eftersom alla storlekar skapas genom förminskning. Om bilden har genomskinlig bakgrund bör du redan nu bestämma om den ska behållas. Den passar bra i en flik, men iOS och Android ersätter den med svart.
Steg två: skapa upplösningarna. Filen bör minst innehålla 16×16, 32×32 och 48×48. Storleksändringen måste använda ett omsamplingsfilter av hög kvalitet, annars blir de små storlekarna oläsliga.
Steg tre: packa bilderna. De tre bilderna samlas i en enda ICO-container med ett filhuvud som beskriver varje post. Resultatet placeras i webbplatsens rot med namnet favicon.ico, där webbläsare hittar det även utan en HTML-tagg.
Därför spelar lokal konvertering roll
De flesta PNG-till-ICO-konverterare laddar upp filen till en server som bearbetar den och skickar tillbaka resultatet. Din logotyp, kanske ännu inte offentlig, hamnar på en dator du inte kontrollerar och omfattas av lagringsvillkor du inte har läst.
En modern webbläsare klarar däremot allt själv: avkoda en PNG, ändra storleken på en canvas, koda om varje storlek och bygga ICO-containern. Det är vad LFFavicon gör. Ingen nätverksbegäran innehåller din bild, och allt rensas när du stänger fliken.
Fördelarna är konkreta: konverteringen går direkt, fungerar offline när sidan har laddats och har varken kö eller daglig begränsning.
Enbart .ico räcker inte längre
Att konvertera PNG till ICO täcker flikar och äldre klienter, men lämnar tre sammanhang utan stöd: moderna webbläsare som föredrar en SVG med skärpa i alla storlekar, iOS-hemskärmen som kräver en ogenomskinlig PNG på 180×180 och Android som läser webbmanifestet.
När du ändå bearbetar bilden kan du skapa hela uppsättningen på en gång. Det gör generatorn: en källbild används till .ico, SVG, Apple Touch-ikonen och manifestikonerna, med förhandsvisning av varje sammanhang före nedladdning.
Primärkällor
Vanliga frågor
Vilken PNG-storlek behövs för att skapa en ICO?
En kvadrat på minst 512×512 pixlar. Under 128×128 måste paketets större storlekar förstoras och resultatet blir suddigt. SVG är ännu bättre eftersom formatet saknar upplösningsgräns.
Bevaras transparensen i .ico-filen?
Ja, ICO-formatet stöder en fullständig alfakanal och en genomskinlig PNG förblir genomskinlig i fliken. Var dock uppmärksam på iOS-ikonen: systemet fyller genomskinliga områden med svart, så ge den en bakgrund.
Var ska filen favicon.ico placeras?
I domänens rot, åtkomlig på https://yoursite.com/favicon.ico. Webbläsare och sökrobotar begär enligt konvention just den adressen, även när ingen link-tagg deklarerar den.