Sådan laver du et Favicon og uploader det

Et favicon er det lille billede på 16×16 pixels som du kan ved siden af en hjemmesidens titel i din browser. Ikonet bliver også vist når du tilføjer en hjemmeside til din favoritter. Nogle kalder dem også bogmærke ikoner.

Fordelen ved at have et favicon er brugerne lægger mere mærke til din hjemmeside i deres favoritter. Samtidig gør et favicon det lettere at finde din hjemmeside når brugeren har mange faneblade åbne i deres browser. På webdesigner.dk har jeg et blåt “w” som favicon.

Guide til hvordan du uploader dit eget favicon

Den nemmeste måde at lave et favicon på ved at bruge et online værktøj. Du kan også lave et i PhotoShop, men dette kræver at du henter et plugin og så selvfølgelig at du har programmet.

Sådan laver du et favicon

Det første du skal gøre er at lave dit icon. Du kan godt gøre dette i paint, men det kan anbefales at hente et program som GIMP, da det giver langt bedre muligheder for at designe dit ikon.

Tip: du kan også designe dit ikon direkte på favicon-generator.org. Dette gøres under Editor og herved behøver du ikke et billedbehandlingsprogram som Photoshop eller GIMP.

Dit ikon skal være 16 x 16 pixels. Ellers vil det ikke virke når du senere uploader det til din hjemmeside. Det er dog en godt ide at arbejde med et lidt større billede og så efterfølgende skalere det ned. Dette kan gøres i GIMP med et par enkelte klik.

Det er en rigtig god ide at du sørger for at holde dit favicon så simpelt som muligt. 16×16 pixels er ikke ret meget og er der for mange detaljer bliver nærmest umuligt at se hvad det forestiller.

Efter du har lavet dig et ikon på 16×16 pixels skal du blot gemme det som en gif, men ændre endelsen på filen så filen hedder “favicon.ico”.

Vil dit billedbehnandlingsprogram ikke lade dig gemme som .ico, kan du omdøbe filen efterfølgende. Dette kan f.eks. let gøre i ToTal Commander, so er beskrevet nærmere herunder.

Upload af favicon.ico

Det eneste du mangler nu er at uploade dit favicon til på dit webhotel. Til dette skal du bruge et FTP program. Jeg bruger selv Total Commander til at upload filer med. Er du i tvivl om hvordan du bruger et ftp program kan du læse mere om det under hvad er et FTP Program.

Efter du er logget på din FTP server skal du uploade filen “favicon.ico” til roden af din hjemmeside. Ligger din hjemmeside hos Simply skal du altså gå ind i biblioteket /public_html og efterfølge uploade dit ikon.

Bemærk at nogle temaer i WordPress også kræver at du uploader dit favicon under det pågældende tema. Bruger du f.eks. et Genesis tema på din WordPress hjemmeside skal du gå ind under /public_html/wp-content/themes/navnet på det tema du bruger/images/. Overskriv nu den favicon.ico fil der ligger her.

Hvorfor kan jeg ikke se mit favicon selvom jeg har uploadet det?

Kan du efter upload ikke se dit nye favicon skal du gå ind og slette cachen i din Browser. Din browser har nemlig gemt dit nuværende ikon i sin cache og et normalt “Reload ” af din hjemmeside vil ikke være nok til at det nye ikon indlæses. Nogle gage vil et inkognitovindue også kunne gøre tricket.

Du kan også prøve at gå ind på din hjemmeside gennem en anden browser end den du plejer eller fra en anden computer. Dit nye favicon skulle derved gerne vise sig med det samme.

12 kommentarer til “Sådan laver du et Favicon og uploader det”

  1. Jeg kan simpelthen ikke få det til at virke. Jeg har downloaded Total Commander og jeg har lavet mit logo i de rette pixels, jeg har uploadet mit favicon.ico til webhotellet og der sker INTET.
    Jeg har slettet cache og jeg har prøvet at sætte linket fra favicon-generator.org ind der hvor man kan skrive url på favicon i temaets header (Udseende –> Theme Options –> Header), men der hjælper lige lidt…
    Vær sød at forklare mig hvad jeg gør galt, for det her er da dybt frustrerende!

    Mvh Camilla

    Svar
      • Jeg forsøgte i temaet SuevaFree, men nu har jeg skiftet til Sugar and Spice, og her har jeg ikke forsøgt endnu, før jeg fik en mulig forklaring på, hvad jeg gjorde galt.. Webstedet hedder: cafeilskov.dk

        Svar
        • Nu har jeg prøvet i det nye tema, men det virkede ikke i Total Commander, i stedet virkede det da jeg lagde mit favicon ind i medier, for derefter at lægge det op under Theme Options og Custom Favicon :-)

          Svar
  2. Super godt beskrevet. Nu er mit eneste problem, at jeg ikke kan uploade favicon på wix.com?
    Hvad kan problemet være her?

    Svar
    • Jeg kender ikke ret meget til wix, men måske det skyldes er en begræsning i deres opsætning.

      Jeg kan i øvrigt anbefale dig at tage et nærmere kig på WordPress, da WordPress giver dig meget bedre kontrol over din hjemmeside, bedre SEO og langt flere muligheder end de mange forskellige sitebuilders der findes på markedet (herunder wix) :-)

      Svar
      • Hej.
        Jeg fandt en Wix funktion, hvor jeg blot skulle uploade en JPG fil og så ordnede Wix resten. Nemt.
        Jeg har prøvet wordpress flere gange, og det tiltaler mig ikke.
        Tak for svar :-)

        Svar
        • Hej!
          Jeg er rigtig glad for mine favicons! Men nu er det forsvundet fra min ene hjemmeside… http://bureaucousines.com/
          det ligger ellers det rigtige sted og jeg har forsøgt at slette caches og cookies etc…er der nogen andre ideer til hvorfor det ikke bliver vist?
          vh
          julie

          Svar
          • Hej Julie. Det skyldes noget i koden der genereres af det CMS du bruger. Hvis man vælger “vis kilde” kan man nemlig godt se dit favicon. Jeg ville derfor søge på Google efter “missing favicon” + det CMS du har installeret. :-)

            Svar
  3. Tak, meget nyttig artikel.

    Det er også meget fedt at favicon-generator.org laver iconer som bruges når der fx oprettes en genvej på ipad/iphone hjemmeskærm.

    Svar

Skriv en kommentar