bloc@niorcs.com:~$

Etiqueta: firefox

Treient el suc a @font-face de css3

per Dídac el 20.gen, 2010, desat a General

Tinc un problema i es que la majoria de cops no em dona per llegir, tot el que hauria i deixo les coses a mitges. Recentment he tingut un encàrrec d’una plana web i vaig decidir tirar una mica de css3, així començava a experimentar una mica amb ell i em preparava per la seva arribada (jo m’hi preparo, no se si els navegadors faran el mateix …)

Recordava que una de les novetats era la d’incrustar tipografies allotjades al mateix amb l’ordre @font-face i vaig decidir provar-la seguint els exemples que havia trobat per css3.info. Vaig provar-ho amb uns tipus de lletra OpenType, extensió .otf i ho vaig provar amb diferents navegadors, fins descobrir que Firefox 3.5.* ho suportava igual que el Opera 10.* i el Safari 4, evidentment Internet Explorer no.

Vaig deixar-ho una mica a mitges fins que ahir, actualitzant el blogroll em topo amb l’adreça antiga d’ Esbudellant Estàndards, i decideixo cercar la nova per actualitzar-la i, com caigut del cel, l’entrada més recent parla del @font-face.

Sembla ser que problema no és pas que la “majoria” de navegadors no suportin la regla @font-face, el que no suporten és segons quin tipus de lletra.

Per exemple, jo feia ús de la sintaxi més bàsica

@font-face { font-family: Qlassik; src: url('fonts/Qlassik_TB.otf') }

Com us comentava, al tractar-se d’un format OpenTypeen l’article de n’Artnau seria únicament compatible amb Firefox 3.5+, Safari 3.1+ i Opera 10+.

Que fem doncs amb navegadors com Internet Explorer o Chrome?
El mateix n’Artnau ens dona la solució, en el quadre trobem que per exemple Chrome, només suporta tipus SVG Font a partir de la versió 0.3 i TrueType a partir de Chrome 2.0 (cal dir que per defecte esta inhabilitat).

En el cas del Internet Explorer, a partir del Internet Explorer 6 dona suport a Embedded OpenType, extensió .eot

Així doncs, mentrestant els navegadors vagin al seu rotllo, i facin el que els hi roti, haurem d’incrustar diferents tipografies per satisfer les necessitats dels navegadors. Segons l’article de n’Artnau, cito textualment:

“Internet Explorer 8 o inferior no suporten més d’una declaració url() ni la declaració local() en una propietat src. El millor és tractar aquest navegador a part”

O també dona un solució que es el que he provat jo i em funciona perfectament, i valida el css nivell 3 sense problemes

Cal definir amb primera instància i amb url() la d’extensió .eot, com Internet Explorer 8 i inferiors diguéssim que no veuen més enllà de la primera declaració d’ url(), podem ficar les següents per a que els altres navegadors, les acceptin.

@font-face {
font-family: Qlassik;
src: url('fonts/Qlassik_TB.eot');
src: local('Qlassik'),
url('fonts/Qlassik_TB.otf') format('opentype'),
url('fonts/Qlassik_TB.woff') format('woff'),
url('fonts/Qlassik_TB.ttf') format('truetype');
}

L’únic problema és que ens obliga a fer una mica més pesada la fulla d’estil, tampoc ens morirem per un parell de línies més, i carregar el servidor amb més tipus de lletra.

Com ho faig si aquest tipus de lletra només el tinc en format OpenType?

Cap problema, hi han varies eines per la xarxa, només has de cercar una mica, la que més m’ha agradat a mi ha estat Online font converter

Trobaràs més informació en l’article de Esbudellant Estàndards e n’Artnau Siches

Deixar un comentari :, , , , , , , , més...

Puto Wordpress SnapShot

per Dídac el 02.abr, 2009, desat a General

Potser és un dels plugins més horribles que existeixen per a WordPress, amb WordPress SnapShot preview es fa impossible llegir un post d’un bloc sense que et saltin aquelles finestretes (em recorda al Internet Explorer) emergents a la mínima que fem passar el ratolí per un link, horrible!

snap

Solucions?

1) Deixar de visitar el bloc que dongui tant pel cul

2) Instal·lar-se Adblock Plus i configurar-lo per bloquejar d’allà on provenen els snapshots *snap.com

3) Amb el GreaseMonkey (del qual ja n’hem parlat altres cops) trobem l’script GodBye SnapShot!

4 Comentaris :, , , , , , , més...

Els mitjans de comunicació s’auto desactualitzen

per Dídac el 25.mar, 2009, desat a General

M’han arribat veus, que s’ha fet arribar un correu electrònic a diferents mitjans de comunicació de radio televisió catalans demanant explicitament que no s’actualitzés cert programari privatiu, concretament Internet Explorer 6 (navegador del 2001 i recordem que obsolet)  ja que és el que tenen “homologat per a que totes les eines Corporatives funcionin“.

Sembla ser que han tingut problemes concretament amb el nou Internet Explorer 8, a l’hora de “fer algunes feines en programes en antena“.

Realment estan funcionant amb programari obsolet d’aquest tipus? Deixant de banda si es tracta de software privatiu o no la llista de falles de seguretat es bastant llarga (alguns exemples) i l’última actualització de seguretat es de l’agost del 2004 inclosa en el Windows XP Service Pack 2 i el Windows Server 2003 Service Pack 1.

Personalment, crec que una versió d’aquest calibre, hauria d’estarar esborrada de la faç de la terra, i els primers en tenir la culpa són els de Microsoft, els següents els usuaris que permetem baixar-nos els pantalons amb temes tant simples com aquests, com deia l’ Oliana Molls el Capità Enciam, “els petits canvis són poderosos

5.566 Comentaris :, , , , , , , , , , , , més...

Traductor de Firefox amb GreaseMonkey

per Dídac el 03.mar, 2009, desat a General

Llegeixo a Google Dirson que han tret un script per al GreaseMonkey per traduir textes al català (també castellano i galego) només seleccionant el text.

Anem per parts. GreaseMonkey és un complement que permet executar petits scripts programats en javascript, per fer la web més fàcil, des de canviar l’aspecte de certes pàgines web, fins a substituir el reproductor de YouTube. De fet tenim una comunitat bastant gran al darrere, una pàgina plena de repositoris, jo he perdut més d’un diumenge provant i provant scripts.

L’script original, Highlight2Translate, estava fet per traduccions a l’anglès però com podiem llegir al Google Dirson, l’han adaptat al català, castellano i galego i s’està treballant per adaptar-hi l’euskera.

L’script també esta pensant per editar-lo facilment i personalitzar-lo al nostre gust, funciona amb la API Javascript que va llançar Google ja fa un temps que treballava amb Ajax, això permet tenir una ràpida traducció.

Instałlació

El primer que s’ha de fer és instalar-se GreaseMonkey i  reinicia el navegador.

Ara ja podeu instalar els scripts, és molt fàcil fer-ho, amb el GreaseMonkey habilitat (podeu desavilitar-lo molt facilment fent click a l’icona del mico que veureu a baix) feu click als links dels scripts que us porten a l’arxiu .js i s’obrira una finestreta d’instałlació, semblant a la de quan instałleu complements. Us mostrarà en quines pàgines s’executa i accepteu.

greasemonkey-script

Funcionament

Com comentava abans el GreaseMonkey ha d’estar activat i només caldrà seleccionar el text i esperar que aparegui, com si d’un title es tractés, la traducció. Els servidors de Google detectaran l’idioma original i traduiran al del script que tinguem instałlat.

greasemonkey-usant-traductorDoncs res, aquí us deixo els Scripts

1 Comentari :, , , , , , , , , , més...

El meravellos món de les aplicacions portàtils

per Dídac el 25.ago, 2006, desat a General

No dire que fa relativament poc, perquè en aquest món de les noves tecnologies fa poc podriem dir que va ser ahir, van ser una novetat els USB, Pen o com li volgeu dir. N’hi ha de tots els tamanys, colors i gustos i la veritat es que han servit de molt, la tens sempre a mà i pots possar-hi qualsevol cosa.

I la novetat més recent es portar-hi aplicacions que es puguin executar desde la memòria USB, així pots treballar amb les “teves aplicacions” en altres ordinadors.

Per exemple, jo ara tornare a marxar uns dies a Prades i haig d’acabar certes coses, alla hi tenim un ordinador, amb WindowsXP, amb el Internet EKSplorer i parafernalies d’aquestes.

Jo he agafat la meva memoria de 1GB tot cofoi cap a http://portableapps.com i m’he agafat 4 tonteries

Si us adoneu i feu un tomb per la web totes les aplicacions d’aquella web són de codi obert, això facilita als developers, l’adaptació de l’ “aplicació autèntica” a la versio portàtil.

Deixar un comentari :, , , , , més...

Què busques?

Fes servir aquest formulari: