Webdesign – Blogg

Cufon – eit lettvint sIFR alternativ?

cufon sifr alternativ

Nokon Kvittra meg om Cúfon ein ny metode for å inkludere spesialfontar i webdesign. Tidlegare har jo sIFR hatt monopol på å benytte trykkfonter på overskrifter og liknande på nettsider. Men sIFR er og blir litt tungvint å implentera i webdesign, ein må til dømes inn i Flash for å klargjere fontfilene før dei kan brukast.

Men Cúfon verkar mykje enklare å implementera, og framstår som eit godt sIFR alternativ. Eg har testa det på bloggen her no, med “Helvetica Neue Ultra Light”. Denne fonten har alltid vore tiltenkt som font i overskriftene, men eg orka ikkje å byrje på nok ein sIFR implementasjon (ikkje at det er forferdeleg mykje jobb, det er berre litt “tetak”). No har eg ila. 30 minutt lese det eg treng å vite om Cúfon, lasta ned javascriptet, generert fontfiler og implementert det i bloggdesignet. 30 min. frå start til slutt på å installere, implementere og teste “text-replacement-script” det kan ein like!

Cúfon baserar seg på javascript og rendringa til nettlesarane i staden for flash-rendring slik som sIFR gjer det. Og er støtta av følgjande nettlesarar* (visse avvik sjølvsagt):

  • Internet Explorer 6, 7 and 8
  • Mozilla Firefox 1.5+
  • Safari 3+
  • Opera 9.5+
  • Google Chrome

Korleis installerar ein Cúfon?

  1. Last ned scriptet
    Det vert anbefalt å bruke den komprimerte versjonen av scriptet
  2. Generer fontfiler ved å laste opp dine filer og køyre dei gjennom generatoren til Cúfon.
    Hugs å sjekke rettighetane for implementering på internett for fonten din før du laster opp.
  3. Last opp cufon.js-fila og din-font-fil.font.js-fila til nettsida di
  4. Inkluder javascriptene i <head>-seksjonen i filene dine
  5. Oppdater nettsida di.

Kan noko so enkelt verkeleg ha teke 3o min?! Dette brukte eg omlag 30 min. på første gong eg testa det

Men eg har 2 ting som eg ikkje var nøgd med.

  1. Lastinga, det tek litt lang tid før den “bytter” fontent din frå standard webfont til spesialfonten. (omlag 1 sek)
  2. Den lagar innrykk(på 3-5px)  i 1. linja til overskriftene i Firefox

Punkt 1 blir forhåpentleg forbetra, kanskje det tom. er noko eg har gått glipp av i dokumentasjonen?
Punkt 2 kan være noko i stilsettet til bloggen min, dette skal eg prøve å sjekke opp i kjapt.

Dette er på ingen måte ein grundig test av Cufon, men ein kort introduksjon og test frå mi side. Kom gjerne med dykkar tilbakemeldingar på Cufon her. Eg vil ha den installert på bloggen i minst. 1 månad, med mindre noko er frykteleg gale for nokre av brukarane..

Les meir om Cúfon her
Generer Cúfon fontfiler her

Del med andre:

  • Digg
  • del.icio.us
  • Facebook
  • Twitthis
  • Google Bookmarks
  • E-mail this story to a friend!
  • LinkedIn
  • Netvibes
  • Reddit
  • RSS

7 Kommentarar »

  1. Hmm, interessant. Kanskje eg skal ta å implementere det i mitt nye design?

    Takk for tipset!

    Kommentar av Espen M. Kvalheim — 12.03.2009 @ 22:26

  2. Fikk samme problem på min side, og det var litt ødeleggende for effekten… tror vi gjorde alt rett.

    Kommentar av Magnus — 12.03.2009 @ 22:36

  3. Espen: nytt design? Steike du skiftar bloggdesign oftare enn.. Spanande å sjå kva du finn på denne gongen.

    Magnus: Ja, det var eit skikkeleg skår i gleden. Trur eg fulgte instruksjonen nokså slavisk. Har sendt ein e-post til dei som står bak for å høyre om det er feil eller om det er slik det skal være..

    Kommentar av Anders-Meyer — 12.03.2009 @ 23:48

  4. Oftare enn underbukse? Vel, skiftar nok oftare underbukse, men det kjem nok ikkje noko nytt design med det fyrste. Den er berre på skissestadiet foreløpig, men er stadig på jakt etter fine funksjonar slik at den vert best mogleg frå dag ein.

    Spennande å høyre kva folka seier om innrykket.

    Kommentar av Espen M. Kvalheim — 13.03.2009 @ 8:00

  5. Annet viktig argument mot er det faktum at du ikke kan markere teksten. Noe jeg personlig er en av de bedre egenskapene med sIFR.

    Noen som har testet hvordan det fungerer med linker? Vet det har vært noe problemer der med sIFR før hvertfall!

    Kommentar av Sebastian Steinmann — 13.03.2009 @ 8:36

  6. Jeg tipper det er HTML koden din som spiller deg et puss og gir deg det ekstra mellomrommet i headingene. Om du ser på headingene dine i sidebaren er det ikke noe mellomrom på de.

    Tok en titt i sourcen din og ser at H2 som du får mellomrom på, spanner over flere linjer, og det er nok derfor Cufon setter inn en canvas med kun en space i (om du ser på den genererte koden med Firebug og Inspect Element). Om du trimmer opp HTML koden din så forsvinner nok mellomrommet.

    Ellers takk for fint tips, ser ut som en feiende flott måte å fikse fine fonter på, og langt bedre enn sIFR på mange måter (selv om text-selection hadde vært fint). Heldigvis står det at de jobber med den saken og at de har kode som funker i alt annet enn Opera.

    Kommentar av Anders S. Øfsdahl — 17.03.2009 @ 10:07

  7. Den store, og dårlige forskjellen med Cufon og sifr er at med Cufon får man ikke markert teksten i nettleseren. Mange gjør faktisk det så dette er litt klønete. Med sifr går det veldig fint.

    Jeg syns derimot at Cufon er mye enklere å tune enn sifr. Pen og ren CSS løser det meste her.

    Lastingen er en ting men bruker man dette på en site og skrur på caching er dette problemløst :)

    Kommentar av Per Allan — 9.11.2009 @ 10:29

RSSfeed. TrackBack URL

Skriv ein kommentar

RSS Feed