Fonts webs no estàndard? Ara és possible!

28-10-2009

Existeixen milers de tipografies diferents: clàssiques, modernes, creatives, formals... Malauradament, la immensa majoria de les pàgines web tan sols n'utilitza 3: la Times, l'Arial o la Verdana. Ara, però, podem tornar la llibertat creativa als dissenyadors web sense haver de recórrer a trucs barats...

No obstant, s'han desenvolupat molts sistemes que permeten utilitzar qualsevol altra tipografia en una pàgina web. El sistema més popular és el SIFR, que utilitza la tecnologia flash i javascript, el qual va ser millorat per l'IFR. Per altra banda, utilitzant tan sols javascript, tenim el Cufón i el Typeace.jp. I en un últim grup hi ha el @font-face, del que en va sortir l'Embedded OpenType (EOT) oferint més protecció davant el pirateig de les tipografies.

A El Nucli vam fer un estudi comparatiu per esbrinar quin d'aquests sistemes era el més idoni per implementar en un lloc web. Vam començar observant com afectaven al posicionament als cercadors (posicionament orgànic o natural - SEO) d'una pàgina. Alguns sistemes son molt eficaços en aquest aspecte, mentre altres enterboleixen la bona indexació de les pàgines web. El segon focus d'atenció va ser la compatibilitat entre navegadors, on ens vam detectar algunes incompatibilitats entre sistemes i navegadors.

Seguidament vam observar les recursos del maquinari i xarxa que consumia cada sistema i l'estona que tardava en carregar-se la tipografia. Aqui vam descobrir diferències notòries entre tots els sistemes: des dels que carregaven la tipografia de seguida, fins al que es carregava com a últim element de la pàgina.

Arribats a aquest punt vam veure que encara eren vàlids més d'un sistema. Això ens va fer afegir una altra barrera de segmentació que no haviem contemplat abans: que els textos escrits amb la nova tipografia poguessin ser seleccionables, per tal de que es poguessin fer recerques internes a la pàgina o poguessin ser copiats pels usuaris.

Un cop acabat l'estudi, no hi havia cap sistema que haguès superat totes les nostres exigències. Teníem molt ben valorat el @font-face, que funciona perfectament amb l'última versió de Firefox (3.5), la pròxima versió de l'Opera (10) i el Safari. Però no funciona amb l'Internet Explorer, on si que hi funciona l'EOT (apadrinat per Microsoft, i sotmès a acceptació pel W3C).

Davant d'aquesta situació la sortida més idònia és utilitzar-los conjuntament; de tal manera que s'usa l'un o l'altre en funció del navegador del visitant. En el fons, l'EOT és una simple millora del @font-face pel que fa a la protecció legal de les tipografies. A nivell d'implementació i utilització són quasi iguals.

No obstant, aquesta doble utilització és temporal, ja que a la llarga un dels dos sistemes serà suportat per tots els navegadors. Probablement acabi essent l'EOT, que properament pot esdevenir un estàndard pel W3C. Sigui com sigui, el nucli és capaç d'implementar qualsevol font tipogràfica en un lloc web. D'aquesta forma podem dotar al dissenyador web de més llibertat i creativitat, i oferir al client una major possibilitat de diferenciació del seu projecte, sense penalitzar la indexació, accessibilitat, usabilitat i posicionament del lloc web.

Podeu veure una pàgina amb vàries tipografies de prova a: http://www.webdeprova.com/font/index.html

I no dubteu a consultar-nos per qualsevol dubte o si voleu aprofundir en algun dels mètodes, tant si sou dissenyadors gràfics, dissenyadors web, webmasters o simplement voleu un lloc web diferent, més atractiu i únic.