Oprettelse af et brugerdefineret favicon

Indholdsfortegnelse:

Anonim

Jeg vil indrømme noget slags geeky. Jeg kan godt lide favicons. De er sjove. De er et fantastisk brandingværktøj. Og de er noget enkle, som små virksomhedsejere kan gøre for at krydre deres websteder og endda øge brugervenlighed for brugerne.

Hvis du ikke ved, hvad et favicon er, lad mig tilbyde lidt hjælp:

$config[code] not found

Favicons er den mini, 16 × 16 pixel grafik, der repræsenterer dit websted op i adresselinjen, i en brugers liste med bogmærker eller i deres browser faner. De giver dine besøgende mulighed for at skabe en visuel forbindelse med dit websted.

Neat! Hvordan opretter du en?

Design dit favicon:

  • Med hånden: Åbn dit yndlingsgrafikprogram og kom til det. Du vil enten oprette en ny fil, der er 16 × 16 pixel og zoome ind, indtil området er brugbart ELLER åbne et område, der er større, men stadig en slags multipel på 16 × 16. Når du designer din favicon for hånd, skal du bruge noget, der præcist repræsenterer dit mærke - uanset om det er et almindeligt farveskema, firmaets initialer osv. Uanset hvad du laver, skal du stå på de hårde begrænsninger på 16 × 16 pixel.
  • Med værktøjer: Hvis du udfordrer design (ingen bekymringer, er jeg også), er der nogle gode værktøjer, der gør det nemt for selv mennesker som os at skabe gode favikoner. Favicon.cc vil for eksempel give dig nogle strukturer og lade dig bygge din direkte fra deres hjemmeside, eller FavIcon fra Pics giver dig mulighed for at uploade et billede og generere favicon til dig. Enkel!

Gem dit favicon: Når du gemmer din fil, skal du reducere den til 16 bit og gemme som "favicon.ico", hvis du bruger Photoshop eller "favicon.gif" eller "favicon.png", hvis du bruger noget andet. Hvis du bruger Photoshop og vil give dit favicon noget ekstra oomph, anbefales det at downloade pluginet til Windows Icon-filformat, så du kan gemme i ICO-formatet.

Upload dit favicon: Opret forbindelse til din server og upload dit favicon til rodmappen på dit websted. Tilføj derefter følgende HTML-kode til hovedafsnittet på din webside (mellem de to hovedkoder) (vælg din filtype):

Opdater: Når du er færdig, opdater din browser, og du skal se dit favicon vises. Hvis ikke, giv det et par minutter. Nogle gange tager det lidt for alt at synkronisere.

Og det er det! Fire trin, og du har et stort branded favicon, der hjælper brugere med at genkende dit websted i listen over bogmærker eller i deres browser. Ret simpelt, ikke?

Bare for sjov, her er nogle af mine foretrukne favicons på nettet:

  • Michigan fyrværkeri
  • Jeffrey Zeldman
  • Boing Boing
  • Encyclopedia.com
  • Fool.com
  • Michael Grays SEO Blog

Andre personlige favoritter?

17 Kommentarer ▼