Hello mug

Quotes and Accents

(& Dashes)

Beautiful web type — the best typefaces from the Google web fonts directory

A showcase of the best typefaces from the Google web fonts directory.

I font di Google non sono male. Ma come si vede nella pagina linkata, il grosso del lavoro per farli apparire belli è nella scelta del layout e dei colori.
È il web, baby. Non basta un font a rendere una pagina più carina, può essere come mettere un papillon sopra un pigiama.

Elusive icons, an icons font designed for use with Bootstrap

In formato webfont e .svg così potete, volendo, modificarle e condividerle (è un progetto su Github). Non sono tutte bellissime, ma tra 268 glifi qualcuno utile e carino c’è sempre e fa comodo.

Photoshop CS6 improvements

Io l’articolo lo segnalo ma non l’ho letto se non sommariamente, come sempre :)) Mica c’è ancora una palette caratteri utile che non obblighi a fare copia&incolla da Illustrator?
Con quella del Mac, per la cronaca, PS non funziona se i glifi non hanno indice Unicode. In Windows una palette caratteri equiparabile (con accesso alle ficiur Open Type) nemmeno esiste, chi ci lavora starà aspettando con ancora più, ah, aaansia.

Webfont & Firefox, più altre minuzie

Ho speso un paio d’ore a fare prove di conversione da font open type/true type a webfont (nei vari formati), provando con FontXchange e con vari servizi online. Qualche post sotto citavo Fontsquirrell (che converte in base64, come piace a Firefox), ma l’output è indigesto ad iOS (che visualizza gli .svg). Allora ho provato il primo che mi è capitato a tiro, Font2Web, e sorpresa, i font vengono visti su iOS. Ma non più su Firefox.

Insomma ora i font vanno perfetti su Webkit (anche Canary), persino su Opera (dove noto che vengono caricati prima i font di default/fall-back e poi i webfont), ma su Firefox sono del tutto andati (screenshot).
Su iOS, League Gothic (titoli e meta) si fotte quando è settato in small caps :)) Perchè il font non li ha di per sè, suppongo (e infatti la visualizzazione degli small caps è approssimativa ovunque). I titoli dei link post vengono visualizzati quindi (quindi?) in… Georgia? O Georgia o PolyRegular, troppo complicato verificare su iOS. Il fall-back sarebbe Varela Round, un Google font, e i Google fonts sono tutti bulletproof, vanno ovunque. Ma Safari mobile non lo prende quando è in fall-back, mentre lo visualizza correttamente quando è impostato come primo font (i link qui a sinistra). Sembra invece che si peschi il font che è primo nella cascata css, quindi PolyRegular (o il fall-back Georgia).

Tutto questo si risolve con TypeKit o FontDeck, ma non voglio spendere un euro per un sito che uso come giocattolo e non fa accessi. E poi mi piaceva il combo League Gothic + Poly Regular/Italic. Poly è splendido, è un lavoro per una tesi di laurea di un designer argentino, ma non ha un supporto estesissimo a tutte le lingue. Con l’italiano, casca sugli accenti. Sigh. Di League Gothic non ho un sostituto degno, ho fatto qualche prova e nessuno che sia equiparabile come proporzioni, tutti con x-height troppo più basso, anche i compressed.

Per ora non ho idea (e voglia!!) di che altro posso provare per far andare questi webfont su Firefox. Posso provare altre conversioni, ma ormai mi pare che se sistemi una cosa ne scombini un’altra. Dover scegliere se supportare Firefox o iOS (e nemmeno perfettamente, su iOS) per me è fin troppo facile… Ammazzerei subito Firefox :) MA.

UPDATE

Ho sostituito Poly con la versione distribuita da Google fonts. Firefox in questa salsa lo vede regolarmente. Il problema quindi è tutto nel come si convertono i file, visto che quelli di Poly forniti in kit da usare con @font-face non andavano (parlo sempre di Firetox, Webkit era ok).
Per League Gothic, ho risolto di rinunciare agli small caps e fare gli h2 dei link post direttamente in maiuscolo. Compromessi o sconfitte? 

Original Macintosh fonts

The Macintosh was an early example of a mainstream computer using fonts featuring characters of different widths, often referred to as proportional fonts. Previously, most computer systems were limited to using monospaced fonts, requiring, for example, i and m to be exactly the same width. Vector-based fonts had yet to make an entrance in the personal computer arena, at least for screen use, so all the original Mac’s typefaces were bitmaps. Fonts were available in multiple sizes; those sizes installed on a system would be displayed in the font menu in an outline style.

@font-face rendering

Con Firefox mille problemi. È schizzinoso sul file location, se i file non sono nella root del sito non li carica. Idem, root o meno, se sono dichiarati in @media screen. Idem se i webfont non sono encodati in base64. Fontsquirrel fornisce un servizio di conversione di font in webfont che usa questo encoding. Ho testato file generati con FontXChange (quello che uso quando mi do alle sperimentazioni di font illegali prima di comprare l’eventuale licenza) o forniti direttamente in un kit: effettivamente, non li digerisce. FontXChange inoltre genera un .css con sintassi un po’ approssimativa che già da sola impedisce la visualizzazione su Firefox (anche con conversioni corrette). Gli stessi file convertiti con Fontsquirrel, in base64, vanno. 

Safari:

Chrome Canary (webkit filters sulle immagini)

Opera Next!

Firefox:

E tra l’altro, you get what you pay for:

Entypo - 100 carefully crafted pictograms

Carini. E questi non solo in .otf (che è anti-semantico), ma anche in onesto .eps :)