A sinistra è firefox 4, a destra è chrome 12. C'è un modo per far sì che chrome renda i font più belli?
L'immagine sopra è stata presa su windows xp. Sotto c'è un altro esempio da windows 7.
Controlla le impostazioni di ClearType - lo screenshot di Chrome sembra che sia forzato a rendere non-anti-alias. Questo ucciderà quasi tutti i font web, dal momento che non hanno suggerimenti monocromatici (per ragioni di dimensioni, tra le altre cose). Ero solito vedere questo riportato come “IE rende meglio il testo”, perché ignora le impostazioni ClearType a livello di OS e lo attiva di default.
Tutte queste risposte sono sbagliate! Questo è un grosso bug in Google Chrome, si prega di vedere il bug report/thread ufficiale che include molti screenshot qui: Official bug report on Chrome Code
Attualmente il miglior workaround è semplicemente dare al tuo elemento/titolo questa semplice regola:
-webkit-text-stroke: 1px
Addition from Dr John: ho trovato un suggerimento che anche html { -webkit-text-stroke: 0.25px} potrebbe funzionare - l'ho trovato qui https://groups.google.com/forum/?fromgroups#!topic/mathjax-users/dV_TmJ1QMO4
Chrome sta leggendo l'impostazione ClearType che su Windows XP è disattivata di default.
Per risolvere il problema, prima chiudi il browser Chrome.
Ora clicca con il tasto destro del mouse su un punto qualsiasi del desktop e seleziona ‘Proprietà’ dal menu a tendina.
Clicca sulla scheda ‘Aspetto’ che si trova in alto nella nuova finestra.
E clicca sul pulsante ‘Effetti’.
La seconda opzione in basso dovrebbe dire: “Usa il seguente metodo per smussare i bordi dei caratteri dello schermo”.
Seleziona l'opzione “ClearType”.
Clicca su Applica e riapri il tuo browser Chrome.
D'ora in poi Chrome renderà i tuoi font con un buon anti-alias per quell'effetto liscio.
Mettete il file SVG più in alto nella regola css del font-face, o il 1° o il 2° per esempio:
@font-face {
font-family: 'gothbook';
src: url('fonts/gothamrnd-book-webfont.eot');
src: url('fonts/gothamrnd-book-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/gothamrnd-book-webfont.svg#GothamRoundedBookRegular') format('svg'),
url('fonts/gothamrnd-book-webfont.woff') format('woff'),
url('fonts/gothamrnd-book-webfont.ttf') format('truetype');
font-weight: normal;
font-style: normal;
}
Invece di:
@font-face {
font-family: 'gothbook';
src: url('fonts/gothamrnd-book-webfont.eot');
src: url('fonts/gothamrnd-book-webfont.eot?#iefix') format('embedded-opentype'),
url('fonts/gothamrnd-book-webfont.woff') format('woff'),
url('fonts/gothamrnd-book-webfont.ttf') format('truetype'),
url('fonts/gothamrnd-book-webfont.svg#GothamRoundedBookRegular') format('svg');
font-weight: normal;
font-style: normal;
}
Esempi di questa correzione possono essere visti qui: Esempi di FontSpring Esempi di Adtrak
All'interno di Google Chrome clicca sulla chiave inglese > Opzioni > Sotto il cappuccio > [accanto a Contenuto web] clicca su Personalizza caratteri.
Cambia le impostazioni in modo che la tua pagina assomigli alla mia
Poi clicca sulla x, e vedi se il tuo problema è risolto.
Se questo non risolve il problema, potrebbe esserci un'altra cosa… ma aspetterò che tu provi questo.
Chrome prende il valore clearType di sistema per i font. In Windows 7 si spiega meglio. Su un Mac, l'anti-aliasing è abilitato per tutti i font sopra la dimensione 8, suppongo. Prova a attivare o a cambiare il clearType della tua macchina Windows
Update : Sembra che Chrome 22 e successivi ignorino le impostazioni di sistema per clearType
Ho avuto esattamente lo stesso problema, rendendo i webfont da http://www.google.com/webfonts in Chrome. Ho provato tutti i suggerimenti su questo e un paio di altri siti e nessuno di essi ha funzionato.
Alla fine ho iniziato a ispezionare le proprietà CSS del testo interessato, si è scoperto che era il colore del carattere a causare il problema. Un titolo dato color:#454545 rendeva male, ma lo stesso titolo dato il seguente: color:#333 funzionava bene. Grazie a Dio per i fogli di stile specifici dell'agente utente!
Chrome non rende bene i web font al momento. Ci sono diversi bug sul loro issue tracker per questo. Si prega di asteriscare qualsiasi rilevante a voi loro di dare loro più attenzione.
Per me non era l'impostazione ClearType in Windows 10.1 x64, ma è risultato essere un'impostazione nel mio browser Chrome chiamata DirectWrite.
chrome://flags/#directwrite Questo ha risolto il problema per me.
Ho avuto questo problema così gravemente in Windows XP SP3 che ha reso Chrome inutilizzabile a tutti gli effetti. Ho notato che avevo installato Clear Type Tuning nel pannello di controllo e ho provato a deselezionare “Enable Font Smoothing” nella scheda avanzata. Dopo aver riavviato Chrome. era ok, anche dopo aver attivato di nuovo Font Smoothing. Ho deciso di spuntare la casella “Apply all settings to defaults for new users and system”.
Vai a chrome://flags/ (o about:flags) e Disabilita l'opzione Override software rendering list.
Anche l'opzione Accelerated 2D canvas dovrebbe essere disabilitata.
Questa combinazione mi ha aiutato.
premi il tasto windows + r poi scrivi cttune.exe lì dentro
metodo alternativo è premere il tasto windows poi digitare cleartype poi selezionare Adjust ClearType Text
e seguire le istruzioni, se hai ancora problemi prova alcuni degli altri esempi
questo ha funzionato per me, devi provare i diversi esempi, è molto simile alla calibrazione del contrasto/luminosità ma per il testo invece
FYI: disabilitare l'accelerazione 2d potrebbe aiutare a far giocare chrome con lo strumento windows cleartype tune
Sembra che la risposta lunga e difficile sia che non puoi. Ci sono molte discussioni e suggerimenti nell'aiuto di Chrome , ma non vedo nulla che valga la pena suggerire.
La grande domanda è come fai a farlo sembrare così brutto! Sto usando Chrome per scrivere in questa casella… Ho anche fatto un bel po’ di zoom e non vedo niente come te. Se hai ancora domande dopo questo dovresti spiegare la tua configurazione alla comunità.
Anche se Chrome è “utilizzabile” per i caratteri, sembra sottile e slavata dove rende le linee diagonali specialmente. IE rende molto meglio ma IE è un browser più lento e anche FireFox.
Credo che questo sia inerente al codice di chrome.
BTW, HackToHell, dove devo andare per cambiare il colore del rendering?
Proverò così.
Se vuoi che i web font siano leggibili mentre hai ancora lo smoothing/cleartype disabilitato, allora la soluzione è disabilitare i web font in Google Chrome. In tal caso il browser userà i font standard del sistema operativo che sono resi correttamente quando cleartype/smoothing è disabilitato. Per farlo passate il flag /disable-remote-fonts a chrome.exe. Fai clic sulla scorciatoia di Google Chrome sul desktop, seleziona Proprietà, vai alla scheda Scorciatoia e imposta Destinazione a:
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" /disable-remote-fonts
Ci può essere un problema con i web font disabilitati. Se il sito web sta usando le icone dei web font, allora non verranno visualizzate.
Il problema corrispondente nel tracker di Chromium:
“System-wide ClearType setting not respected for web fonts https://code.google.com/p/chromium/issues/detail?id=319429