"Hva nå?", tenker du kanskje når du leser overskriften.
Hva er favicon?
De fleste brukere av internett i dag kjører på nettlesere som er fanebasert, og for enkelte av oss kan det fort bli veldig mange faner.
Facebook, twitter, linkedIn, google, Adobe, listen kan bli ganske lang etter en kveld med mye surfing og problemløsing. Mange av disse sidene har egne små ikoner. Dette er det som kalles favicon. Når eg startet jakten på hvordan dette skulle legges inn på en side trodde dumme meg at dette var så enkelt som å legge en <img... inn i <title>-taggen.
Den gang ei.
Så var jakten i gang, uten at eg da visste at det var det som var kalt favicon. Så det ble google søk med image og title og ingen av resultatene ga meg helt det eg ville, før eg tilfeldigvis ramlet inn på en side som omtalte elementer man kan ha i <head>-taggen.
Først fant eg en side som fortalte meg at det var bare å laste opp et bilde til en online tjeneste og konvertere det, prøvde det, fikk ned en fil og var like langt. Etter litt mer leting fant eg ut at et slikt bilde må være 16x16, ha en oppløsning på 72 pixels/inch, en farge oppløsning på RGB Color / 16 Bit, en bakgrunn som er hvit eller gjennomsiktig og være lagret som en .ICO fil. Dette er en oppgave for Photoshop tenkte eg...
Tidligere i vår pga studiene mine inngikk eg en studentavtale med Adobe om Photoshop CC. Så eg satte i gang programmet, la inn innstillingene og begynte å designe, bare for å IKKE finne hvordan eg skulle lagre det som en .ICO fil. Etter mye leting og lesing på forumer fant eg ut at nå prøver eg en online tjeneste.
Tjenesten eg fant var http://www.favicon.cc/ som viste seg å ha et veldig greit brukergrensesnitt som gjør at man kommer igang med det samme. Samtidig som man designer får man se kordan det vil se ut
Det fine med denne er at den utvikler seg i takt som man legger inn designet. Måten man gjør det er å finne den heksadesimale fargekoden man skal bruke, og så kan man som eg gjorde bygge den opp brikke for brikke. I og med at dette er et veldig lite bilde så går det greit å gjøre det på den måten.
Etter å ha lastet opp bildet til serveren eg benytter var det å forsøke å oppdatere Chrome, Internet Explorer (uten hell), som eg har skrevet om i andre blogginnlegg så er det ikke alle nettlesere som reagerer likt på samme kode, så man må ta høyde for slike ting når man utvikler. Mozilla Firefox derimot aksepterte koden eg brukte og eg fikk frem mitt favicon der.
Enden på visen er at eg nok må lete meg frem til en kode som fungerer.
Har du et godt svar så ta gjerne å lim det inn som en kommentar!
...og jakten fortsetter...
Om eg ikke blir brutt opp i bits eller inntar en binær form så vil det snart komme en ny blogg med nye erfaringer fra Mitt IT-eventyr!
Ingen kommentarer:
Legg inn en kommentar