Provare un font senza installarlo
Si può provare ad utilizzare un font senza installarlo sul computer? A quanto pare sì, grazie ai Css e a un browser web. Una volta scaricato il file sul proprio computer, si crea una pagina web (si può fare anche con blocco note scrivendo <html><head><style></style></head><body></body></html> e salvando il file come .html anziché come .txt) e si imposta lo stile, inserendo questo testo tra i tag giusti:
@font-face{
font-family: “prova”;
src: url(“nome-del-file.ttf”)
}
Ovviamente l’url deve essere l’esatto nome del file, mentre il nome della famiglia può essere scelto a piacimento.
Dopodiché si stabilisce che il tipo di carattere “prova” sia da usare per il testo della pagina (che va poi inserito tra le tag del corpo). Esempio:
body{
font-family: “prova”;
}
Chiaramente usando le opportune opzioni si può variare la grandezza e il colore.
Se non c’è un testo della pagina da visualizzare, ma vogliamo provare a scrivere alcune parole mano mano che ci vengono, possiamo inserire nel corpo della pagina una casella:
<body>
<textarea autofocus="" class="casella" cols="30" rows="30"></textarea>
</body>
E scegliere il font da usarsi nell’elemento (da inserire in aggiunta nella sezione <style>):
.casella{
font-family: “prova”;
font-size: 48px;
}
Qualche tempo fa mi pare che in Firefox scattava l’errore “cross origin request blocked”, se non sbaglio, ma nella versione attuale il problema non si presenta.
Per un nuovo font scaricato e che si vuole provare senza installarlo, basa riutilizzare la stessa pagina, cambiando il nome del file nell’apposita riga
@font-face{
font-family: “prova”;
src: url(“nome-del-file.ttf”)
}
Ovviamente l’url deve essere l’esatto nome del file, mentre il nome della famiglia può essere scelto a piacimento.
Dopodiché si stabilisce che il tipo di carattere “prova” sia da usare per il testo della pagina (che va poi inserito tra le tag del corpo). Esempio:
body{
font-family: “prova”;
}
Chiaramente usando le opportune opzioni si può variare la grandezza e il colore.
Se non c’è un testo della pagina da visualizzare, ma vogliamo provare a scrivere alcune parole mano mano che ci vengono, possiamo inserire nel corpo della pagina una casella:
<body>
<textarea autofocus="" class="casella" cols="30" rows="30"></textarea>
</body>
E scegliere il font da usarsi nell’elemento (da inserire in aggiunta nella sezione <style>):
.casella{
font-family: “prova”;
font-size: 48px;
}
Qualche tempo fa mi pare che in Firefox scattava l’errore “cross origin request blocked”, se non sbaglio, ma nella versione attuale il problema non si presenta.
Per un nuovo font scaricato e che si vuole provare senza installarlo, basa riutilizzare la stessa pagina, cambiando il nome del file nell’apposita riga
Commenti
Posta un commento